@athoscommerce/snap-preact 1.11.0 → 1.12.1-beta.152

package/dist/cjs/src/Instantiators/RecommendationInstantiator.js

@@ -47,6 +47,7 @@ class RecommendationInstantiator {
         this.client = services?.client || new snap_client_1.Client(this.config.client.globals, this.config.client.config);
         this.tracker = services?.tracker || new snap_tracker_1.Tracker(this.config.client.globals);
         this.logger = services?.logger || new snap_logger_1.Logger({ prefix: 'RecommendationInstantiator ', mode: this.mode });
+        this.quickviewManager = services?.quickviewManager;
         const profileCount = {};
         // script block targeter for "grouped" and "legacy" blocks
         this.targeter = new snap_toolbox_1.DomTargeter([
@@ -255,7 +256,7 @@ async function readyTheController(instance, services, targetElem, context, profi
         controller: controllerConfig,
         context,
         mode: instance.config.mode,
-    }, { client: instance.client, tracker: instance.tracker });
+    }, { client: instance.client, tracker: instance.tracker, quickviewManager: instance.quickviewManager });
     // mark element with controller id so cleanupStaleControllers knows it's active
     if (targetElem) {
         targetElem.setAttribute('ss-controller-id', controller.id);

package/dist/cjs/src/Snap.js

@@ -101,6 +101,9 @@ class Snap {
                 case snap_controller_1.ControllerTypes.recommendation:
                     importPromise = import('./create/createRecommendationController');
                     break;
+                case snap_controller_1.ControllerTypes.chat:
+                    importPromise = import('./create/createChatController');
+                    break;
                 case snap_controller_1.ControllerTypes.search:
                 default:
                     importPromise = import('./create/createSearchController');
@@ -123,6 +126,7 @@ class Snap {
                     profiler: services?.profiler,
                     logger: services?.logger,
                     tracker: services?.tracker || this.tracker,
+                    quickviewManager: services?.quickviewManager || this.quickviewManager,
                 });
             }
             if (callback) {
@@ -454,6 +458,44 @@ class Snap {
                 id: this.context.shopper.id,
             });
         }
+        // Create the quickview manager. Synchronous and ahead of controller creation below, so it can
+        // be passed to every controller as the 'quickview' service. The quickview *components* are
+        // still loaded on demand by the targeters.
+        if (this.config.quickview) {
+            try {
+                const { config: quickviewConfig, services: quickviewServices, targeters } = this.config.quickview;
+                this.quickviewManager = new snap_controller_1.QuickviewManager({
+                    store: quickviewServices?.store,
+                }, quickviewConfig);
+                targeters?.forEach((target, index) => {
+                    if (!target.selector) {
+                        throw new Error(`Quickview target at index ${index} missing selector value (string).`);
+                    }
+                    if (!target.component) {
+                        throw new Error(`Quickview target at index ${index} missing component value (Component).`);
+                    }
+                    new snap_toolbox_1.DomTargeter([{ ...target }], async (target, elem, originalElem) => {
+                        const onTarget = target.onTarget;
+                        onTarget && (await onTarget(target, elem, originalElem));
+                        try {
+                            // defer the component chunk until the first open
+                            await (0, mobx_1.when)(() => Boolean(this.quickviewManager?.store.isOpen));
+                            const Component = await target.component();
+                            setTimeout(() => {
+                                (0, preact_1.render)((0, jsx_runtime_1.jsx)(Component, { quickviewManager: this.quickviewManager, snap: this, ...target.props }), elem);
+                            });
+                        }
+                        catch (err) {
+                            this.logger.error(err);
+                            this.logger.error(COMPONENT_ERROR, target);
+                        }
+                    });
+                });
+            }
+            catch (err) {
+                this.logger.error(`Failed to create the Quickview Manager.`, err);
+            }
+        }
         // create controllers
         Object.keys(this.config?.controllers || {}).forEach((type) => {
             switch (type) {
@@ -477,6 +519,7 @@ class Snap {
                                 profiler: controller.services?.profiler,
                                 logger: controller.services?.logger,
                                 tracker: controller.services?.tracker || this.tracker,
+                                quickviewManager: controller.services?.quickviewManager || this.quickviewManager,
                             });
                             window.athos.controller = window.athos.controller || {};
                             window.athos.controller[cntrlr.config.id] = this.controllers[cntrlr.config.id] = cntrlr;
@@ -544,6 +587,73 @@ class Snap {
                     });
                     break;
                 }
+                case 'chat': {
+                    this.config.controllers[type].forEach((controller, index) => {
+                        if (typeof this._controllerPromises[controller.config.id] != 'undefined') {
+                            this.logger.error(`Controller with id '${controller.config.id}' is already defined`);
+                            return;
+                        }
+                        this._controllerPromises[controller.config.id] = new Promise(async (resolve) => {
+                            try {
+                                // `_initialized` is only set after the awaited init fires, so two chat
+                                // targeters would otherwise both re-run the init middleware
+                                let initialized = false;
+                                const targetFunction = async (target, elem, originalElem) => {
+                                    const onTarget = target.onTarget;
+                                    onTarget && (await onTarget(target, elem, originalElem));
+                                    try {
+                                        const importPromises = [];
+                                        // dynamically import the component
+                                        importPromises.push(target.component());
+                                        const importResolutions = await Promise.all(importPromises);
+                                        const Component = importResolutions[0];
+                                        setTimeout(() => {
+                                            (0, preact_1.render)((0, jsx_runtime_1.jsx)(Component, { controller: this.controllers[controller.config.id], snap: this, ...target.props }), elem);
+                                        });
+                                    }
+                                    catch (err) {
+                                        this.logger.error(err);
+                                        this.logger.error(COMPONENT_ERROR, target);
+                                    }
+                                };
+                                if (!controller?.targeters || controller?.targeters.length === 0) {
+                                    const cntrlr = await this._createController(snap_controller_1.ControllerTypes.chat, controller.config, controller.services, controller.url, controller.context, (cntrlr) => {
+                                        if (cntrlr)
+                                            resolve(cntrlr);
+                                    });
+                                    if (!cntrlr.initialized)
+                                        cntrlr.init();
+                                }
+                                controller?.targeters?.forEach((target, target_index) => {
+                                    if (!target.selector) {
+                                        throw new Error(`Targets at index ${target_index} missing selector value (string).`);
+                                    }
+                                    if (!target.component) {
+                                        throw new Error(`Targets at index ${target_index} missing component value (Component).`);
+                                    }
+                                    target = (0, utils_1.applyChatTargetInject)(target);
+                                    const targeter = new snap_toolbox_1.DomTargeter([{ ...target }], async (target, elem, originalElem) => {
+                                        const cntrlr = await this._createController(snap_controller_1.ControllerTypes.chat, controller.config, controller.services, controller.url, controller.context, (cntrlr) => {
+                                            if (cntrlr)
+                                                resolve(cntrlr);
+                                        });
+                                        if (!initialized) {
+                                            initialized = true;
+                                            if (!cntrlr.initialized)
+                                                cntrlr.init();
+                                        }
+                                        targetFunction({ controller: cntrlr, ...target }, elem, originalElem);
+                                        cntrlr.addTargeter(targeter);
+                                    });
+                                });
+                            }
+                            catch (err) {
+                                this.logger.error(`Failed to instantiate ${type} controller at index ${index}.`, err);
+                            }
+                        });
+                    });
+                    break;
+                }
                 case 'autocomplete': {
                     this.config.controllers[type].forEach((controller, index) => {
                         if (typeof this._controllerPromises[controller.config.id] != 'undefined') {
@@ -758,6 +868,7 @@ class Snap {
                         tracker: this.tracker,
                         logger: this.logger,
                         snap: this,
+                        quickviewManager: this.quickviewManager,
                     }, this.context);
                 });
             }

package/dist/cjs/src/Templates/SnapTemplates.js

@@ -3,9 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createSearchTargeters = exports.SnapTemplates = exports.applyAutomaticThemeOverrides = exports.TAB_PREFIXED_PARAMS = exports.DEFAULT_AUTOCOMPLETE_CONTROLLER_SETTINGS = exports.DEFAULT_FEATURES = exports.TEMPLATE_EDITOR_UI_PARAM = exports.TEMPLATE_EDITOR_COOKIE = void 0;
+exports.createChatTargeters = exports.createSearchTargeters = exports.SnapTemplates = exports.applyAutomaticThemeOverrides = exports.TAB_PREFIXED_PARAMS = exports.DEFAULT_AUTOCOMPLETE_CONTROLLER_SETTINGS = exports.DEFAULT_FEATURES = exports.TEMPLATE_EDITOR_UI_PARAM = exports.TEMPLATE_EDITOR_COOKIE = void 0;
+exports.validateTemplatesConfig = validateTemplatesConfig;
+exports.validateTemplatesConfigUnlocked = validateTemplatesConfigUnlocked;
 exports.mapBreakpoints = mapBreakpoints;
 exports.createAutocompleteTargeters = createAutocompleteTargeters;
+exports.createQuickviewTargeters = createQuickviewTargeters;
 exports.createRecommendationComponentMapping = createRecommendationComponentMapping;
 exports.createSnapConfig = createSnapConfig;
 exports.createPlugins = createPlugins;
@@ -17,6 +20,7 @@ const Snap_1 = require("../Snap");
 const TemplateSelect_1 = require("../../components/src/components/Atoms/TemplateSelect");
 const snap_toolbox_1 = require("@athoscommerce/snap-toolbox");
 const TemplateStore_1 = require("./Stores/TemplateStore");
+const TargetStore_1 = require("./Stores/TargetStore");
 const TabManagerStore_1 = require("./Stores/TabManagerStore");
 const snap_client_1 = require("@athoscommerce/snap-client");
 const snap_tracker_1 = require("@athoscommerce/snap-tracker");
@@ -24,6 +28,12 @@ const shopify_1 = require("@athoscommerce/snap-platforms/shopify");
 const utils_1 = require("../utils");
 exports.TEMPLATE_EDITOR_COOKIE = 'athosEditor';
 exports.TEMPLATE_EDITOR_UI_PARAM = 'athos-editor';
+function validateTemplatesConfig(config) {
+    return config;
+}
+function validateTemplatesConfigUnlocked(config) {
+    return config;
+}
 exports.DEFAULT_FEATURES = {};
 exports.DEFAULT_AUTOCOMPLETE_CONTROLLER_SETTINGS = {
     trending: {
@@ -210,6 +220,36 @@ const createSearchTargeters = (templateConfig, templatesStore) => {
     });
 };
 exports.createSearchTargeters = createSearchTargeters;
+const createChatTargeters = (templateConfig, templatesStore) => {
+    // initial target configs
+    const targetConfigs = templateConfig.chat?.targets || [];
+    let mergedConfigs;
+    if (templatesStore.settings.editMode) {
+        const overrideConfigs = (templatesStore.storage.get('overrides.targets.chat') || []);
+        mergedConfigs = (0, deepmerge_1.default)(targetConfigs, overrideConfigs, { arrayMerge: utils_1.combineMerge });
+    }
+    else {
+        mergedConfigs = targetConfigs;
+    }
+    return mergedConfigs.map((targetConfig) => {
+        const target = templatesStore.addTarget({ ...targetConfig, type: 'chat' });
+        const targeter = {
+            selector: targetConfig.selector,
+            // inline selectors (e.g. a nav slot) may render after DOMContentLoaded;
+            // re-injection at already-targeted elements is prevented by DomTargeter
+            autoRetarget: true,
+            component: async () => {
+                const componentImportPromises = [];
+                componentImportPromises.push(templatesStore.library.import.component.chat[targetConfig.component]());
+                await Promise.all(componentImportPromises);
+                return TemplateSelect_1.TemplateSelect;
+            },
+            props: { target, templatesStore },
+        };
+        return (0, utils_1.applyChatTargetInject)(targeter);
+    });
+};
+exports.createChatTargeters = createChatTargeters;
 function createAutocompleteTargeters(templateConfig, templatesStore) {
     // initial target configs
     const targetConfigs = templateConfig.autocomplete?.targets || [];
@@ -245,6 +285,36 @@ function createAutocompleteTargeters(templateConfig, templatesStore) {
         return targeter;
     });
 }
+function createQuickviewTargeters(templateConfig, templatesStore) {
+    return (templateConfig.quickview?.targets?.map((targetConfig, index) => {
+        // Quickview isn't part of the editable targets registry (it's appended to <body> and driven by the
+        // QuickviewManager), so build a TargetStore directly rather than via addTarget. This lets the
+        // component render through TemplateSelect — the same wrapper used by search/autocomplete — which
+        // provides the global templates ThemeProvider. Without it the quickview renders outside the
+        // templates theme, falling back to production-mode prop merging where theme overrides (e.g.
+        // `quickviewLayout`) are silently dropped.
+        const target = new TargetStore_1.TargetStore({
+            target: { type: 'quickview', selector: targetConfig.selector || 'body', component: targetConfig.component, index },
+        });
+        const targeter = {
+            selector: targetConfig.selector || 'body',
+            inject: {
+                action: 'append',
+                element: () => {
+                    const el = document.createElement('div');
+                    el.id = index === 0 ? 'athos-quickview' : `athos-quickview-${index}`;
+                    return el;
+                },
+            },
+            component: async () => {
+                await templatesStore.library.import.component.quickview[targetConfig.component]();
+                return TemplateSelect_1.TemplateSelect;
+            },
+            props: { target, templatesStore },
+        };
+        return targeter;
+    }) || []);
+}
 function createRecommendationComponentMapping(templateConfig, templatesStore) {
     // TODO: throw a warning if keys match inside each recommendation type
     return Object.keys(templateConfig.recommendation || {})
@@ -306,6 +376,7 @@ function createTabServices(snapConfig, siteId) {
 function createSnapConfig(templateConfig, templatesStore) {
     const initiatorPrefix = window?.athos?.managed ? `managed/` : '';
     const snapConfig = {
+        mode: templateConfig.config?.mode,
         features: templateConfig.features || exports.DEFAULT_FEATURES,
         client: {
             globals: {},
@@ -506,6 +577,32 @@ function createSnapConfig(templateConfig, templatesStore) {
         // }
         snapConfig.instantiators.recommendation = recommendationInstantiatorConfig;
     }
+    /* CHAT CONTROLLER */
+    if (templateConfig.chat && snapConfig.controllers) {
+        const chatControllerConfig = {
+            config: {
+                id: 'chat',
+                plugins: createPlugins(templateConfig, templatesStore, 'chat'),
+                settings: {
+                    languageCode: templatesStore.language,
+                    ...(templateConfig.chat.settings || {}),
+                },
+            },
+            targeters: (0, exports.createChatTargeters)(templateConfig, templatesStore),
+        };
+        snapConfig.controllers.chat = [chatControllerConfig];
+    }
+    /* QUICKVIEW MANAGER — injects quickview component(s) into <body> when enabled */
+    if (templateConfig.quickview) {
+        const quickviewSettings = templateConfig.quickview?.settings;
+        snapConfig.quickview = {
+            config: {
+                id: 'quickview',
+                ...(quickviewSettings ? { settings: quickviewSettings } : {}),
+            },
+            targeters: createQuickviewTargeters(templateConfig, templatesStore),
+        };
+    }
     return snapConfig;
 }
 function createPlugins(templateConfig, templatesStore, controllerType) {
@@ -514,10 +611,14 @@ function createPlugins(templateConfig, templatesStore, controllerType) {
     if (controllerType) {
         controllerConfig = templateConfig[controllerType] || {};
     }
-    plugins.push([
-        templatesStore.library.import.plugins.common.backgroundFilters,
-        (0, deepmerge_1.default)(templateConfig.plugins?.common?.backgroundFilters || {}, controllerConfig?.plugins?.common?.backgroundFilters || {}),
-    ]);
+    // backgroundFilters writes `config.globals.filters`, which the chat endpoint has no
+    // field for — chat carries background filters via `settings.bgFilters` instead
+    if (controllerType !== 'chat') {
+        plugins.push([
+            templatesStore.library.import.plugins.common.backgroundFilters,
+            (0, deepmerge_1.default)(templateConfig.plugins?.common?.backgroundFilters || {}, controllerConfig?.plugins?.common?.backgroundFilters || {}),
+        ]);
+    }
     plugins.push([
         templatesStore.library.import.plugins.common.scrollToTop,
         (0, deepmerge_1.default)(templateConfig.plugins?.common?.scrollToTop || {}, controllerConfig?.plugins?.common?.scrollToTop || {}),

package/dist/cjs/src/Templates/Stores/LibraryStore.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LibraryStore = void 0;
+exports.LibraryStore = exports.currencyCodes = void 0;
 const TemplateStore_1 = require("./TemplateStore");
 const themeComponents_1 = require("../../../components/src/providers/themeComponents");
 const pluginBackgroundFilters_1 = require("./library/plugins/shopify/pluginBackgroundFilters");
@@ -18,17 +18,40 @@ const pluginScrollToTop_1 = require("./library/plugins/common/pluginScrollToTop"
 const pluginLogger_1 = require("./library/plugins/common/pluginLogger");
 const pluginKlaviyoEvents_1 = require("./library/plugins/common/pluginKlaviyoEvents");
 const CustomComponent_1 = require("./library/components/CustomComponent");
+const currencies_1 = require("./library/currencies/currencies");
+exports.currencyCodes = Object.keys(currencies_1.currencies);
 class LibraryStore {
     constructor(params) {
         this.themes = {};
         this.components = {
             search: {},
             autocomplete: {},
+            quickview: {},
             recommendation: {
                 bundle: {},
                 default: {},
                 email: {},
             },
+            chat: {},
+            chatButton: {},
+            chatLoadingIndicator: {},
+            chatAttachmentContext: {},
+            chatInspirationResultMessage: {},
+            chatMessageText: {},
+            chatMessageUser: {},
+            chatProductComparisonMessage: {},
+            chatProductQueryMessage: {},
+            chatResult: {},
+            chatResultsDisplay: {},
+            chatSuggestedQuestions: {},
+            chatComparisonsTray: {},
+            chatComposer: {},
+            chatFacetsBar: {},
+            chatHistory: {},
+            chatMessages: {},
+            chatSessionFeedback: {},
+            chatSideChat: {},
+            chatTopicDrift: {},
             badge: {},
             result: {},
             overlayResult: {},
@@ -50,6 +73,7 @@ class LibraryStore {
             paginationInfo: {},
             slideshow: {},
             price: {},
+            productDetail: {},
             skeleton: {},
             modal: {},
             calloutBadge: {},
@@ -66,10 +90,12 @@ class LibraryStore {
             facetPaletteOptions: {},
             facetSlider: {},
             filter: {},
+            gallery: {},
             loadMore: {},
             overlayBadge: {},
             pagination: {},
             perPage: {},
+            quantityPicker: {},
             radioList: {},
             rating: {},
             searchInput: {},
@@ -79,6 +105,7 @@ class LibraryStore {
             swatches: {},
             tabSelection: {},
             variantSelection: {},
+            productDetailTable: {},
             terms: {},
             branchOverride: {},
             facet: {},
@@ -159,6 +186,16 @@ class LibraryStore {
                             (this.components.autocomplete.AutocompleteModal = (await import('./library/components/AutocompleteModal')).AutocompleteModal));
                     },
                 },
+                quickview: {
+                    QuickviewModal: async () => {
+                        return (this.components.quickview.QuickviewModal ||
+                            (this.components.quickview.QuickviewModal = (await import('./library/components/QuickviewModal')).QuickviewModal));
+                    },
+                    QuickviewSlideout: async () => {
+                        return (this.components.quickview.QuickviewSlideout ||
+                            (this.components.quickview.QuickviewSlideout = (await import('./library/components/QuickviewSlideout')).QuickviewSlideout));
+                    },
+                },
                 search: {
                     SearchCollapsible: async () => {
                         return (this.components.search.SearchCollapsible ||
@@ -208,6 +245,33 @@ class LibraryStore {
                         },
                     },
                 },
+                chat: {
+                    Chat: async () => {
+                        return this.components.chat.Chat || (this.components.chat.Chat = (await import('./library/components/Chat')).Chat);
+                    },
+                    ChatButton: async () => {
+                        return this.components.chat.ChatButton || (this.components.chat.ChatButton = (await import('./library/components/ChatButton')).ChatButton);
+                    },
+                },
+                chatButton: {},
+                chatLoadingIndicator: {},
+                chatAttachmentContext: {},
+                chatInspirationResultMessage: {},
+                chatMessageText: {},
+                chatMessageUser: {},
+                chatProductComparisonMessage: {},
+                chatProductQueryMessage: {},
+                chatResult: {},
+                chatResultsDisplay: {},
+                chatSuggestedQuestions: {},
+                chatComparisonsTray: {},
+                chatComposer: {},
+                chatFacetsBar: {},
+                chatHistory: {},
+                chatMessages: {},
+                chatSessionFeedback: {},
+                chatSideChat: {},
+                chatTopicDrift: {},
                 badge: {},
                 result: {
                     Result: async () => {
@@ -237,6 +301,7 @@ class LibraryStore {
                 paginationInfo: {},
                 slideshow: {},
                 price: {},
+                productDetail: {},
                 skeleton: {},
                 modal: {},
                 calloutBadge: {},
@@ -253,10 +318,12 @@ class LibraryStore {
                 facetPaletteOptions: {},
                 facetSlider: {},
                 filter: {},
+                gallery: {},
                 loadMore: {},
                 overlayBadge: {},
                 pagination: {},
                 perPage: {},
+                quantityPicker: {},
                 radioList: {},
                 rating: {},
                 searchInput: {},
@@ -266,6 +333,7 @@ class LibraryStore {
                 swatches: {},
                 tabSelection: {},
                 variantSelection: {},
+                productDetailTable: {},
                 terms: {},
                 branchOverride: {},
                 facet: {},
@@ -280,27 +348,74 @@ class LibraryStore {
                 termsList: {},
             },
             language: {
+                // English
                 en: async () => {
                     return this.locales.languages.en || (this.locales.languages.en = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/en')).en));
                 },
+                // French
                 fr: async () => {
                     return this.locales.languages.fr || (this.locales.languages.fr = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/fr')).fr));
                 },
+                // Spanish
                 es: async () => {
                     return this.locales.languages.es || (this.locales.languages.es = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/es')).es));
                 },
-            },
-            currency: {
-                usd: async () => {
-                    return this.locales.currencies.usd || (this.locales.currencies.usd = (await import('./library/currencies/usd')).usd);
+                // Arabic
+                ar: async () => {
+                    return this.locales.languages.ar || (this.locales.languages.ar = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/ar')).ar));
+                },
+                // Chinese
+                zh: async () => {
+                    return this.locales.languages.zh || (this.locales.languages.zh = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/zh')).zh));
+                },
+                // German
+                de: async () => {
+                    return this.locales.languages.de || (this.locales.languages.de = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/de')).de));
+                },
+                // Russian
+                ru: async () => {
+                    return this.locales.languages.ru || (this.locales.languages.ru = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/ru')).ru));
+                },
+                // Japanese
+                ja: async () => {
+                    return this.locales.languages.ja || (this.locales.languages.ja = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/ja')).ja));
+                },
+                // Portuguese
+                pt: async () => {
+                    return this.locales.languages.pt || (this.locales.languages.pt = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/pt')).pt));
+                },
+                // Korean
+                ko: async () => {
+                    return this.locales.languages.ko || (this.locales.languages.ko = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/ko')).ko));
+                },
+                // Italian
+                it: async () => {
+                    return this.locales.languages.it || (this.locales.languages.it = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/it')).it));
+                },
+                // Hindi
+                hi: async () => {
+                    return this.locales.languages.hi || (this.locales.languages.hi = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/hi')).hi));
+                },
+                // Turkish
+                tr: async () => {
+                    return this.locales.languages.tr || (this.locales.languages.tr = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/tr')).tr));
                 },
-                eur: async () => {
-                    return this.locales.currencies.eur || (this.locales.currencies.eur = (await import('./library/currencies/eur')).eur);
+                // Vietnamese
+                vi: async () => {
+                    return this.locales.languages.vi || (this.locales.languages.vi = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/vi')).vi));
                 },
-                aud: async () => {
-                    return this.locales.currencies.aud || (this.locales.currencies.aud = (await import('./library/currencies/aud')).aud);
+                // Dutch
+                nl: async () => {
+                    return this.locales.languages.nl || (this.locales.languages.nl = (0, TemplateStore_1.transformTranslationsToTheme)((await import('./library/languages/nl')).nl));
                 },
             },
+            // the per-code importers keep the same async shape as language/theme importers, resolving from the statically imported currencies module
+            currency: exports.currencyCodes.reduce((currencyImports, code) => {
+                currencyImports[code] = async () => {
+                    return this.locales.currencies[code] || (this.locales.currencies[code] = currencies_1.currencies[code]);
+                };
+                return currencyImports;
+            }, {}),
         };
         const { components, unlocked } = params || {};
         this.allowedComponentTypes = unlocked ? [...themeComponents_1.ALL_CUSTOM_COMPONENT_TYPES] : [...themeComponents_1.DEFAULT_CUSTOM_COMPONENT_TYPES];
@@ -331,7 +446,10 @@ class LibraryStore {
     async addComponentImport(type, name, componentFn) {
         // only allow certain types based on unlocked status
         if (this.allowedComponentTypes.includes(type) && this.components[type]) {
-            this.import.component[type][name] = async () => {
+            // `chat` declares its library entry with literal keys so template targets stay
+            // literal-checked; custom overrides register by arbitrary name, hence the cast
+            const componentImports = this.import.component[type];
+            componentImports[name] = async () => {
                 return (this.components[type][name] ||
                     (this.components[type][name] = await (0, CustomComponent_1.CustomComponent)({
                         type,

package/dist/cjs/src/Templates/Stores/TemplateEditor/TemplateEditorStore.js

@@ -202,7 +202,12 @@ class TemplateEditorStore {
         this.templatesStore = templatesStore;
         this.storage = new snap_toolbox_1.StorageStore({ type: snap_toolbox_1.StorageType.local, key: TemplateStore_1.TEMPLATE_STORE_KEY });
         this.storedState = this.storage.get('editor') || this.storedState;
-        this.initial.config = (0, deepmerge_1.default)(this.initial.config, templatesStore.config?.config || {});
+        const { language: configLanguage, currency: configCurrency, ...restConfig } = templatesStore.config?.config || {};
+        this.initial.config = (0, deepmerge_1.default)(this.initial.config, {
+            ...restConfig,
+            ...(configLanguage ? { language: configLanguage.toLowerCase() } : {}),
+            ...(configCurrency ? { currency: configCurrency.toLowerCase() } : {}),
+        });
         this.initial.controller = {}; // set when registering controllers
         // set initial targets
         if (templatesStore.config.search?.targets)

package/dist/cjs/src/Templates/Stores/TemplateEditor/uiAbstractions/configUI.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.configUI = void 0;
+const LibraryStore_1 = require("../../LibraryStore");
 const configUI = (store) => {
     return [
         {
@@ -93,11 +94,7 @@ const configUI = (store) => {
                     getDisplayState: () => 'visible',
                     getOptions: () => [
                         {
-                            options: [
-                                { label: 'USD', value: 'usd' },
-                                { label: 'EUR', value: 'eur' },
-                                { label: 'AUD', value: 'aud' },
-                            ],
+                            options: LibraryStore_1.currencyCodes.map((code) => ({ label: code.toUpperCase(), value: code })),
                         },
                     ],
                     getValue: () => {