@mmstack/translate 19.2.7 → 19.3.0

package/fesm2022/mmstack-translate.mjs

@@ -1,6 +1,8 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, signal, LOCALE_ID, computed, Injectable, isSignal, isDevMode, input, Renderer2, ElementRef, effect, Directive } from '@angular/core';
+import { computed, inject, InjectionToken, LOCALE_ID, signal, resource, untracked, isDevMode, effect, Injectable, isSignal, input, Renderer2, ElementRef, afterRenderEffect, Directive, ChangeDetectorRef } from '@angular/core';
 import { createIntlCache, createIntl } from '@formatjs/intl';
+import { toSignal } from '@angular/core/rxjs-interop';
+import { Router, ActivatedRoute } from '@angular/router';
 
 const KEY_DELIM = '::MMT_DELIM::';
 function prependDelim(prefix, key) {
@@ -53,27 +55,97 @@ function createNamespace(ns, translation) {
     return namespace;
 }
 
+function pathParam(key, route = inject(ActivatedRoute)) {
+    const keySignal = typeof key === 'string' ? computed(() => key) : computed(key);
+    const routerOptions = inject(Router)['options'];
+    if (routerOptions &&
+        typeof routerOptions === 'object' &&
+        routerOptions.paramsInheritanceStrategy === 'always') {
+        const params = toSignal(route.paramMap, {
+            initialValue: route.snapshot.paramMap,
+        });
+        return computed(() => params().get(keySignal()));
+    }
+    const paramMapSignals = [];
+    let currentRoute = route;
+    const isStatic = typeof key === 'string';
+    while (currentRoute) {
+        const initial = currentRoute.snapshot.paramMap;
+        paramMapSignals.push(toSignal(currentRoute.paramMap, {
+            initialValue: initial,
+        }));
+        // For static keys, stop once we find the param, will find first in computed for loop already so basically noop for for loop
+        if (isStatic && initial.has(key))
+            break;
+        currentRoute = currentRoute.parent;
+    }
+    return computed(() => {
+        const paramKey = keySignal();
+        for (const map of paramMapSignals) {
+            const v = map().get(paramKey);
+            if (v)
+                return v;
+        }
+        return null;
+    });
+}
+
 const CONFIG_TOKEN = new InjectionToken('mmstack-intl-config');
 function provideIntlConfig(config) {
-    return {
-        useValue: config,
-        provide: CONFIG_TOKEN,
-    };
+    const providers = [
+        {
+            useFactory: (localeId) => {
+                const next = {
+                    ...config,
+                };
+                const defaultLocale = config.defaultLocale ?? config.supportedLocales?.at(0) ?? localeId;
+                if (next.supportedLocales &&
+                    !next.supportedLocales.includes(defaultLocale)) {
+                    next.supportedLocales = [...next.supportedLocales, defaultLocale];
+                }
+                return next;
+            },
+            deps: [LOCALE_ID],
+            provide: CONFIG_TOKEN,
+        },
+    ];
+    const defaultLocale = config.defaultLocale ?? config.supportedLocales?.at(0);
+    if (!defaultLocale)
+        return providers;
+    providers.push({
+        provide: LOCALE_ID,
+        useValue: defaultLocale,
+    });
+    return providers;
 }
 function injectIntlConfig() {
     return inject(CONFIG_TOKEN, { optional: true }) ?? undefined;
 }
 function injectDefaultLocale() {
-    return injectIntlConfig()?.defaultLocale ?? 'en-US';
+    return injectIntlConfig()?.defaultLocale ?? inject(LOCALE_ID) ?? 'en-US';
+}
+function injectSupportedLocales() {
+    return injectIntlConfig()?.supportedLocales ?? [injectDefaultLocale()];
+}
+/**
+ * @internal
+ * the actual locale signal used to store the current locale string
+ */
+const STORE_LOCALE = signal('en-US');
+function injectLocaleInternal() {
+    return STORE_LOCALE;
 }
 class TranslationStore {
     cache = createIntlCache();
     config = injectIntlConfig();
-    locale = signal(inject(LOCALE_ID));
+    loadQueue = signal([]);
+    locale;
     defaultLocale = injectDefaultLocale();
     translations = signal({
         [this.defaultLocale]: {},
     });
+    attemptedFallbackLoad = false;
+    onDemandLoaders = new Map();
     nonMessageConfig = computed(() => ({
         ...this.config,
         locale: this.locale(),
@@ -81,19 +153,107 @@ class TranslationStore {
     messages = computed(() => this.translations()[this.locale()] ??
         this.translations()[this.defaultLocale] ??
         {});
+    dynamicLocaleLoader = resource({
+        request: computed(() => this.loadQueue().at(0) ?? null),
+        loader: async ({ request: newLocale, abortSignal }) => {
+            if (!newLocale)
+                return;
+            const currentTranslations = untracked(this.translations);
+            const loadPromises = [];
+            for (const [namespace, loaders] of this.onDemandLoaders.entries()) {
+                const loader = loaders[newLocale];
+                if (loader) {
+                    const hasNamespaceForLocale = currentTranslations[newLocale] &&
+                        Object.keys(currentTranslations[newLocale]).some((key) => key.startsWith(`${prependDelim(namespace, '').slice(0, -1)}`));
+                    if (!hasNamespaceForLocale) {
+                        loadPromises.push(loader()
+                            .then((translation) => {
+                            if (abortSignal.aborted)
+                                return null;
+                            return {
+                                namespace: translation.namespace,
+                                flat: translation.flat,
+                            };
+                        })
+                            .catch((err) => {
+                            if (isDevMode()) {
+                                console.error('[Translate] Failed to load', namespace, newLocale, err);
+                            }
+                            return null;
+                        }));
+                    }
+                }
+            }
+            return Promise.all(loadPromises)
+                .then((res) => res.filter((r) => r !== null))
+                .then((res) => ({
+                locales: res,
+                locale: newLocale,
+            }));
+        },
+    });
     intl = computed(() => createIntl({
         ...this.nonMessageConfig(),
         messages: this.messages(),
     }, this.cache));
+    constructor() {
+        this.locale = STORE_LOCALE;
+        this.locale.set(injectDefaultLocale());
+        const paramName = this.config?.localeParamName;
+        if (paramName) {
+            const param = pathParam(paramName);
+            effect(() => {
+                const loc = param();
+                if (!loc ||
+                    loc === untracked(this.locale) ||
+                    untracked(this.loadQueue).includes(loc))
+                    return;
+                if (this.hasLocaleLoaders(loc))
+                    this.locale.set(loc);
+                else
+                    this.loadQueue.update((q) => [...q, loc]);
+            });
+        }
+        effect(() => {
+            if (
+            // should never be in error state, but best to check in case something throws
+            this.dynamicLocaleLoader.error() ||
+                this.dynamicLocaleLoader.isLoading())
+                return;
+            const dynamicLocales = this.dynamicLocaleLoader.value();
+            if (!dynamicLocales)
+                return;
+            // Register loaded translations
+            for (const locale of dynamicLocales.locales) {
+                this.register(locale.namespace, {
+                    [dynamicLocales.locale]: locale.flat,
+                });
+            }
+            const hasTranslations = dynamicLocales.locales.length > 0 ||
+                this.translations()[dynamicLocales.locale];
+            if (hasTranslations) {
+                this.loadQueue.update((q) => q.filter((l) => l !== dynamicLocales.locale));
+                this.locale.set(dynamicLocales.locale);
+            }
+        });
+    }
     formatMessage(key, values) {
-        const message = this.translations()[this.locale()]?.[key] ?? '';
-        if (!message)
+        const message = this.translations()[this.locale()]?.[key] ??
+            this.translations()[this.defaultLocale]?.[key] ??
+            '';
+        if (!message) {
+            if (this.attemptedFallbackLoad)
+                return '';
+            this.attemptedFallbackLoad = true;
+            untracked(() => {
+                if (!this.loadQueue().includes(this.defaultLocale))
+                    this.loadQueue.update((q) => [...q, this.defaultLocale]);
+            });
             return '';
+        }
         return this.intl().formatMessage({ id: key, defaultMessage: message }, values);
     }
-    register(namespace, flat, locale) {
-        console.log(locale);
-        this.locale.set(locale);
+    register(namespace, flat) {
         this.translations.update((cur) => {
             return Object.entries(flat).reduce((acc, [locale, translation]) => {
                 const localeTranslation = acc[locale] ?? {};
@@ -109,18 +269,309 @@ class TranslationStore {
             }, { ...cur });
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TranslationStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TranslationStore, providedIn: 'root' });
+    registerOnDemandLoaders(namespace, loaders) {
+        this.onDemandLoaders.set(namespace, loaders);
+    }
+    hasLocaleLoaders(locale) {
+        return Array.from(this.onDemandLoaders.values()).some((loaders) => loaders[locale]);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TranslationStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TranslationStore, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TranslationStore, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TranslationStore, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }] });
+        }], ctorParameters: () => [] });
 function injectIntl() {
     return inject(TranslationStore).intl;
 }
+/**
+ * Inject a dynamic locale signal that supports runtime language switching.
+ *
+ * @returns A writable signal with the current locale and loading state.
+ * Only allows switching to locales that have registered loaders.
+ *
+ * @example
+ * ```typescript
+ * const locale = injectDynamicLocale();
+ *
+ * // Switch language (triggers automatic translation loading)
+ * locale.set('sl-SI');
+ *
+ * // Check loading state
+ * if (locale.isLoading()) {
+ *   // Show spinner
+ * }
+ * ```
+ */
+function injectDynamicLocale() {
+    const store = inject(TranslationStore);
+    const supportedLocales = injectIntlConfig()?.supportedLocales;
+    const source = computed(() => store.locale());
+    const inSupportedLocales = supportedLocales === undefined
+        ? () => true
+        : (locale) => supportedLocales.includes(locale);
+    const set = (value) => {
+        if (value === untracked(source) ||
+            untracked(store.loadQueue).includes(value))
+            return;
+        if (!inSupportedLocales(value)) {
+            if (isDevMode())
+                console.warn(`[Translate] Locale "${value}" is not in supportedLocales, switch prevented. Available options are:`, supportedLocales);
+            return;
+        }
+        if (isDevMode() && !store.hasLocaleLoaders(value))
+            console.warn(`[Translate] No loaders registered for locale "${value}". Switching to this locale will have no effect.`);
+        store.loadQueue.update((q) => [...q, value]);
+    };
+    source.set = set;
+    source.update = (updater) => {
+        const next = updater(untracked(source));
+        source.set(next);
+    };
+    source.asReadonly = () => source;
+    source.isLoading = store.dynamicLocaleLoader.isLoading;
+    return source;
+}
+
+function unwrap(value) {
+    return isSignal(value) ? value() : value;
+}
+
+const FORMAT_PRESETS = {
+    short: { dateStyle: 'short', timeStyle: 'short' },
+    medium: { dateStyle: 'medium', timeStyle: 'medium' },
+    long: { dateStyle: 'long', timeStyle: 'long' },
+    full: { dateStyle: 'full', timeStyle: 'full' },
+    shortDate: { dateStyle: 'short' },
+    mediumDate: { dateStyle: 'medium' },
+    longDate: { dateStyle: 'long' },
+    fullDate: { dateStyle: 'full' },
+    shortTime: { timeStyle: 'short' },
+    mediumTime: { timeStyle: 'medium' },
+    longTime: { timeStyle: 'long' },
+    fullTime: { timeStyle: 'full' },
+};
+function validDateOrNull(date) {
+    if (date == null)
+        return null;
+    const d = date instanceof Date ? date : new Date(date);
+    return isNaN(d.getTime()) ? null : d;
+}
+const cache$4 = new Map();
+function getFormatter$4(locale, format, timeZone) {
+    const cacheKey = `${locale}|${format}|${timeZone ?? ''}`;
+    let formatter = cache$4.get(cacheKey);
+    if (!formatter) {
+        formatter = new Intl.DateTimeFormat(locale, {
+            ...FORMAT_PRESETS[format],
+            timeZone,
+        });
+        cache$4.set(cacheKey, formatter);
+    }
+    return formatter;
+}
+/**
+ * Format a date using the current or provided locale & timezone
+ * By default it is reactive to the global dynamic locale, works best when wrapped in a computed() if you need to react to locale changes
+ *
+ * @param date - Date to format
+ * @param opt - Options for formatting
+ * @returns Formatted date string
+ */
+function formatDate(date, opt) {
+    const validDate = validDateOrNull(unwrap(date));
+    if (validDate === null)
+        return '';
+    const unwrappedOpt = unwrap(opt);
+    const loc = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return getFormatter$4(loc, unwrappedOpt?.format ?? 'medium', unwrappedOpt?.tz).format(validDate);
+}
+
+const cache$3 = new Map();
+function getFormatter$3(locale, type, style) {
+    const cacheKey = `${locale}|${type}|${style}`;
+    let formatter = cache$3.get(cacheKey);
+    if (!formatter) {
+        formatter = new Intl.DisplayNames(locale, {
+            type,
+            style,
+        });
+        cache$3.set(cacheKey, formatter);
+    }
+    return formatter;
+}
+/**
+ * Format a display name using the current or provided locale
+ * By default it is reactive to the global dynamic locale, works best when wrapped in a computed() if you need to react to locale changes
+ *
+ * @param value - The code to format
+ * @param type - The type of display name to format
+ * @param opt - Options for formatting
+ * @returns Formatted display name string
+ */
+function formatDisplayName(value, type, opt) {
+    const unwrapped = unwrap(value);
+    if (!unwrapped?.trim())
+        return '';
+    const unwrappedType = unwrap(type);
+    const unwrappedOpt = unwrap(opt);
+    const locale = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return (getFormatter$3(locale, unwrappedType, unwrappedOpt?.style ?? 'long').of(unwrapped) ?? '');
+}
+
+const cache$2 = new Map();
+const EMPTY_ARRAY = [];
+function unwrapList(value) {
+    const unwrapped = unwrap(value);
+    return Array.isArray(unwrapped) ? unwrapped : EMPTY_ARRAY;
+}
+function getFormatter$2(locale, type, style) {
+    const cacheKey = `${locale}|${type}|${style}`;
+    let formatter = cache$2.get(cacheKey);
+    if (!formatter) {
+        formatter = new Intl.ListFormat(locale, { type, style });
+        cache$2.set(cacheKey, formatter);
+    }
+    return formatter;
+}
+/**
+ * Format a list using the current or provided locale
+ * By default it is reactive to the global dynamic locale, works best when wrapped in a computed() if you need to react to locale changes
+ *
+ * @param value - The list to format
+ * @param opt - Options for formatting
+ * @returns Formatted list string
+ */
+function formatList(value, opt) {
+    const unwrapped = unwrapList(value);
+    if (unwrapped.length === 0)
+        return '';
+    const unwrappedOpt = unwrap(opt);
+    const loc = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return getFormatter$2(loc, unwrappedOpt?.type ?? 'conjunction', unwrappedOpt?.style ?? 'long').format(unwrapped);
+}
+
+const cache$1 = new Map();
+function unwrapValue(value, fallbackToZero = false) {
+    const unwrapped = unwrap(value);
+    if (unwrapped === null || unwrapped === undefined || isNaN(unwrapped))
+        return fallbackToZero ? 0 : null;
+    return unwrapped;
+}
+function getFormatter$1(locale, minFractionDigits, maxFractionDigits, useGrouping, notation, currency, display, style) {
+    const cacheKey = `${locale}|${notation ?? 'standard'}|${minFractionDigits}|${maxFractionDigits}|${useGrouping ?? true}|${currency ?? 'none'}|${display ?? 'none'}|${style ?? 'decimal'}`;
+    let formatter = cache$1.get(cacheKey);
+    if (!formatter) {
+        formatter = new Intl.NumberFormat(locale, {
+            style,
+            notation,
+            minimumFractionDigits: minFractionDigits,
+            maximumFractionDigits: maxFractionDigits,
+            useGrouping,
+        });
+        cache$1.set(cacheKey, formatter);
+    }
+    return formatter;
+}
+/**
+ * Format a number using the current or provided locale
+ * By default it is reactive to the global dynamic locale, works best when wrapped in a computed() if you need to react to locale changes
+ *
+ * @param number - Number to format
+ * @param opt - Options for formatting
+ * @returns Formatted number string
+ */
+function formatNumber(value, opt) {
+    const unwrappedOpt = unwrap(opt);
+    const unwrappedNumber = unwrapValue(value, unwrappedOpt?.fallbackToZero);
+    if (unwrappedNumber === null)
+        return '';
+    const loc = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return getFormatter$1(loc, unwrappedOpt?.minFractionDigits ?? 0, unwrappedOpt?.maxFractionDigits ?? 0, unwrappedOpt?.useGrouping ?? true, unwrappedOpt?.notation ?? 'standard').format(unwrappedNumber);
+}
+/**
+ * Format a percentage using the current or provided locale
+ * By default it is reactive to the global dynamic locale, works best when wrapped in a computed() if you need to react to locale changes
+ *
+ * @param number - Number to format
+ * @param opt - Options for formatting
+ * @returns Formatted percentage string
+ */
+function formatPercent(value, opt) {
+    const unwrappedOpt = unwrap(opt);
+    const unwrappedNumber = unwrapValue(value, unwrappedOpt?.fallbackToZero);
+    if (unwrappedNumber === null)
+        return '';
+    const loc = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return getFormatter$1(loc, unwrappedOpt?.minFractionDigits ?? 0, unwrappedOpt?.maxFractionDigits ?? 0, undefined, undefined, undefined, undefined, 'percent').format(unwrappedNumber);
+}
+function formatCurrency(value, currency, opt) {
+    const unwrappedOpt = unwrap(opt);
+    const unwrappedValue = unwrapValue(value, unwrappedOpt?.fallbackToZero);
+    if (unwrappedValue === null)
+        return '';
+    const loc = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return getFormatter$1(loc, 0, 0, undefined, undefined, unwrap(currency), unwrappedOpt?.display ?? 'symbol', 'currency').format(unwrappedValue);
+}
+
+const cache = new Map();
+function getFormatter(locale, style, numeric) {
+    const cacheKey = `${locale}|${style}|${numeric}`;
+    let formatter = cache.get(cacheKey);
+    if (!formatter) {
+        formatter = new Intl.RelativeTimeFormat(locale, { style, numeric });
+        cache.set(cacheKey, formatter);
+    }
+    return formatter;
+}
+/**
+ * Format a relative time using the current or provided locale
+ * By default it is reactive to the global dynamic locale, works best when wrapped in a computed() if you need to react to locale changes
+ *
+ * @param value - The numeric value to use in the relative time internationalization message
+ * @param unit - The unit to use in the relative time internationalization message
+ * @param opt - Options for formatting
+ * @returns Formatted relative time string
+ */
+function formatRelativeTime(value, unit, opt) {
+    const unwrappedValue = unwrap(value);
+    if (unwrappedValue === null ||
+        unwrappedValue === undefined ||
+        isNaN(unwrappedValue))
+        return '';
+    const unwrappedUnit = unwrap(unit);
+    if (!unwrappedUnit)
+        return '';
+    const unwrappedOpt = unwrap(opt);
+    const loc = unwrappedOpt?.locale ?? injectLocaleInternal()();
+    return getFormatter(loc, unwrappedOpt?.style ?? 'long', unwrappedOpt?.numeric ?? 'always').format(unwrappedValue, unwrappedUnit);
+}
+
+function injectResolveParamLocale(snapshot) {
+    let locale = null;
+    const paramName = injectIntlConfig()?.localeParamName;
+    const routerConfig = inject(Router)['options'];
+    const alwaysInheritParams = typeof routerConfig === 'object' &&
+        !!routerConfig &&
+        routerConfig.paramsInheritanceStrategy === 'always';
+    if (paramName) {
+        locale = snapshot.paramMap.get(paramName);
+        if (!locale && !alwaysInheritParams) {
+            let currentRoute = snapshot;
+            while (currentRoute && !locale) {
+                locale = currentRoute.paramMap.get('locale');
+                currentRoute = currentRoute.parent;
+            }
+        }
+    }
+    if (!locale) {
+        locale = untracked(inject(TranslationStore).locale);
+    }
+    return locale;
+}
 
 function createEqualsRecord(keys = []) {
     let keyMatcher;
@@ -150,7 +601,7 @@ function addSignalFn(fn, store) {
         const variables = args[0];
         const stringKey = key;
         const flatPath = replaceWithDelim(stringKey);
-        const varsFn = variables === undefined ? () => undefined : variables;
+        const varsFn = variables ?? (() => undefined);
         const varsSignal = isSignal(varsFn)
             ? varsFn
             : computed(varsFn, {
@@ -174,9 +625,11 @@ function registerNamespace(defaultTranslation, other) {
         return addSignalFn(createT(store), store);
     };
     let defaultTranslationLoaded = false;
-    const resolver = async () => {
-        const locale = inject(LOCALE_ID);
+    const resolver = async (snapshot) => {
         const store = inject(TranslationStore);
+        const locale = injectResolveParamLocale(snapshot);
+        const defaultLocale = injectDefaultLocale();
+        const shouldPreloadDefault = injectIntlConfig()?.preloadDefaultLocale ?? false;
         const tPromise = other[locale];
         const promise = tPromise ?? defaultTranslation;
         if (!promise && isDevMode()) {
@@ -185,25 +638,110 @@ function registerNamespace(defaultTranslation, other) {
         if (promise === defaultTranslation && defaultTranslationLoaded)
             return;
         try {
-            const translation = await promise();
-            if (promise !== defaultTranslation &&
-                translation.locale !== locale &&
-                isDevMode()) {
-                console.log('hre');
-                return console.warn(`Expected locale to be ${locale} but got ${translation.locale}`);
-            }
-            store.register(translation.namespace, {
-                [locale]: translation.flat,
-            }, locale);
-            if (promise === defaultTranslation) {
+            const promises = [promise()];
+            if (shouldPreloadDefault &&
+                !defaultTranslationLoaded &&
+                promise !== defaultTranslation)
+                promises.push(defaultTranslation());
+            const translations = await Promise.allSettled(promises);
+            const fullfilled = translations.map((t) => t.status === 'fulfilled' ? t.value : null);
+            if (fullfilled.at(0) === null && fullfilled.at(1) === null)
+                throw new Error('Failed to load translations');
+            const [t, defaultT] = fullfilled;
+            const ns = t?.namespace ?? defaultT?.namespace;
+            if (!ns)
+                throw new Error('No namespace found in translation');
+            if (isDevMode() && t && t.locale !== locale && t.locale)
+                console.warn(`Expected locale to be ${locale} but got ${t.locale}`);
+            store.registerOnDemandLoaders(ns, {
+                ...other,
+                [defaultLocale]: defaultTranslation,
+            });
+            const toRegister = {};
+            if (t)
+                toRegister[locale] = t.flat;
+            if (defaultT)
+                toRegister[defaultLocale] = defaultT.flat;
+            store.register(ns, toRegister);
+            if (promise === defaultTranslation || defaultT)
                 defaultTranslationLoaded = true;
+        }
+        catch {
+            if (isDevMode()) {
+                console.warn(`Failed to load translation for locale: ${locale}`);
             }
         }
+        finally {
+            if (locale !== untracked(store.locale))
+                store.locale.set(locale);
+        }
+    };
+    return {
+        injectNamespaceT: injectT,
+        resolveNamespaceTranslation: resolver,
+    };
+}
+/**
+ * Registers a type-unsafe namespace, meant for remote loading of unknown key-value pairs using mmstack/translate infrastructure
+ * The resolver & t function work the same as they would with typed namespaces, but without type safety
+ */
+function registerRemoteNamespace(ns, defaultTranslation, other) {
+    const injectT = () => {
+        const store = inject(TranslationStore);
+        return addSignalFn(createT(store), store);
+    };
+    let defaultTranslationLoaded = false;
+    const resolver = async (snapshot) => {
+        const store = inject(TranslationStore);
+        const locale = injectResolveParamLocale(snapshot);
+        const defaultLocale = injectDefaultLocale();
+        const shouldPreloadDefault = injectIntlConfig()?.preloadDefaultLocale ?? false;
+        const tPromise = other[locale];
+        const promise = tPromise ?? defaultTranslation;
+        if (!promise && isDevMode()) {
+            return console.warn(`No translation found for locale: ${locale}`);
+        }
+        if (promise === defaultTranslation && defaultTranslationLoaded)
+            return;
+        try {
+            const promises = [promise()];
+            if (shouldPreloadDefault &&
+                !defaultTranslationLoaded &&
+                promise !== defaultTranslation)
+                promises.push(defaultTranslation());
+            const translations = await Promise.allSettled(promises);
+            const fullfilled = translations.map((t) => t.status === 'fulfilled' ? t.value : null);
+            if (fullfilled.at(0) === null && fullfilled.at(1) === null)
+                throw new Error('Failed to load translations');
+            const [baseT, baseDefaultT] = fullfilled;
+            const t = baseT ? compileTranslation(baseT, ns, locale) : null;
+            const defaultT = baseDefaultT
+                ? compileTranslation(baseDefaultT, ns, defaultLocale)
+                : null;
+            if (isDevMode() && t && t.locale !== locale && t.locale)
+                console.warn(`Expected locale to be ${locale} but got ${t.locale}`);
+            store.registerOnDemandLoaders(ns, {
+                ...other,
+                [defaultLocale]: defaultTranslation,
+            });
+            const toRegister = {};
+            if (t)
+                toRegister[locale] = t.flat;
+            if (defaultT)
+                toRegister[defaultLocale] = defaultT.flat;
+            store.register(ns, toRegister);
+            if (promise === defaultTranslation || defaultT)
+                defaultTranslationLoaded = true;
+        }
         catch {
             if (isDevMode()) {
                 console.warn(`Failed to load translation for locale: ${locale}`);
             }
         }
+        finally {
+            if (locale !== untracked(store.locale))
+                store.locale.set(locale);
+        }
     };
     return {
         injectNamespaceT: injectT,
@@ -211,7 +749,36 @@ function registerNamespace(defaultTranslation, other) {
     };
 }
 
-class BaseTranslateDirective {
+/**
+ * Guard that validates the locale parameter against supported locales.
+ * Redirects to default locale if the locale is invalid.
+ *
+ * @param prefixSegments Optional array of path segments preceding the locale segment.
+ * if (you wanted to match /app/:locale/... you would pass ['app'] here) & the function would match the second parameter + redirect accordingly
+ *
+ * @example
+ * ```typescript
+ * {
+ *   path: ':locale',
+ *   canMatch: [canMatchLocale()],
+ *   children: [...]
+ * }
+ * ```
+ */
+function canMatchLocale(prefixSegments = []) {
+    return (_route, segments) => {
+        const supportedLocales = injectSupportedLocales();
+        const locale = segments.at(prefixSegments.length)?.path;
+        if (!locale || !supportedLocales.includes(locale))
+            return inject(Router).createUrlTree([
+                ...prefixSegments,
+                injectDefaultLocale(),
+            ]);
+        return true;
+    };
+}
+
+class Translate {
     t = createT(inject(TranslationStore));
     translate = input.required();
     constructor() {
@@ -239,19 +806,32 @@ class BaseTranslateDirective {
         const translation = computed(() => this.t(key(), args()));
         const renderer = inject(Renderer2);
         const el = inject(ElementRef);
-        effect(() => renderer.setProperty(el.nativeElement, 'textContent', translation()));
+        afterRenderEffect({
+            write: () => {
+                renderer.setProperty(el.nativeElement, 'textContent', translation());
+            },
+        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: BaseTranslateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.3", type: BaseTranslateDirective, isStandalone: true, inputs: { translate: { classPropertyName: "translate", publicName: "translate", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Translate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", type: Translate, isStandalone: true, inputs: { translate: { classPropertyName: "translate", publicName: "translate", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: BaseTranslateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Translate, decorators: [{
             type: Directive
         }], ctorParameters: () => [] });
 
-class BaseTranslatePipe {
-    t = createT(inject(TranslationStore));
+class Translator {
+    store = inject(TranslationStore);
+    t = createT(this.store);
+    constructor() {
+        const cdr = inject(ChangeDetectorRef);
+        effect(() => {
+            this.store.locale();
+            cdr.markForCheck();
+        });
+    }
     transform(key, ...args) {
-        return this.t(key, ...args);
+        const actualArgs = args.filter((a) => typeof a === 'object');
+        return this.t(key, ...actualArgs);
     }
 }
 
@@ -259,5 +839,5 @@ class BaseTranslatePipe {
  * Generated bundle index. Do not edit.
  */
 
-export { BaseTranslateDirective, BaseTranslatePipe, compileTranslation, createNamespace, injectIntl, provideIntlConfig, registerNamespace };
+export { Translate, Translator, canMatchLocale, compileTranslation, createNamespace, formatCurrency, formatDate, formatDisplayName, formatList, formatNumber, formatPercent, formatRelativeTime, injectDynamicLocale, injectIntl, injectResolveParamLocale, injectSupportedLocales, provideIntlConfig, registerNamespace, registerRemoteNamespace };
 //# sourceMappingURL=mmstack-translate.mjs.map