@mmstack/translate 20.5.3 → 20.5.5

package/fesm2022/mmstack-translate.mjs

@@ -1,6 +1,8 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, signal, LOCALE_ID, computed, resource, untracked, isDevMode, effect, Injectable, isSignal, input, Renderer2, ElementRef, afterRenderEffect, Directive, ChangeDetectorRef } 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,28 +55,96 @@ 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', ...(ngDevMode ? [{ debugName: "STORE_LOCALE" }] : []));
+function injectLocaleInternal() {
+    return STORE_LOCALE;
 }
 class TranslationStore {
     cache = createIntlCache();
     config = injectIntlConfig();
     loadQueue = signal([], ...(ngDevMode ? [{ debugName: "loadQueue" }] : []));
-    locale = signal(inject(LOCALE_ID), ...(ngDevMode ? [{ debugName: "locale" }] : []));
+    locale;
     defaultLocale = injectDefaultLocale();
     translations = signal({
         [this.defaultLocale]: {},
     }, ...(ngDevMode ? [{ debugName: "translations" }] : []));
+    attemptedFallbackLoad = false;
     onDemandLoaders = new Map();
     nonMessageConfig = computed(() => ({
         ...this.config,
@@ -127,6 +197,23 @@ class TranslationStore {
         messages: this.messages(),
     }, this.cache), ...(ngDevMode ? [{ debugName: "intl" }] : []));
     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
@@ -136,19 +223,34 @@ class TranslationStore {
             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,
                 });
             }
-            this.loadQueue.update((q) => q.filter((l) => l !== dynamicLocales.locale));
-            this.locale.set(dynamicLocales.locale);
+            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) {
@@ -173,10 +275,10 @@ class TranslationStore {
     hasLocaleLoaders(locale) {
         return Array.from(this.onDemandLoaders.values()).some((loaders) => loaders[locale]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TranslationStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TranslationStore, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: TranslationStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: TranslationStore, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TranslationStore, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: TranslationStore, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -205,15 +307,23 @@ function injectIntl() {
  * ```
  */
 function injectDynamicLocale() {
-    const defaultLocale = injectDefaultLocale();
     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) => {
-        const isDefaultOrHasLoaders = value === defaultLocale || store.hasLocaleLoaders(value);
         if (value === untracked(source) ||
-            !isDefaultOrHasLoaders ||
             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;
@@ -226,6 +336,243 @@ function injectDynamicLocale() {
     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;
     if (keys.length === 0) {
@@ -278,9 +625,11 @@ function registerNamespace(defaultTranslation, other) {
         return addSignalFn(createT(store), store);
     };
     let defaultTranslationLoaded = false;
-    const resolver = async () => {
+    const resolver = async (snapshot) => {
         const store = inject(TranslationStore);
-        const locale = untracked(store.locale);
+        const locale = injectResolveParamLocale(snapshot);
+        const defaultLocale = injectDefaultLocale();
+        const shouldPreloadDefault = injectIntlConfig()?.preloadDefaultLocale ?? false;
         const tPromise = other[locale];
         const promise = tPromise ?? defaultTranslation;
         if (!promise && isDevMode()) {
@@ -289,25 +638,110 @@ function registerNamespace(defaultTranslation, other) {
         if (promise === defaultTranslation && defaultTranslationLoaded)
             return;
         try {
-            const translation = await promise();
-            if (promise !== defaultTranslation &&
-                translation.locale !== locale &&
-                isDevMode()) {
-                return console.warn(`Expected locale to be ${locale} but got ${translation.locale}`);
-            }
-            store.registerOnDemandLoaders(translation.namespace, other);
-            store.register(translation.namespace, {
-                [locale]: translation.flat,
+            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,
             });
-            if (promise === 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,
@@ -315,6 +749,35 @@ function registerNamespace(defaultTranslation, other) {
     };
 }
 
+/**
+ * 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(...(ngDevMode ? [{ debugName: "translate" }] : []));
@@ -360,12 +823,12 @@ class Translate {
             },
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: Translate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.1", type: Translate, 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: "20.3.17", ngImport: i0, type: Translate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.17", 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: "20.3.1", ngImport: i0, type: Translate, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: Translate, decorators: [{
             type: Directive
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { translate: [{ type: i0.Input, args: [{ isSignal: true, alias: "translate", required: true }] }] } });
 
 class Translator {
     store = inject(TranslationStore);
@@ -387,5 +850,5 @@ class Translator {
  * Generated bundle index. Do not edit.
  */
 
-export { Translate, Translator, compileTranslation, createNamespace, injectDynamicLocale, 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