@lwrjs/router 0.12.0-alpha.1 → 0.12.0-alpha.10

package/build/es/modules/lwr/routerUtils/routeUtils.js

@@ -6,6 +6,10 @@
  */
 import { getPathFromUrl, getQueryFromUrl, getQueryString, isParam, getParamName, getQueryNames, } from './uriUtils';
 import { getPageReferenceFromUriAndRouteDef, matchRouteDefinitionByPageReference, getPathParams, getQueryParams, } from './routeDefUtils';
+export const DEFAULT_I18N_ROUTER_CONFIG = {
+    locale: 'en-US',
+    defaultLocale: 'en-US',
+};
 /**
  * Returns true if the given path & queryObj match the patterns (if any) defined in the routeDef
  *
@@ -70,14 +74,22 @@ function getRouteDefinitionForUri(uri, routeDefs) {
  * @param {string} url - URL string to turn into a route
  * @param {array[object]} routeDefs - List of Route Definitions to match to the url
  * @param {string} basePath - Optional: if provided, remove the base path before conversion.
+ * @param {object} i18n - Optional: if provided, remove the non-default locale before conversion.
  *
  * @returns {object}
  */
-export function matchRouteByUrl(url, routeDefs, basePath = '') {
+export function matchRouteByUrl(url, routeDefs, basePath = '', i18n = DEFAULT_I18N_ROUTER_CONFIG, options) {
     // Pass in the rest of the URL for matching, without the prefix.
-    if (basePath && url.indexOf(basePath) === 0) {
+    if (basePath && url?.indexOf(basePath) === 0) {
         url = url.replace(basePath, '');
     }
+    // Remove the locale
+    if (options?.locale || i18n?.locale) {
+        const localePath = `/${options?.locale || i18n.locale}`;
+        if (url?.indexOf(localePath) === 0) {
+            url = url.replace(localePath, '');
+        }
+    }
     // Parse the URL.
     const routeDef = getRouteDefinitionForUri(url, routeDefs);
     let matchInfo;
@@ -117,10 +129,10 @@ export function matchRouteByUrl(url, routeDefs, basePath = '') {
  * @param basePath Base path for the url
  * @returns the url or null if no match
  */
-export function getUrlFromPageReference(pageReference, routeDefs, basePath = '') {
+export function getUrlFromPageReference(pageReference, routeDefs, basePath = '', i18n = DEFAULT_I18N_ROUTER_CONFIG, options) {
     const routeDef = matchRouteDefinitionByPageReference(pageReference, routeDefs);
     if (routeDef) {
-        return getUrlFromPageReferenceAndRouteDef(pageReference, routeDef, basePath);
+        return getUrlFromPageReferenceAndRouteDef(pageReference, routeDef, basePath, i18n, options);
     }
     return null;
 }
@@ -159,7 +171,7 @@ function extractBindingValues(parameters, pageReference, pageBindings) {
  * @param routeDef routeDef to that defines how serialize the given pageReference
  * @returns url for the given pageReference
  */
-export function getUrlFromPageReferenceAndRouteDef(pageReference, routeDef, basePath = '') {
+export function getUrlFromPageReferenceAndRouteDef(pageReference, routeDef, basePath = '', i18n = DEFAULT_I18N_ROUTER_CONFIG, options) {
     const { params, original: { page = {} } = {}, toPath, compiledQuery } = routeDef;
     const { attributes: attributeBindings = {}, state: stateBindings = {} } = page;
     //
@@ -188,7 +200,9 @@ export function getUrlFromPageReferenceAndRouteDef(pageReference, routeDef, base
     });
     const queryObject = getQueryObjectForParametersAndPageReference(pageReference, queryParameters, routeDef);
     const queryString = getQueryString(queryObject);
-    return `${basePath}${toPathUrl}${queryString}`;
+    const locale = options?.locale || (i18n && i18n.locale);
+    const localePart = locale !== i18n.defaultLocale ? `/${locale}` : '';
+    return `${basePath}${localePart}${toPathUrl}${queryString}`;
 }
 /**
  * Create a queryObject using the given pageReference, queryParameters, using the routeDef to specify
@@ -229,8 +243,8 @@ function getQueryObjectForParametersAndPageReference(pageReference, queryParamet
 /**
  * Obtains the pageReference for the given URL
  */
-export function getPageReferenceFromUrl(url, routeDefs, basePath = '') {
-    const routingMatch = matchRouteByUrl(url, routeDefs, basePath);
+export function getPageReferenceFromUrl(url, routeDefs, basePath = '', i18n = DEFAULT_I18N_ROUTER_CONFIG) {
+    const routingMatch = matchRouteByUrl(url, routeDefs, basePath, i18n);
     if (routingMatch && routingMatch.route && routingMatch.route.pageReference) {
         return routingMatch.route.pageReference;
     }

package/build/es/modules/lwr/routerUtils/routerUtils.d.ts

@@ -6,7 +6,7 @@
  */
 export { createFilterChain } from './filterUtils';
 export { getPageReferenceFromUriAndRouteDef } from './routeDefUtils';
-export { getUrlFromPageReference, getPageReferenceFromUrl, matchRouteByUrl, getUrlFromPageReferenceAndRouteDef, } from './routeUtils';
+export { DEFAULT_I18N_ROUTER_CONFIG, getUrlFromPageReference, getPageReferenceFromUrl, matchRouteByUrl, getUrlFromPageReferenceAndRouteDef, } from './routeUtils';
 export { isObject, freeze, guid, isValidRoute } from './typeUtils';
 export { parseRoutes } from './parseUtils';
 import { pathToRegexp as ptr, compile as ptrCompile } from './pathToRegexp';

package/build/es/modules/lwr/routerUtils/routerUtils.js

@@ -6,7 +6,7 @@
  */
 export { createFilterChain } from './filterUtils';
 export { getPageReferenceFromUriAndRouteDef } from './routeDefUtils';
-export { getUrlFromPageReference, getPageReferenceFromUrl, matchRouteByUrl, getUrlFromPageReferenceAndRouteDef, } from './routeUtils';
+export { DEFAULT_I18N_ROUTER_CONFIG, getUrlFromPageReference, getPageReferenceFromUrl, matchRouteByUrl, getUrlFromPageReferenceAndRouteDef, } from './routeUtils';
 export { isObject, freeze, guid, isValidRoute } from './typeUtils';
 export { parseRoutes } from './parseUtils';
 import { pathToRegexp as ptr, compile as ptrCompile } from './pathToRegexp';

package/build/es/modules/lwr/routerUtils/types.d.ts

@@ -7,33 +7,34 @@ export interface Constructable<T = object> {
     constructor: Constructor<T>;
 }
 export type UrlMapper<TAddress> = {
-    generateUrl(address: TAddress): string | null;
+    generateUrl(address: TAddress, options?: NavigateOptions): string | null;
     parseUrl(url: string): TAddress | null;
 };
 export type RouteMatcher<TAddress> = {
-    matchRoute(address: TAddress): RoutingMatch | null;
+    matchRoute(address: TAddress, options?: NavigateOptions): RoutingMatch | null;
 };
 export type ViewMapper<TAddress> = {
-    navigate(address: TAddress): void;
+    navigate(address: TAddress, options?: NavigateOptions): void;
     subscribe(callback: RouteCallback, replay?: boolean): Unsubscriber;
     resolveView(address: TAddress): Promise<RouteDestination>;
     contextId?: ContextId;
 };
 export type Router<TAddress = string> = ViewMapper<TAddress> & UrlMapper<TAddress> & RouteMatcher<TAddress>;
-export interface DEPRECATED_getRouteFromUrl {
-    <TAddress>(url: string, defaultImpl: Function): TAddress | null;
-}
-export interface DEPRECATED_getUrlFromRoute {
-    <TAddress>(route: TAddress, defaultImpl: Function): string | null;
-}
-export type RouterConfig = {
+export type DEPRECATED_getRouteFromUrl<TAddress> = (url: string, defaultImpl: UrlMapper<TAddress>['parseUrl']) => TAddress | null;
+export type DEPRECATED_getUrlFromRoute<TAddress> = (route: TAddress, defaultImpl: UrlMapper<TAddress>['generateUrl'], options?: NavigateOptions) => string | null;
+export type I18nRouterConfig = {
+    locale: string;
+    defaultLocale: string;
+};
+export type RouterConfig<TAddress> = {
     basePath?: string;
+    i18n?: I18nRouterConfig;
     routes?: RouteDefinition[];
     caseSensitive?: boolean;
-    DEPRECATED_getRouteFromUrl?: DEPRECATED_getRouteFromUrl;
-    DEPRECATED_getUrlFromRoute?: DEPRECATED_getUrlFromRoute;
+    DEPRECATED_getRouteFromUrl?: DEPRECATED_getRouteFromUrl<TAddress>;
+    DEPRECATED_getUrlFromRoute?: DEPRECATED_getUrlFromRoute<TAddress>;
 };
-export type RouterSerializationConfig<TAddress> = Required<Omit<RouterConfig, 'DEPRECATED_getRouteFromUrl' | 'DEPRECATED_getUrlFromRoute'> & UrlMapper<TAddress>>;
+export type RouterSerializationConfig<TAddress> = Required<Omit<RouterConfig<TAddress>, 'DEPRECATED_getRouteFromUrl' | 'DEPRECATED_getUrlFromRoute'> & UrlMapper<TAddress>>;
 export type RouteParameterPatterns = {
     [paramName: string]: string;
 };
@@ -129,5 +130,8 @@ export interface StringAttributes {
 export interface NullableStringAttributes {
     [key: string]: string | null;
 }
+export interface NavigateOptions {
+    locale?: string;
+}
 export {};
 //# sourceMappingURL=types.d.ts.map

package/build/es/modules/lwr/serverRouter/serverRouter.d.ts

@@ -2,10 +2,11 @@ import type { RouteChange } from 'lwr/domRouterUtils';
 import type { ContextId } from 'lwr/navigation';
 import type { PageReference, Router, RouterConfig, RoutingMatch } from 'lwr/router';
 import type { MessageObject } from 'lwr/routerUtils';
+import type { NavigateOptions } from '../routerUtils/types';
 type HandleNavFunction = (p: PageReference) => boolean;
 type PreNavFunction = (r: RouteChange) => boolean | Promise<boolean>;
 type ErrorNavFunction = (m: MessageObject) => void;
-type ServerRouterConfig = RouterConfig & {
+type ServerRouterConfig = RouterConfig<PageReference> & {
     url?: string;
     handleNavigation?: HandleNavFunction;
     preNavigate?: PreNavFunction;
@@ -25,12 +26,12 @@ export declare class ServerRouter {
      * Perform a hard navigation to the given page reference
      * Client only!
      */
-    navigate(address: PageReference): Promise<void>;
+    navigate(address: PageReference, _replace?: boolean, options?: NavigateOptions): Promise<void>;
     /**
      * lightning/navigation
      * Generate a URL based on the given page reference
      */
-    generateUrl(address: PageReference): string | null;
+    generateUrl(address: PageReference, options?: NavigateOptions): string | null;
     /**
      * Initialize the CurrentPageReference & NavigationContext wires plus the client-only NavigationMixin
      * On the server, use the URL from the config

package/build/es/modules/lwr/serverRouter/serverRouter.js

@@ -21,14 +21,14 @@ export class ServerRouter {
      * Perform a hard navigation to the given page reference
      * Client only!
      */
-    async navigate(address) {
+    async navigate(address, _replace, options) {
         if (hasDocument) {
             // invoke the handleNavigation hook, which intercepts the raw page ref
             if (this.handleNavHook && !this.handleNavHook(address)) {
                 return;
             }
             // continue navigating
-            const url = await this.getValidatedUrl(address);
+            const url = await this.getValidatedUrl(address, options);
             if (url) {
                 // hard navigation
                 document.location.href = url;
@@ -39,8 +39,8 @@ export class ServerRouter {
      * lightning/navigation
      * Generate a URL based on the given page reference
      */
-    generateUrl(address) {
-        return this.router.generateUrl(address);
+    generateUrl(address, options) {
+        return this.router.generateUrl(address, options);
     }
     /**
      * Initialize the CurrentPageReference & NavigationContext wires plus the client-only NavigationMixin
@@ -59,7 +59,7 @@ export class ServerRouter {
         }
         url = this.getRelativeUrl(url);
         // ensure the initial URL matches a valid route definition
-        const routingMatch = this.router.matchRoute(url);
+        const routingMatch = this.router.matchRoute(url, {});
         if (!routingMatch) {
             this.processError(generateMessageObject(messages.MISSING_ROUTE, [url]));
             return;
@@ -67,9 +67,9 @@ export class ServerRouter {
         this.currentRoute = routingMatch;
         // set up the navigation context APIs
         registerNavigationHelm(this.contextId, {
-            navigate: (address) => this.navigate(address),
-            generateUrl: (address) => this.generateUrl(address),
-            // the JS context is lost during hard navigations, so subcribing to route changes will not work
+            navigate: (address, replace, options) => this.navigate(address, replace, options),
+            generateUrl: (address, options) => this.generateUrl(address, options),
+            // the JS context is lost during hard navigation, so subscribing to route changes will not work
             subscribe: () => {
                 throw new Error('The server router does not support the subscribe API');
             },
@@ -102,9 +102,9 @@ export class ServerRouter {
     /**
      * Validate the page reference passed to the navigate API
      */
-    async getValidatedUrl(address) {
+    async getValidatedUrl(address, options) {
         // match the URL to a route definition; fail if there is no match
-        const routingMatch = this.router.matchRoute(address);
+        const routingMatch = this.router.matchRoute(address, {});
         if (!routingMatch) {
             this.processError(generateMessageObject(messages.NO_ROUTE_MATCH, [JSON.stringify(address)]));
             return;
@@ -119,7 +119,7 @@ export class ServerRouter {
             this.processError(generateMessageObject(messages.PRENAV_FAILED, [JSON.stringify(address)]));
             return;
         }
-        return this.router.generateUrl(address);
+        return this.router.generateUrl(address, options);
     }
     /**
      * Run the errorNavigate filters

package/build/es/services/index.d.ts

@@ -1,8 +1,10 @@
+import type { I18nRouterConfig } from '../modules/lwr/routerUtils/types';
 export declare const DEFAULT_SCHEMA = "pageReference_v1";
 export interface LwrRouterConfig {
-    basePath?: string;
     caseSensitive?: boolean;
     routes: LwrConfigRouteDefinition[];
+    basePath?: string;
+    i18n?: I18nRouterConfig;
 }
 export interface LwrConfigRouteDefinition {
     id: string;

package/build/es/services/index.js

@@ -50,7 +50,6 @@ const RouteDefinitionSchema = {
     type: 'object',
     properties: {
         schema: { type: 'string', pattern: `^${DEFAULT_SCHEMA}$` },
-        basePath: { type: 'string', minLength: 1 },
         caseSensitive: { type: 'boolean' },
         routes: {
             type: 'array',

package/build/es/services/module-provider/index.d.ts

@@ -1,4 +1,4 @@
-import type { AbstractModuleId, ModuleCompiled, ModuleEntry, ModuleProvider, ProviderContext } from '@lwrjs/types';
+import type { AbstractModuleId, I18NConfig, ModuleCompiled, ModuleEntry, ModuleProvider, ProviderContext, RuntimeParams } from '@lwrjs/types';
 interface RouterProviderOptions {
     routesDir?: string;
 }
@@ -7,16 +7,15 @@ export default class RouterModuleProvider implements ModuleProvider {
     version: string;
     routesDir: string;
     appBasePath?: string;
-    private routerEmitter;
+    i18n: I18NConfig;
     private routerWatcher?;
-    private watchedFileMap;
-    private routerModuleCache;
+    private watchedFileSet;
     constructor({ routesDir }: RouterProviderOptions, context: ProviderContext);
-    onRouterModuleChange(configPath: string, deleted?: boolean): Promise<void>;
+    onRouterModuleChange(configPath: string): Promise<void>;
     private watchConfigs;
     private getRouterConfig;
-    getModuleEntry({ specifier }: AbstractModuleId): Promise<ModuleEntry | undefined>;
-    getModule(moduleId: AbstractModuleId): Promise<ModuleCompiled | undefined>;
+    getModuleEntry({ specifier }: AbstractModuleId, runtimeParams: RuntimeParams): Promise<ModuleEntry | undefined>;
+    getModule(moduleId: AbstractModuleId, runtimeParams: RuntimeParams): Promise<ModuleCompiled | undefined>;
 }
 export {};
 //# sourceMappingURL=index.d.ts.map

package/build/es/services/module-provider/index.js

@@ -5,13 +5,10 @@ const DEFAULT_DIR = '$rootDir/src/routes';
 export default class RouterModuleProvider {
     constructor({ routesDir = DEFAULT_DIR }, context) {
         this.name = 'router-module-provider';
-        this.watchedFileMap = new Map(); // <config path, module id>
-        // Two layers of caching:
-        //      1. Cache the Router Config JSON objects read from the file system, by config path (routerConfigJsonCache in ../index)
-        //      2. Cache the modules generated from the config, by config path
-        this.routerModuleCache = new Map();
-        const { appEmitter, config: { basePath, rootDir, contentDir, layoutsDir }, runtimeEnvironment: { lwrVersion, watchFiles }, watcherFactory, } = context;
+        this.watchedFileSet = new Set(); // <config path, module id>
+        const { config: { rootDir, contentDir, i18n, layoutsDir }, runtimeEnvironment: { lwrVersion, watchFiles }, watcherFactory, } = context;
         this.version = lwrVersion;
+        this.i18n = i18n;
         // Replace aliases and remove trailing slash from the routes directory
         this.routesDir = normalizeResourcePath(routesDir, {
             rootDir,
@@ -19,11 +16,7 @@ export default class RouterModuleProvider {
             contentDir,
             layoutsDir,
         }).replace(/\/$/, '');
-        // Save the base path from the app config
-        // Note: The default basePath = ''
-        this.appBasePath = basePath ? basePath : undefined;
         // Set up watcher on Router Config files
-        this.routerEmitter = appEmitter;
         this.routerWatcher =
             watchFiles && watcherFactory
                 ? setUpWatcher(watcherFactory, this.onRouterModuleChange.bind(this))
@@ -31,38 +24,23 @@ export default class RouterModuleProvider {
     }
     // When Router Metadata changes on the file system:
     //      1. delete the config data from the routerConfigJsonCache (in ../index)
-    //      2. delete the module from the routerModuleCache
-    //      3. recompile the module based on the new data and emit
-    async onRouterModuleChange(configPath, deleted = false) {
-        const moduleId = this.watchedFileMap.get(configPath);
-        if (!moduleId) {
-            throw new Error('We are observing an unprocessed Router Config file, this should not happen...');
-        }
+    async onRouterModuleChange(configPath) {
         deleteRouterConfigJsonCacheEntry(configPath);
-        this.routerModuleCache.delete(configPath);
-        if (!deleted) {
-            const recompiledModule = await this.getModule(moduleId);
-            if (recompiledModule) {
-                this.routerEmitter.notifyModuleSourceChanged(recompiledModule);
-            }
-        }
     }
     // Watch Router Config files:
     //      1. Add files to the watcher
-    //      2. Track watched files in the watchedFileMap with the associated module ID object
-    watchConfigs(specifier, moduleId) {
+    //      2. Track watched files in the watchedFileSet
+    watchConfigs(configPath) {
         if (this.routerWatcher) {
-            const configPath = getRouterConfigPath(this.routesDir, specifier);
-            if (!this.watchedFileMap.has(configPath)) {
+            if (!this.watchedFileSet.has(configPath)) {
                 this.routerWatcher.add(configPath);
+                this.watchedFileSet.add(configPath);
             }
-            this.watchedFileMap.set(configPath, moduleId);
         }
     }
     // 1. Check that:
     //      a. the specifier is in the correct format: "@lwrjs/router/{routerId}"
     //      b. the config JSON addressed by "routerId" is available on the file system
-    // 2. Maintain the Router Config cache
     getRouterConfig(specifier) {
         let config;
         const routerId = parseSpecifier(specifier);
@@ -70,18 +48,16 @@ export default class RouterModuleProvider {
             // Fetch the Router Config JSON
             const configPath = getRouterConfigPath(this.routesDir, specifier);
             config = getClientRoutes(configPath);
-            if (config && !config.basePath && this.appBasePath) {
-                // The route config basePath takes precedence over the app config
-                config.basePath = this.appBasePath;
-            }
+            // Watch for file changes
+            this.watchConfigs(configPath);
         }
         return config;
     }
-    async getModuleEntry({ specifier }) {
+    async getModuleEntry({ specifier }, runtimeParams) {
         const config = this.getRouterConfig(specifier);
         if (config) {
             return {
-                id: `${specifier}|${this.version}`,
+                id: `${specifier}|${this.version}|${runtimeParams.basePath}|${runtimeParams.locale}`,
                 virtual: true,
                 entry: `<virtual>/${specifier}.js`,
                 specifier,
@@ -89,21 +65,16 @@ export default class RouterModuleProvider {
             };
         }
     }
-    async getModule(moduleId) {
+    async getModule(moduleId, runtimeParams) {
         // Retrieve the Module Entry
         const { specifier, namespace, name = specifier } = moduleId;
-        const moduleEntry = await this.getModuleEntry({ specifier });
+        const moduleEntry = await this.getModuleEntry({ specifier }, runtimeParams);
         if (!moduleEntry) {
             return;
         }
-        // Check the module cache first
-        const configPath = getRouterConfigPath(this.routesDir, specifier);
-        if (this.routerModuleCache.has(configPath)) {
-            return this.routerModuleCache.get(configPath);
-        }
         // Generate code for the requested module
         const config = this.getRouterConfig(specifier);
-        const compiledSource = generateModule(config);
+        const compiledSource = generateModule(config, this.i18n, runtimeParams);
         // Construct a Compiled Module
         const moduleCompiled = {
             id: moduleEntry.id,
@@ -116,9 +87,6 @@ export default class RouterModuleProvider {
             ownHash: hashContent(compiledSource),
             compiledSource,
         };
-        // Watch Router Config file, add cache entries, and return
-        this.watchConfigs(specifier, moduleId);
-        this.routerModuleCache.set(configPath, moduleCompiled);
         return moduleCompiled;
     }
 }

package/build/es/services/module-provider/utils.d.ts

@@ -1,4 +1,4 @@
-import type { Watcher } from '@lwrjs/types';
+import type { I18NConfig, RuntimeParams, Watcher } from '@lwrjs/types';
 import type { LwrRouterConfig } from '../index.js';
 import type { WatcherFactory } from '@lwrjs/types';
 export declare const SPECIFIER_PREFIX = "@lwrjs/router/";
@@ -23,5 +23,5 @@ export declare function setUpWatcher(factory: WatcherFactory, onModuleChange: (f
  * Generate a module string which fulfills a router request
  * @param routes - The array of route definitions
  */
-export declare function generateModule(config?: LwrRouterConfig): string;
+export declare function generateModule(config: LwrRouterConfig | undefined, { defaultLocale, uriPattern }: I18NConfig, runtimeParams: RuntimeParams): string;
 //# sourceMappingURL=utils.d.ts.map

package/build/es/services/module-provider/utils.js

@@ -43,10 +43,22 @@ function getHandlerClassName(specifier) {
  */
 function generateHandlerClasses(routes) {
     let handlerClasses = '';
-    routes.forEach((r) => {
+    const seenComponents = new Set();
+    const filteredAndDeDupedArray = routes.filter((item) => {
+        // Filter out entries without a component
+        if (!item.component)
+            return false;
+        // De-dupe entries with a component
+        if (!seenComponents.has(item.component)) {
+            seenComponents.add(item.component);
+            return true;
+        }
+        return false;
+    });
+    filteredAndDeDupedArray.forEach((r) => {
+        // filtered above
         const component = r.component;
-        if (component) {
-            handlerClasses += `class ${getHandlerClassName(component)} {
+        handlerClasses += `class ${getHandlerClassName(component)} {
     callback;
     constructor(callback) {
         this.callback = callback;
@@ -63,7 +75,6 @@ function generateHandlerClasses(routes) {
         });
     }
 }\n`;
-        }
     });
     return handlerClasses;
 }
@@ -96,15 +107,20 @@ function generateRouteDefinitions(routes) {
  * Generate a module string which fulfills a router request
  * @param routes - The array of route definitions
  */
-export function generateModule(config = { routes: [] }) {
-    const { basePath = '', caseSensitive, routes: jsonRoutes } = config;
+export function generateModule(config = { routes: [] }, { defaultLocale, uriPattern }, runtimeParams) {
+    const { caseSensitive, routes: jsonRoutes } = config;
     const csString = caseSensitive ? 'true' : 'false';
     const routes = generateRouteDefinitions(jsonRoutes);
     const handlers = generateHandlerClasses(jsonRoutes);
+    // Do we need to check basePath from router config?
+    const basePath = runtimeParams?.basePath || '';
+    const i18nRouterConfig = uriPattern === 'path-prefix'
+        ? `${JSON.stringify({ locale: runtimeParams?.locale, defaultLocale })}`
+        : undefined;
     return `import { createRouter as createLwrRouter } from 'lwr/router';
 ${handlers}
-export function createRouter({ basePath = '${basePath}', caseSensitive = ${csString} } = {}) {
-    return createLwrRouter({ basePath, caseSensitive, routes: ${routes} });
+export function createRouter({ basePath = '${basePath}', caseSensitive = ${csString}, DEPRECATED_getRouteFromUrl, DEPRECATED_getUrlFromRoute } = {}) {
+    return createLwrRouter({ basePath, caseSensitive, i18n: ${i18nRouterConfig}, routes: ${routes}, DEPRECATED_getRouteFromUrl, DEPRECATED_getUrlFromRoute });
 }`;
 }
 //# sourceMappingURL=utils.js.map

package/build/modules/lwr/contextUtils/contextUtils.js

@@ -92,5 +92,6 @@ export function generateContextualWireAdapter(contextInstance) {
 // Adding the ts-ignore in case this code is compiled with a version of LWC that is older than 4.0.
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
+
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore

package/build/modules/lwr/domRouter/domRouter.js

@@ -134,7 +134,7 @@ export class DomRouterImpl {
     });
     const contextApi = {
       navigate: (address, replace) => this.navigate(address, replace),
-      generateUrl: address => this.generateUrl(address),
+      generateUrl: (address, options) => this.generateUrl(address, options),
       subscribe: (callback, replay) => this.subscribe(callback, replay)
     };
     registerNavigationHelm(this.contextId, contextApi);
@@ -262,10 +262,11 @@ export class DomRouterImpl {
    * After processing, delegate to a child router, if it exists.
    *
    * @param {string} url - Relative URL string to process
+   * @param {NavigateOptions} options - Additional navigation options (i.e. switch root locale)
    * @returns {boolean} - True if the processing was NOT blocked by a preNavigate listener
    */
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  async process(url, replace) {
+  async process(url, _shouldReplace, options, _updateHistory) {
     // Mark the navigation event here instead of in navigate()
     // This way, we catch ALL navigation events, since they all must go through process():
     //      1. A component calls navigate()
@@ -281,7 +282,7 @@ export class DomRouterImpl {
     // Run the root -> leaf chain of pre navigate filters, if this is the root.
     try {
       if (!this.parent) {
-        await this.preProcess(url);
+        await this.preProcess(url, options);
       }
     } catch (e) {
       if (e.code) {
@@ -295,7 +296,7 @@ export class DomRouterImpl {
     // trigger the child to navigate afterwards
     const address = this.router.parseUrl(url);
     if (address) {
-      this.router.navigate(address);
+      this.router.navigate(address, options);
     }
     return true;
   }
@@ -309,9 +310,9 @@ export class DomRouterImpl {
    *
    * @returns {Promise<boolean>} - Resolves to true if successful
    */
-  preProcess(url) {
+  preProcess(url, options) {
     const address = this.router.parseUrl(url);
-    const routingMatch = address && this.router.matchRoute(address);
+    const routingMatch = address && this.router.matchRoute(address, options);
 
     // Check that the URL has a matching route, otherwise it is an error.
     if (!routingMatch) {
@@ -363,9 +364,11 @@ export class DomRouterImpl {
    * @param {*} options - Usually a boolean; when true the previous browser history
    *                    entry should be replaced by this one
    */
-  navigate(address, replace) {
+  navigate(address, replace, options) {
+    const routerOptions = this.filterNavigateOptions(options);
+
     // Ensure there is a string URL to pass to the navigation event.
-    let url = this.router.generateUrl(address);
+    let url = this.router.generateUrl(address, routerOptions);
     if (url) {
       // If this router is a child, we need to prepend the parent's matching portion
       // of the url before sending the navigate event up
@@ -390,8 +393,9 @@ export class DomRouterImpl {
    *
    * @returns {Promise<string>}
    */
-  generateUrl(address) {
-    const url = this.router.generateUrl(address);
+  generateUrl(address, options) {
+    const routerOptions = this.filterNavigateOptions(options);
+    const url = this.router.generateUrl(address, routerOptions);
 
     // Invalid addresses need to return null to indicate they are invalid
     if (!url) {
@@ -482,6 +486,19 @@ export class DomRouterImpl {
     }
     return url;
   }
+
+  /**
+   * Filter the navigate options based on if this is a root router or not.
+   */
+  filterNavigateOptions(options) {
+    const isRoot = !this.parent;
+    const routerOptions = {
+      ...options,
+      // Only allow switch locales if this is a root router
+      locale: isRoot ? options?.locale : undefined
+    };
+    return routerOptions;
+  }
 }
 
 /**

package/build/modules/lwr/domRouterUtils/historyUtils.js

@@ -9,6 +9,7 @@
  * Manipulates the browser history on the window.
  * Ths just uses the window.history functionality directly.
  */
+
 /**
  * Sets a history state.
 

package/build/modules/lwr/historyRouter/historyRouter.js

@@ -50,9 +50,9 @@ export class HistoryRouter extends DomRouterImpl {
    *
    * @returns {boolean} - True if the processing was NOT blocked by a preNavigate listener
    */
-  async process(url, shouldReplace, updateHistory = true) {
+  async process(url, shouldReplace, options, updateHistory = true) {
     // Run the preNavigate hooks to check if this event should be processed.
-    const canContinue = await super.process(url);
+    const canContinue = await super.process(url, shouldReplace, options, updateHistory);
 
     // Update the window location if this router is connected and is the root router
     if (canContinue && !this.historyDisabled && updateHistory && this.connected && !this.parent) {
@@ -73,13 +73,13 @@ export class HistoryRouter extends DomRouterImpl {
    * @param {string} url - The URL to go to
    */
   catchBrowserUpdate(url) {
-    this.process(url, false, false);
+    this.process(url, false, {}, false);
   }
 }
 
 /**
  * Create a new root Router, attach to the Window.
- * This is the public, programmitic API for root router creation.
+ * This is the public, programmatic API for root router creation.
  * An application can only have ONE root router.
  *
  * @param {object} config - The router config object