@mmstack/router-core 21.0.2 → 21.0.4

package/fesm2022/mmstack-router-core.mjs

@@ -1,63 +1,191 @@
-import * as i0 from '@angular/core';
-import { InjectionToken, inject, computed, Injectable, input, booleanAttribute, output, untracked, effect, HostListener, Directive, isSignal, linkedSignal } from '@angular/core';
 import * as i1 from '@angular/router';
-import { EventType, Router, PRIMARY_OUTLET, createUrlTreeFromSnapshot, UrlTree, RouterLink, RouterLinkWithHref, ActivatedRoute } from '@angular/router';
-import { mutable, mapArray, until, elementVisibility, toWritable } from '@mmstack/primitives';
+import { PRIMARY_OUTLET, EventType, Router, createUrlTreeFromSnapshot, UrlTree, RouterLink, RouterLinkWithHref, ActivatedRoute } from '@angular/router';
+import * as i0 from '@angular/core';
+import { inject, computed, Injectable, InjectionToken, input, booleanAttribute, output, untracked, effect, HostListener, Directive, isSignal, linkedSignal } from '@angular/core';
 import { toSignal } from '@angular/core/rxjs-interop';
 import { filter, map } from 'rxjs/operators';
+import { mutable, mapArray, until, elementVisibility, toWritable } from '@mmstack/primitives';
 import { Subject, EMPTY, filter as filter$1, take, switchMap, finalize } from 'rxjs';
 import { Title } from '@angular/platform-browser';
 
-/**
- * @internal
- */
-const token$1 = new InjectionToken('MMSTACK_BREADCRUMB_CONFIG');
-/**
- * Provides configuration for the breadcrumb system.
- * @param config - A partial `BreadcrumbConfig` object with the desired settings. *
- * @see BreadcrumbConfig
- * @example
- * ```typescript
- * // In your app.module.ts or a standalone component's providers:
- * // import { provideBreadcrumbConfig } from './breadcrumb.config'; // Adjust path
- * // import { ResolvedLeafRoute } from './breadcrumb.type'; // Adjust path
- *
- * // const customLabelStrategy: GenerateBreadcrumbFn = () => {
- * //   return (leaf: ResolvedLeafRoute): string => {
- * //     // Example: Prioritize a 'navTitle' data property
- * //     if (leaf.route.data?.['navTitle']) {
- * //       return leaf.route.data['navTitle'];
- * //     }
- * //     // Fallback to a default mechanism
- * //     return leaf.route.title || leaf.segment.resolved || 'Unnamed';
- * //   };
- * // };
- *
- * export const appConfig = [
- *  // ...rest
- *  provideBreadcrumbConfig({
- *   generation: customLabelStrategy, // or 'manual' to disable auto-generation
- *  }),
- * ]
- * ```
- */
-function provideBreadcrumbConfig(config) {
-    return {
-        provide: token$1,
-        useValue: {
-            ...config,
-        },
+function parsePathSegment$1(segmentString) {
+    const parts = segmentString.split(';');
+    const pathPart = parts[0];
+    const matrixParams = {};
+    for (let i = 1; i < parts.length; i++) {
+        const [key, value = 'true'] = parts[i].split('=');
+        if (key) {
+            matrixParams[key] = value;
+        }
+    }
+    return { pathPart, matrixParams };
+}
+function createBasePredicate(path) {
+    const partPredicates = path
+        .split('/')
+        .filter((part) => !!part.trim())
+        .map((configSegmentString) => {
+        const { pathPart: configPathPart, matrixParams: configMatrixParams } = parsePathSegment$1(configSegmentString);
+        let singlePathPartPredicate;
+        if (configPathPart.startsWith(':')) {
+            singlePathPartPredicate = () => true;
+        }
+        else {
+            singlePathPartPredicate = (linkSegmentPathPart) => linkSegmentPathPart === configPathPart;
+        }
+        const configSegmentHasMatrixParams = Object.keys(configMatrixParams).length > 0;
+        return (linkSegmentString) => {
+            const { pathPart: linkPathPart, matrixParams: linkMatrixParams } = parsePathSegment$1(linkSegmentString);
+            if (!singlePathPartPredicate(linkPathPart)) {
+                return false;
+            }
+            if (!configSegmentHasMatrixParams) {
+                return true;
+            }
+            return Object.entries(configMatrixParams).every(([key, value]) => Object.prototype.hasOwnProperty.call(linkMatrixParams, key) &&
+                linkMatrixParams[key] === value);
+        };
+    });
+    return (path) => {
+        const linkPathOnly = path.split(/[?#]/).at(0) ?? '';
+        if (!linkPathOnly && partPredicates.length > 0)
+            return false;
+        if (!linkPathOnly && partPredicates.length === 0)
+            return true;
+        const parts = linkPathOnly.split('/').filter((part) => !!part.trim());
+        if (parts.length < partPredicates.length)
+            return false;
+        return parts.every((seg, idx) => {
+            const pred = partPredicates.at(idx);
+            if (!pred)
+                return true;
+            return pred(seg);
+        });
     };
 }
-/**
- * @internal
- */
-function injectBreadcrumbConfig() {
-    return (inject(token$1, {
-        optional: true,
-    }) ?? {});
+function singleSegmentMatches(configSegment, linkSegment) {
+    if (configSegment.pathPart === ':') {
+        return true;
+    }
+    else if (configSegment.pathPart !== linkSegment.pathPart) {
+        return false;
+    }
+    const configMatrix = configSegment.matrixParams;
+    const linkMatrix = linkSegment.matrixParams;
+    for (const key in configMatrix) {
+        if (!Object.prototype.hasOwnProperty.call(linkMatrix, key) ||
+            linkMatrix[key] !== configMatrix[key]) {
+            return false;
+        }
+    }
+    return true;
+}
+function matchSegmentsRecursive(configSegments, linkSegments, configIdx, linkIdx) {
+    if (configIdx === configSegments.length) {
+        return linkIdx === linkSegments.length;
+    }
+    if (linkIdx === linkSegments.length) {
+        for (let i = configIdx; i < configSegments.length; i++) {
+            if (configSegments[i].pathPart !== '**') {
+                return false;
+            }
+        }
+        return true;
+    }
+    const currentConfigSegment = configSegments[configIdx];
+    if (currentConfigSegment.pathPart === '**') {
+        if (matchSegmentsRecursive(configSegments, linkSegments, configIdx + 1, linkIdx)) {
+            return true;
+        }
+        if (linkIdx < linkSegments.length) {
+            if (matchSegmentsRecursive(configSegments, linkSegments, configIdx, linkIdx + 1)) {
+                return true;
+            }
+        }
+        return false;
+    }
+    else {
+        if (linkIdx < linkSegments.length &&
+            singleSegmentMatches(currentConfigSegment, linkSegments[linkIdx])) {
+            return matchSegmentsRecursive(configSegments, linkSegments, configIdx + 1, linkIdx + 1);
+        }
+        return false;
+    }
+}
+function createWildcardPredicate(path) {
+    const configSegments = path
+        .split('/')
+        .filter((p) => !!p.trim())
+        .map((segment) => parsePathSegment$1(segment));
+    return (linkPath) => {
+        const linkPathOnly = linkPath.split(/[?#]/).at(0) ?? '';
+        const linkSegments = linkPathOnly
+            .split('/')
+            .filter((p) => !!p.trim())
+            .map((segment) => parsePathSegment$1(segment));
+        return matchSegmentsRecursive(configSegments, linkSegments, 0, 0);
+    };
+}
+function createRoutePredicate(path) {
+    return path.includes('**')
+        ? createWildcardPredicate(path)
+        : createBasePredicate(path);
 }
 
+// The following functions are adapted from ngx-quicklink,
+// (https://github.com/mgechev/ngx-quicklink)
+// Copyright (c) Minko Gechev and contributors, licensed under the MIT License.
+function isPrimaryRoute(route) {
+    return route.outlet === PRIMARY_OUTLET || !route.outlet;
+}
+const findPath = (config, route) => {
+    const configQueue = config.slice();
+    const parent = new Map();
+    const visited = new Set();
+    while (configQueue.length) {
+        const el = configQueue.shift();
+        if (!el) {
+            continue;
+        }
+        visited.add(el);
+        if (el === route) {
+            break;
+        }
+        (el.children || []).forEach((childRoute) => {
+            if (!visited.has(childRoute)) {
+                parent.set(childRoute, el);
+                configQueue.push(childRoute);
+            }
+        });
+        const lazyRoutes = el._loadedRoutes || [];
+        if (Array.isArray(lazyRoutes)) {
+            lazyRoutes.forEach((lazyRoute) => {
+                if (lazyRoute && !visited.has(lazyRoute)) {
+                    parent.set(lazyRoute, el);
+                    configQueue.push(lazyRoute);
+                }
+            });
+        }
+    }
+    let path = '';
+    let currentRoute = route;
+    while (currentRoute) {
+        const currentPath = currentRoute.path || '';
+        if (isPrimaryRoute(currentRoute)) {
+            path = `/${currentPath}${path}`;
+        }
+        else {
+            path = `/(${currentRoute.outlet}:${currentPath})${path}`;
+        }
+        currentRoute = parent.get(currentRoute);
+    }
+    let normalizedPath = path.replaceAll(/\/+/g, '/');
+    if (normalizedPath !== '/' && normalizedPath.endsWith('/')) {
+        normalizedPath = normalizedPath.slice(0, -1);
+    }
+    return normalizedPath;
+};
+
 /**
  * Type guard to check if a Router Event is a NavigationEnd event.
  * @internal
@@ -95,8 +223,9 @@ function isNavigationEnd(e) {
  * }
  * ```
  */
-function url() {
-    const router = inject(Router);
+function url(router) {
+    if (!router)
+        router = inject(Router);
     return toSignal(router.events.pipe(filter(isNavigationEnd), map((e) => e.urlAfterRedirects)), {
         initialValue: router.url,
     });
@@ -139,15 +268,15 @@ function leafRoutes() {
     const leafRoutes = computed(() => {
         currentUrl();
         return getLeafRoutes(router.routerState.snapshot);
-    }, ...(ngDevMode ? [{ debugName: "leafRoutes" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "leafRoutes" }] : /* istanbul ignore next */ []));
     return leafRoutes;
 }
 class RouteLeafStore {
     leaves = leafRoutes();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: RouteLeafStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: RouteLeafStore, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: RouteLeafStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: RouteLeafStore, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: RouteLeafStore, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: RouteLeafStore, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -158,6 +287,15 @@ function injectLeafRoutes() {
     return store.leaves;
 }
 
+function injectSnapshotPathResolver() {
+    const router = inject(Router);
+    return (route) => {
+        const segments = route.pathFromRoot.flatMap((snap) => snap.routeConfig?.path ?? []);
+        const joinedSegments = segments.filter(Boolean).join('/');
+        return router.serializeUrl(router.parseUrl(joinedSegments));
+    };
+}
+
 /**
  * @internal
  */
@@ -187,6 +325,56 @@ function isInternalBreadcrumb(breadcrumb) {
     return !!breadcrumb[INTERNAL_BREADCRUMB_SYMBOL];
 }
 
+/**
+ * @internal
+ */
+const token$2 = new InjectionToken('@mmstack/router-core:breadcrumb-config');
+/**
+ * Provides configuration for the breadcrumb system.
+ * @param config - A partial `BreadcrumbConfig` object with the desired settings. *
+ * @see BreadcrumbConfig
+ * @example
+ * ```typescript
+ * // In your app.module.ts or a standalone component's providers:
+ * // import { provideBreadcrumbConfig } from './breadcrumb.config'; // Adjust path
+ * // import { ResolvedLeafRoute } from './breadcrumb.type'; // Adjust path
+ *
+ * // const customLabelStrategy: GenerateBreadcrumbFn = () => {
+ * //   return (leaf: ResolvedLeafRoute): string => {
+ * //     // Example: Prioritize a 'navTitle' data property
+ * //     if (leaf.route.data?.['navTitle']) {
+ * //       return leaf.route.data['navTitle'];
+ * //     }
+ * //     // Fallback to a default mechanism
+ * //     return leaf.route.title || leaf.segment.resolved || 'Unnamed';
+ * //   };
+ * // };
+ *
+ * export const appConfig = [
+ *  // ...rest
+ *  provideBreadcrumbConfig({
+ *   generation: customLabelStrategy, // or 'manual' to disable auto-generation
+ *  }),
+ * ]
+ * ```
+ */
+function provideBreadcrumbConfig(config) {
+    return {
+        provide: token$2,
+        useValue: {
+            ...config,
+        },
+    };
+}
+/**
+ * @internal
+ */
+function injectBreadcrumbConfig() {
+    return (inject(token$2, {
+        optional: true,
+    }) ?? {});
+}
+
 function uppercaseFirst(str) {
     const lcs = str.toLowerCase();
     return lcs.charAt(0).toUpperCase() + lcs.slice(1);
@@ -195,7 +383,7 @@ function removeMatrixAndQueryParams(path) {
     const [cleanPath] = path.split(';');
     return cleanPath.split('?')[0];
 }
-function parsePathSegment$1(pathSegment) {
+function parsePathSegment(pathSegment) {
     return pathSegment
         .split('/')
         .flatMap((part) => part.split('.'))
@@ -206,319 +394,133 @@ function parsePathSegment$1(pathSegment) {
 function generateLabel(leaf) {
     const title = leaf.route.title ?? leaf.route.data?.['title'];
     if (title && typeof title === 'string')
-        return title;
-    if (leaf.segment.path.includes(':'))
-        return leaf.segment.resolved;
-    return parsePathSegment$1(leaf.segment.path);
-}
-function autoGenerateBreadcrumb(id, leaf, autoGenerateFn) {
-    const label = computed(() => autoGenerateFn()(leaf()), ...(ngDevMode ? [{ debugName: "label" }] : []));
-    return createInternalBreadcrumb({
-        id,
-        label,
-        ariaLabel: label,
-        link: computed(() => leaf().link),
-    }, computed(() => leaf().route.data?.['skipBreadcrumb'] !== true &&
-        id !== '' &&
-        id !== '/' &&
-        leaf().segment.path !== '' &&
-        leaf().segment.path !== '/' &&
-        !leaf().segment.path.endsWith('/') &&
-        !!label()));
-}
-function injectGenerateLabelFn() {
-    const { generation } = injectBreadcrumbConfig();
-    if (typeof generation !== 'function')
-        return computed(() => generateLabel);
-    const provided = generation();
-    return computed(() => provided);
-}
-function injectIsManual() {
-    return injectBreadcrumbConfig().generation === 'manual';
-}
-function exposeActiveSignal(crumbSignal, manual) {
-    const active = manual
-        ? computed(() => {
-            const crumb = crumbSignal();
-            return (isInternalBreadcrumb(crumb) &&
-                getBreadcrumbInternals(crumb).registered &&
-                getBreadcrumbInternals(crumb).active());
-        })
-        : computed(() => {
-            const crumb = crumbSignal();
-            if (!isInternalBreadcrumb(crumb))
-                return true;
-            return getBreadcrumbInternals(crumb).active();
-        });
-    const sig = crumbSignal;
-    sig.active = active;
-    return sig;
-}
-class BreadcrumbStore {
-    map = mutable(new Map());
-    isManual = injectIsManual();
-    autoGenerateLabelFn = injectGenerateLabelFn();
-    leafRoutes = injectLeafRoutes();
-    all = mapArray(this.leafRoutes, (leaf) => {
-        const stableId = computed(() => leaf().path, ...(ngDevMode ? [{ debugName: "stableId" }] : []));
-        return exposeActiveSignal(computed(() => {
-            const id = stableId();
-            const found = this.map().get(id);
-            if (!found)
-                return autoGenerateBreadcrumb(id, leaf, this.autoGenerateLabelFn);
-            if (!id.includes(':'))
-                return found;
-            return {
-                ...found,
-                link: computed(() => leaf().link),
-            };
-        }, {
-            equal: (a, b) => a.id === b.id,
-        }), this.isManual);
-    }, {
-        equal: (a, b) => a.link === b.link,
-    });
-    crumbs = computed(() => this.all().filter((c) => c.active()), ...(ngDevMode ? [{ debugName: "crumbs" }] : []));
-    unwrapped = computed(() => this.crumbs().map((c) => c()), ...(ngDevMode ? [{ debugName: "unwrapped" }] : []));
-    register(breadcrumb) {
-        this.map.inline((m) => m.set(breadcrumb.id, breadcrumb));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: BreadcrumbStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: BreadcrumbStore, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: BreadcrumbStore, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
-/**
- * Injects and provides access to a reactive list of breadcrumbs.
- *
- * The breadcrumbs are ordered and reflect the current active navigation path.
- * @see Breadcrumb
- * @returns `Signal<Breadcrumb[]>`
- *
- * @example
- * ```typescript
- * @Component({
- * selector: 'app-breadcrumbs',
- * template: `
- *  <nav aria-label="breadcrumb">
- *    <ol>
- *      @for (crumb of breadcrumbs(); track crumb.id) {
- *        <li>
- *          <a [href]="crumb.link()" [attr.aria-label]="crumb.ariaLabel()">{{ crumb.label() }}</a>
- *        </li>
- *      }
- *    </ol>
- *  </nav>
- * `
- * })
- * export class MyBreadcrumbsComponent {
- *  breadcrumbs = injectBreadcrumbs();
- * }
- * ```
- */
-function injectBreadcrumbs() {
-    const store = inject(BreadcrumbStore);
-    return store.unwrapped;
-}
-
-function parsePathSegment(segmentString) {
-    const parts = segmentString.split(';');
-    const pathPart = parts[0];
-    const matrixParams = {};
-    for (let i = 1; i < parts.length; i++) {
-        const [key, value = 'true'] = parts[i].split('=');
-        if (key) {
-            matrixParams[key] = value;
-        }
-    }
-    return { pathPart, matrixParams };
-}
-function createBasePredicate(path) {
-    const partPredicates = path
-        .split('/')
-        .filter((part) => !!part.trim())
-        .map((configSegmentString) => {
-        const { pathPart: configPathPart, matrixParams: configMatrixParams } = parsePathSegment(configSegmentString);
-        let singlePathPartPredicate;
-        if (configPathPart.startsWith(':')) {
-            singlePathPartPredicate = () => true;
-        }
-        else {
-            singlePathPartPredicate = (linkSegmentPathPart) => linkSegmentPathPart === configPathPart;
-        }
-        const configSegmentHasMatrixParams = Object.keys(configMatrixParams).length > 0;
-        return (linkSegmentString) => {
-            const { pathPart: linkPathPart, matrixParams: linkMatrixParams } = parsePathSegment(linkSegmentString);
-            if (!singlePathPartPredicate(linkPathPart)) {
-                return false;
-            }
-            if (!configSegmentHasMatrixParams) {
-                return true;
-            }
-            return Object.entries(configMatrixParams).every(([key, value]) => Object.prototype.hasOwnProperty.call(linkMatrixParams, key) &&
-                linkMatrixParams[key] === value);
-        };
-    });
-    return (path) => {
-        const linkPathOnly = path.split(/[?#]/).at(0) ?? '';
-        if (!linkPathOnly && partPredicates.length > 0)
-            return false;
-        if (!linkPathOnly && partPredicates.length === 0)
-            return true;
-        const parts = linkPathOnly.split('/').filter((part) => !!part.trim());
-        if (parts.length < partPredicates.length)
-            return false;
-        return parts.every((seg, idx) => {
-            const pred = partPredicates.at(idx);
-            if (!pred)
-                return true;
-            return pred(seg);
-        });
-    };
-}
-function singleSegmentMatches(configSegment, linkSegment) {
-    if (configSegment.pathPart === ':') {
-        return true;
-    }
-    else if (configSegment.pathPart !== linkSegment.pathPart) {
-        return false;
-    }
-    const configMatrix = configSegment.matrixParams;
-    const linkMatrix = linkSegment.matrixParams;
-    for (const key in configMatrix) {
-        if (!Object.prototype.hasOwnProperty.call(linkMatrix, key) ||
-            linkMatrix[key] !== configMatrix[key]) {
-            return false;
-        }
-    }
-    return true;
-}
-function matchSegmentsRecursive(configSegments, linkSegments, configIdx, linkIdx) {
-    if (configIdx === configSegments.length) {
-        return linkIdx === linkSegments.length;
-    }
-    if (linkIdx === linkSegments.length) {
-        for (let i = configIdx; i < configSegments.length; i++) {
-            if (configSegments[i].pathPart !== '**') {
-                return false;
-            }
-        }
-        return true;
-    }
-    const currentConfigSegment = configSegments[configIdx];
-    if (currentConfigSegment.pathPart === '**') {
-        if (matchSegmentsRecursive(configSegments, linkSegments, configIdx + 1, linkIdx)) {
-            return true;
-        }
-        if (linkIdx < linkSegments.length) {
-            if (matchSegmentsRecursive(configSegments, linkSegments, configIdx, linkIdx + 1)) {
-                return true;
-            }
-        }
-        return false;
-    }
-    else {
-        if (linkIdx < linkSegments.length &&
-            singleSegmentMatches(currentConfigSegment, linkSegments[linkIdx])) {
-            return matchSegmentsRecursive(configSegments, linkSegments, configIdx + 1, linkIdx + 1);
-        }
-        return false;
-    }
-}
-function createWildcardPredicate(path) {
-    const configSegments = path
-        .split('/')
-        .filter((p) => !!p.trim())
-        .map((segment) => parsePathSegment(segment));
-    return (linkPath) => {
-        const linkPathOnly = linkPath.split(/[?#]/).at(0) ?? '';
-        const linkSegments = linkPathOnly
-            .split('/')
-            .filter((p) => !!p.trim())
-            .map((segment) => parsePathSegment(segment));
-        return matchSegmentsRecursive(configSegments, linkSegments, 0, 0);
-    };
+        return title;
+    if (leaf.segment.path.includes(':'))
+        return leaf.segment.resolved;
+    return parsePathSegment(leaf.segment.path);
 }
-function createRoutePredicate(path) {
-    return path.includes('**')
-        ? createWildcardPredicate(path)
-        : createBasePredicate(path);
+function autoGenerateBreadcrumb(id, leaf, autoGenerateFn) {
+    const label = computed(() => autoGenerateFn()(leaf()), ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    return createInternalBreadcrumb({
+        id,
+        label,
+        ariaLabel: label,
+        link: computed(() => leaf().link),
+    }, computed(() => leaf().route.data?.['skipBreadcrumb'] !== true &&
+        id !== '' &&
+        id !== '/' &&
+        leaf().segment.path !== '' &&
+        leaf().segment.path !== '/' &&
+        !leaf().segment.path.endsWith('/') &&
+        !!label()), false);
 }
-
-// The following functions are adapted from ngx-quicklink,
-// (https://github.com/mgechev/ngx-quicklink)
-// Copyright (c) Minko Gechev and contributors, licensed under the MIT License.
-function isPrimaryRoute(route) {
-    return route.outlet === PRIMARY_OUTLET || !route.outlet;
+function injectGenerateLabelFn() {
+    const { generation } = injectBreadcrumbConfig();
+    if (typeof generation !== 'function')
+        return computed(() => generateLabel);
+    const provided = generation();
+    return computed(() => provided);
 }
-const findPath = (config, route) => {
-    const configQueue = config.slice();
-    const parent = new Map();
-    const visited = new Set();
-    while (configQueue.length) {
-        const el = configQueue.shift();
-        if (!el) {
-            continue;
-        }
-        visited.add(el);
-        if (el === route) {
-            break;
-        }
-        (el.children || []).forEach((childRoute) => {
-            if (!visited.has(childRoute)) {
-                parent.set(childRoute, el);
-                configQueue.push(childRoute);
-            }
+function injectIsManual() {
+    return injectBreadcrumbConfig().generation === 'manual';
+}
+function exposeActiveSignal(crumbSignal, manual) {
+    const active = manual
+        ? computed(() => {
+            const crumb = crumbSignal();
+            return (isInternalBreadcrumb(crumb) &&
+                getBreadcrumbInternals(crumb).registered &&
+                getBreadcrumbInternals(crumb).active());
+        })
+        : computed(() => {
+            const crumb = crumbSignal();
+            if (!isInternalBreadcrumb(crumb))
+                return true;
+            return getBreadcrumbInternals(crumb).active();
         });
-        const lazyRoutes = el._loadedRoutes || [];
-        if (Array.isArray(lazyRoutes)) {
-            lazyRoutes.forEach((lazyRoute) => {
-                if (lazyRoute && !visited.has(lazyRoute)) {
-                    parent.set(lazyRoute, el);
-                    configQueue.push(lazyRoute);
-                }
-            });
-        }
-    }
-    let path = '';
-    let currentRoute = route;
-    while (currentRoute) {
-        const currentPath = currentRoute.path || '';
-        if (isPrimaryRoute(currentRoute)) {
-            path = `/${currentPath}${path}`;
-        }
-        else {
-            path = `/(${currentRoute.outlet}:${currentPath})${path}`;
-        }
-        currentRoute = parent.get(currentRoute);
-    }
-    let normalizedPath = path.replaceAll(/\/+/g, '/');
-    if (normalizedPath !== '/' && normalizedPath.endsWith('/')) {
-        normalizedPath = normalizedPath.slice(0, -1);
+    const sig = crumbSignal;
+    sig.active = active;
+    return sig;
+}
+class BreadcrumbStore {
+    map = mutable(new Map());
+    isManual = injectIsManual();
+    autoGenerateLabelFn = injectGenerateLabelFn();
+    leafRoutes = injectLeafRoutes();
+    all = mapArray(this.leafRoutes, (leaf) => {
+        const stableId = computed(() => leaf().path, ...(ngDevMode ? [{ debugName: "stableId" }] : /* istanbul ignore next */ []));
+        return exposeActiveSignal(computed(() => {
+            const id = stableId();
+            const found = this.map().get(id);
+            if (!found)
+                return autoGenerateBreadcrumb(id, leaf, this.autoGenerateLabelFn);
+            if (!id.includes(':'))
+                return found;
+            return {
+                ...found,
+                link: computed(() => leaf().link),
+            };
+        }, {
+            equal: (a, b) => a.id === b.id,
+        }), this.isManual);
+    }, {
+        equal: (a, b) => a.link === b.link,
+    });
+    crumbs = computed(() => this.all().filter((c) => c.active()), ...(ngDevMode ? [{ debugName: "crumbs" }] : /* istanbul ignore next */ []));
+    unwrapped = computed(() => this.crumbs().map((c) => c()), ...(ngDevMode ? [{ debugName: "unwrapped" }] : /* istanbul ignore next */ []));
+    register(breadcrumb) {
+        this.map.inline((m) => m.set(breadcrumb.id, breadcrumb));
     }
-    return normalizedPath;
-};
-
-function injectSnapshotPathResolver() {
-    const router = inject(Router);
-    return (route) => {
-        const segments = route.pathFromRoot.flatMap((snap) => snap.routeConfig?.path ?? []);
-        const joinedSegments = segments.filter(Boolean).join('/');
-        return router.serializeUrl(router.parseUrl(joinedSegments));
-    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: BreadcrumbStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: BreadcrumbStore, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: BreadcrumbStore, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+/**
+ * Injects and provides access to a reactive list of breadcrumbs.
+ *
+ * The breadcrumbs are ordered and reflect the current active navigation path.
+ * @see Breadcrumb
+ * @returns `Signal<Breadcrumb[]>`
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ * selector: 'app-breadcrumbs',
+ * template: `
+ *  <nav aria-label="breadcrumb">
+ *    <ol>
+ *      @for (crumb of breadcrumbs(); track crumb.id) {
+ *        <li>
+ *          <a [href]="crumb.link()" [attr.aria-label]="crumb.ariaLabel()">{{ crumb.label() }}</a>
+ *        </li>
+ *      }
+ *    </ol>
+ *  </nav>
+ * `
+ * })
+ * export class MyBreadcrumbsComponent {
+ *  breadcrumbs = injectBreadcrumbs();
+ * }
+ * ```
+ */
+function injectBreadcrumbs() {
+    const store = inject(BreadcrumbStore);
+    return store.unwrapped;
 }
 
 /**
  * Creates and registers a breadcrumb for a specific route.
  * This function is designed to be used as an Angular Route `ResolveFn`.
- * It handles the registration of the breadcrumb with the `BreadcrumbStore`
- * and ensures automatic deregistration when the route is destroyed.
  *
- * @param factory A function that returns a `CreateBreadcrumbOptions` object.
+ * Accepts a static label (`string`), a static options object, or a factory returning either —
+ * use a factory when you need `inject()` for dynamic data.
+ *
+ * @param factoryOrValue A static label, a static `CreateBreadcrumbOptions`, or a factory returning either.
  * @see CreateBreadcrumbOptions
  *
  * @example
@@ -528,25 +530,34 @@ function injectSnapshotPathResolver() {
  *     path: 'home',
  *     component: HomeComponent,
  *     resolve: {
- *       breadcrumb: createBreadcrumb(() => ({
- *         label: 'Home',
- *       });
+ *       // shorthand for { label: 'Home' }
+ *       breadcrumb: createBreadcrumb('Home'),
  *     },
+ *   },
+ *   {
  *     path: 'users/:userId',
  *     component: UserProfileComponent,
  *     resolve: {
  *       breadcrumb: createBreadcrumb(() => {
  *         const userStore = inject(UserStore);
  *         return {
- *            label: () => userStore.user().name ?? 'Loading...
- *        };
- *      })
+ *           label: () => userStore.user().name ?? 'Loading...',
+ *         };
+ *       }),
  *     },
- *   }
+ *   },
  * ];
  * ```
  */
-function createBreadcrumb(factory) {
+function createBreadcrumb(factoryOrValue) {
+    const factory = typeof factoryOrValue === 'string'
+        ? () => ({ label: factoryOrValue })
+        : typeof factoryOrValue === 'function'
+            ? () => {
+                const result = factoryOrValue();
+                return typeof result === 'string' ? { label: result } : result;
+            }
+            : () => factoryOrValue;
     return async (route) => {
         const router = inject(Router);
         const store = inject(BreadcrumbStore);
@@ -554,7 +565,7 @@ function createBreadcrumb(factory) {
         const fp = resolver(route);
         const tree = createUrlTreeFromSnapshot(route, [], route.queryParams, route.fragment);
         const provided = factory();
-        const link = computed(() => router.serializeUrl(tree), ...(ngDevMode ? [{ debugName: "link" }] : []));
+        const link = computed(() => router.serializeUrl(tree), ...(ngDevMode ? [{ debugName: "link" }] : /* istanbul ignore next */ []));
         const { label, ariaLabel = label } = provided;
         const bc = {
             id: fp,
@@ -577,10 +588,10 @@ class PreloadRequester {
     startPreload(routePath) {
         this.preloadOnDemand$.next(routePath);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PreloadRequester, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PreloadRequester, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: PreloadRequester, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: PreloadRequester, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PreloadRequester, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: PreloadRequester, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -620,10 +631,10 @@ class PreloadStrategy {
         const predicate = createRoutePredicate(fp);
         return this.req.preloadRequested$.pipe(filter$1((path) => path === fp || predicate(path)), take(1), switchMap(() => load()), finalize(() => this.loading.delete(fp)));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PreloadStrategy, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PreloadStrategy, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: PreloadStrategy, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: PreloadStrategy, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PreloadStrategy, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: PreloadStrategy, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -650,6 +661,38 @@ function treeToSerializedUrl(router, urlTree) {
         return null;
     return router.serializeUrl(urlTree);
 }
+/**
+ * Returns an imperative function that triggers preloading for an arbitrary link, using
+ * the same path resolution and {@link PreloadStrategy} pipeline as the {@link Link}
+ * (`mmLink`) directive.
+ *
+ * Use this when the `Link` directive isn't a fit — for example, preloading a route from
+ * an effect when a user opens a menu, hovers a non-link element, or reacts to a signal
+ * change — and you don't want to render an `<a [mmLink]>` just to request the preload.
+ *
+ * Requires {@link PreloadStrategy} to be wired up via `provideRouter(routes, withPreloading(PreloadStrategy))`,
+ * just like the directive.
+ *
+ * @returns A function accepting the same link descriptor shape as `mmLink` (`string`,
+ * commands array, `UrlTree`, or `null`). Passing `null` or an unresolvable link is a no-op.
+ *
+ * @example
+ * ```typescript
+ * @Component({ ... })
+ * export class CommandPaletteComponent {
+ *   private readonly triggerPreload = injectTriggerPreload();
+ *
+ *   protected readonly highlighted = signal<string | null>(null);
+ *
+ *   constructor() {
+ *     effect(() => {
+ *       const target = this.highlighted();
+ *       if (target) this.triggerPreload(target);
+ *     });
+ *   }
+ * }
+ * ```
+ */
 function injectTriggerPreload() {
     const req = inject(PreloadRequester);
     const router = inject(Router);
@@ -688,26 +731,26 @@ class Link {
     }) ?? inject(RouterLinkWithHref, { self: true, optional: true });
     req = inject(PreloadRequester);
     router = inject(Router);
-    target = input(...(ngDevMode ? [undefined, { debugName: "target" }] : []));
-    queryParams = input(...(ngDevMode ? [undefined, { debugName: "queryParams" }] : []));
-    fragment = input(...(ngDevMode ? [undefined, { debugName: "fragment" }] : []));
-    queryParamsHandling = input(...(ngDevMode ? [undefined, { debugName: "queryParamsHandling" }] : []));
-    state = input(...(ngDevMode ? [undefined, { debugName: "state" }] : []));
-    info = input(...(ngDevMode ? [undefined, { debugName: "info" }] : []));
-    relativeTo = input(...(ngDevMode ? [undefined, { debugName: "relativeTo" }] : []));
-    skipLocationChange = input(false, { ...(ngDevMode ? { debugName: "skipLocationChange" } : {}), transform: booleanAttribute });
-    replaceUrl = input(false, { ...(ngDevMode ? { debugName: "replaceUrl" } : {}), transform: booleanAttribute });
-    mmLink = input(null, ...(ngDevMode ? [{ debugName: "mmLink" }] : []));
-    preloadOn = input(injectConfig().preloadOn, ...(ngDevMode ? [{ debugName: "preloadOn" }] : []));
-    useMouseDown = input(injectConfig().useMouseDown, { ...(ngDevMode ? { debugName: "useMouseDown" } : {}), transform: booleanAttribute });
-    beforeNavigate = input(...(ngDevMode ? [undefined, { debugName: "beforeNavigate" }] : []));
+    target = input(...(ngDevMode ? [undefined, { debugName: "target" }] : /* istanbul ignore next */ []));
+    queryParams = input(...(ngDevMode ? [undefined, { debugName: "queryParams" }] : /* istanbul ignore next */ []));
+    fragment = input(...(ngDevMode ? [undefined, { debugName: "fragment" }] : /* istanbul ignore next */ []));
+    queryParamsHandling = input(...(ngDevMode ? [undefined, { debugName: "queryParamsHandling" }] : /* istanbul ignore next */ []));
+    state = input(...(ngDevMode ? [undefined, { debugName: "state" }] : /* istanbul ignore next */ []));
+    info = input(...(ngDevMode ? [undefined, { debugName: "info" }] : /* istanbul ignore next */ []));
+    relativeTo = input(...(ngDevMode ? [undefined, { debugName: "relativeTo" }] : /* istanbul ignore next */ []));
+    skipLocationChange = input(false, { ...(ngDevMode ? { debugName: "skipLocationChange" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    replaceUrl = input(false, { ...(ngDevMode ? { debugName: "replaceUrl" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    mmLink = input(null, ...(ngDevMode ? [{ debugName: "mmLink" }] : /* istanbul ignore next */ []));
+    preloadOn = input(injectConfig().preloadOn, ...(ngDevMode ? [{ debugName: "preloadOn" }] : /* istanbul ignore next */ []));
+    useMouseDown = input(injectConfig().useMouseDown, { ...(ngDevMode ? { debugName: "useMouseDown" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    beforeNavigate = input(...(ngDevMode ? [undefined, { debugName: "beforeNavigate" }] : /* istanbul ignore next */ []));
     preloading = output();
     urlTree = computed(() => {
         return inputToUrlTree(this.router, this.mmLink(), this.relativeTo(), this.queryParams(), this.fragment(), this.queryParamsHandling(), this.routerLink?.urlTree);
-    }, ...(ngDevMode ? [{ debugName: "urlTree" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "urlTree" }] : /* istanbul ignore next */ []));
     fullPath = computed(() => {
         return treeToSerializedUrl(this.router, this.urlTree());
-    }, ...(ngDevMode ? [{ debugName: "fullPath" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "fullPath" }] : /* istanbul ignore next */ []));
     onHover() {
         if (untracked(this.preloadOn) !== 'hover')
             return;
@@ -743,10 +786,10 @@ class Link {
         untracked(this.beforeNavigate)?.();
         return this.routerLink?.onClick(button, ctrlKey, shiftKey, altKey, metaKey);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: Link, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.8", type: Link, isStandalone: true, selector: "[mmLink]", inputs: { target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, fragment: { classPropertyName: "fragment", publicName: "fragment", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, info: { classPropertyName: "info", publicName: "info", isSignal: true, isRequired: false, transformFunction: null }, relativeTo: { classPropertyName: "relativeTo", publicName: "relativeTo", isSignal: true, isRequired: false, transformFunction: null }, skipLocationChange: { classPropertyName: "skipLocationChange", publicName: "skipLocationChange", isSignal: true, isRequired: false, transformFunction: null }, replaceUrl: { classPropertyName: "replaceUrl", publicName: "replaceUrl", isSignal: true, isRequired: false, transformFunction: null }, mmLink: { classPropertyName: "mmLink", publicName: "mmLink", isSignal: true, isRequired: false, transformFunction: null }, preloadOn: { classPropertyName: "preloadOn", publicName: "preloadOn", isSignal: true, isRequired: false, transformFunction: null }, useMouseDown: { classPropertyName: "useMouseDown", publicName: "useMouseDown", isSignal: true, isRequired: false, transformFunction: null }, beforeNavigate: { classPropertyName: "beforeNavigate", publicName: "beforeNavigate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { preloading: "preloading" }, host: { listeners: { "mouseenter": "onHover()", "mousedown": "onMouseDown($event.button,$event.ctrlKey,$event.shiftKey,$event.altKey,$event.metaKey)", "click": "onClick($event.button,$event.ctrlKey,$event.shiftKey,$event.altKey,$event.metaKey)" } }, exportAs: ["mmLink"], hostDirectives: [{ directive: i1.RouterLink, inputs: ["routerLink", "mmLink", "target", "target", "queryParams", "queryParams", "fragment", "fragment", "queryParamsHandling", "queryParamsHandling", "state", "state", "relativeTo", "relativeTo", "skipLocationChange", "skipLocationChange", "replaceUrl", "replaceUrl"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: Link, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.12", type: Link, isStandalone: true, selector: "[mmLink]", inputs: { target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, fragment: { classPropertyName: "fragment", publicName: "fragment", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, info: { classPropertyName: "info", publicName: "info", isSignal: true, isRequired: false, transformFunction: null }, relativeTo: { classPropertyName: "relativeTo", publicName: "relativeTo", isSignal: true, isRequired: false, transformFunction: null }, skipLocationChange: { classPropertyName: "skipLocationChange", publicName: "skipLocationChange", isSignal: true, isRequired: false, transformFunction: null }, replaceUrl: { classPropertyName: "replaceUrl", publicName: "replaceUrl", isSignal: true, isRequired: false, transformFunction: null }, mmLink: { classPropertyName: "mmLink", publicName: "mmLink", isSignal: true, isRequired: false, transformFunction: null }, preloadOn: { classPropertyName: "preloadOn", publicName: "preloadOn", isSignal: true, isRequired: false, transformFunction: null }, useMouseDown: { classPropertyName: "useMouseDown", publicName: "useMouseDown", isSignal: true, isRequired: false, transformFunction: null }, beforeNavigate: { classPropertyName: "beforeNavigate", publicName: "beforeNavigate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { preloading: "preloading" }, host: { listeners: { "mouseenter": "onHover()", "mousedown": "onMouseDown($event.button,$event.ctrlKey,$event.shiftKey,$event.altKey,$event.metaKey)", "click": "onClick($event.button,$event.ctrlKey,$event.shiftKey,$event.altKey,$event.metaKey)" } }, exportAs: ["mmLink"], hostDirectives: [{ directive: i1.RouterLink, inputs: ["routerLink", "mmLink", "target", "target", "queryParams", "queryParams", "fragment", "fragment", "queryParamsHandling", "queryParamsHandling", "state", "state", "relativeTo", "relativeTo", "skipLocationChange", "skipLocationChange", "replaceUrl", "replaceUrl"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: Link, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: Link, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mmLink]',
@@ -791,6 +834,229 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                     ]]
             }] } });
 
+/** @internal */
+const NEVER_TRUE = computed(() => false, ...(ngDevMode ? [{ debugName: "NEVER_TRUE" }] : /* istanbul ignore next */ []));
+function wrap(value, fallback) {
+    if (value === undefined)
+        return fallback ? fallback : computed(() => undefined);
+    if (typeof value === 'function')
+        return isSignal(value) ? value : computed(value);
+    return computed(() => value);
+}
+function isAbsoluteCommandArray(commands) {
+    return (commands.length > 0 &&
+        typeof commands[0] === 'string' &&
+        commands[0].startsWith('/'));
+}
+function resolveLinkTree(input, router, relativeTo) {
+    const raw = typeof input === 'function' ? input() : input;
+    if (raw === undefined || raw === null)
+        return null;
+    if (raw instanceof UrlTree)
+        return raw;
+    if (typeof raw === 'string') {
+        if (raw.startsWith('/'))
+            return router.parseUrl(raw);
+        const parsed = router.parseUrl('/' + raw);
+        const primary = parsed.root.children['primary'];
+        const segments = primary ? primary.segments.map((s) => s.path) : [];
+        return createUrlTreeFromSnapshot(relativeTo, segments, parsed.queryParams, parsed.fragment);
+    }
+    if (isAbsoluteCommandArray(raw))
+        return router.createUrlTree(raw);
+    return createUrlTreeFromSnapshot(relativeTo, raw);
+}
+function resolveMeta(input) {
+    if (input === undefined)
+        return {};
+    return typeof input === 'function' ? input() : input;
+}
+/**
+ * @internal
+ * Recursively builds an {@link InternalNavItem} tree from {@link CreateNavItem} input.
+ * Cascades parent `disabled`/`hidden` to descendants and computes `active` against the
+ * current router URL using `Router.isActive`.
+ */
+function createInternalNavItem(input, router, relativeTo, configActiveMatch, parentDisabled, parentHidden, fallbackId) {
+    const label = wrap(input.label);
+    const ariaLabel = input.ariaLabel ? wrap(input.ariaLabel) : label;
+    const linkTree = computed(() => resolveLinkTree(input.link, router, relativeTo), ...(ngDevMode ? [{ debugName: "linkTree" }] : /* istanbul ignore next */ []));
+    const link = computed(() => {
+        const tree = linkTree();
+        return tree ? router.serializeUrl(tree) : null;
+    }, ...(ngDevMode ? [{ debugName: "link" }] : /* istanbul ignore next */ []));
+    const ownDisabled = wrap(input.disabled, NEVER_TRUE);
+    const ownHidden = wrap(input.hidden, NEVER_TRUE);
+    const disabled = computed(() => parentDisabled() || ownDisabled(), ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    const hidden = computed(() => parentHidden() || ownHidden(), ...(ngDevMode ? [{ debugName: "hidden" }] : /* istanbul ignore next */ []));
+    const metaInput = input.meta;
+    const meta = computed(() => resolveMeta(metaInput), ...(ngDevMode ? [{ debugName: "meta" }] : /* istanbul ignore next */ []));
+    const id = input.id !== undefined
+        ? wrap(input.id)
+        : computed(() => link() ?? fallbackId);
+    const childItems = (input.children ?? []).map((childInput, i) => createInternalNavItem(childInput, router, relativeTo, configActiveMatch, disabled, hidden, `${fallbackId}.${i}`));
+    const children = computed(() => childItems.filter((c) => !c.hidden()), ...(ngDevMode ? [{ debugName: "children" }] : /* istanbul ignore next */ []));
+    const mergedActiveMatch = {
+        ...configActiveMatch,
+        ...input.activeMatch,
+    };
+    const trackNavigation = url(router);
+    const finalOptions = {
+        paths: 'subset',
+        fragment: 'ignored',
+        matrixParams: 'ignored',
+        queryParams: 'subset',
+        ...mergedActiveMatch,
+    };
+    const ownActive = computed(() => {
+        trackNavigation();
+        const tree = linkTree();
+        return tree ? router.isActive(tree, finalOptions) : false;
+    }, ...(ngDevMode ? [{ debugName: "ownActive" }] : /* istanbul ignore next */ []));
+    const orWithChildren = input.matchesWhenChildActive ?? input.activeMatch === undefined;
+    const active = computed(() => ownActive() ||
+        (orWithChildren &&
+            !!childItems.length &&
+            childItems.some((c) => c.active())), ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    return {
+        id,
+        label,
+        ariaLabel,
+        link,
+        active,
+        disabled,
+        hidden,
+        meta,
+        children,
+    };
+}
+
+/** @internal */
+const token$1 = new InjectionToken('@mmstack/router-core:nav-config');
+/**
+ * Provides global configuration for the nav system.
+ *
+ * @example
+ * ```typescript
+ * provideNavConfig({
+ *   activeMatch: { queryParams: 'ignored' },
+ * }),
+ * ```
+ */
+function provideNavConfig(config) {
+    return {
+        provide: token$1,
+        useValue: { ...config },
+    };
+}
+/** @internal */
+function injectNavConfig() {
+    return inject(token$1, { optional: true }) ?? {};
+}
+
+/** @internal */
+const DEFAULT_NAV_SCOPE = Symbol('mmstack.nav.default');
+class NavStore {
+    map = mutable(new Map());
+    leafRoutes = injectLeafRoutes();
+    /** @internal */
+    register(scope, routePath, items) {
+        this.map.inline((m) => {
+            let scopeMap = m.get(scope);
+            if (!scopeMap) {
+                scopeMap = new Map();
+                m.set(scope, scopeMap);
+            }
+            scopeMap.set(routePath, items);
+        });
+    }
+    /** @internal */
+    scope(name) {
+        return computed(() => {
+            const scopeMap = this.map().get(name);
+            if (!scopeMap)
+                return [];
+            const leaves = this.leafRoutes();
+            for (let i = leaves.length - 1; i >= 0; i--) {
+                const items = scopeMap.get(leaves[i].path);
+                if (items) {
+                    return items.filter((it) => !it.hidden());
+                }
+            }
+            return [];
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NavStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NavStore, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NavStore, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+/**
+ * Returns a reactive list of nav items for the requested scope.
+ *
+ * The returned signal reflects the nearest active ancestor route that registered items
+ * for `name` via `createNavItems`. Hidden items are filtered out.
+ *
+ * @typeParam TMeta The shape of `NavItem.meta` for the consuming code. Untyped at the
+ * registration site — this is a consumer-side assertion.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   template: `
+ *     @for (item of items(); track item) {
+ *       <a [href]="item.link()" [class.active]="item.active()">{{ item.label() }}</a>
+ *     }
+ *   `,
+ * })
+ * export class TopBar {
+ *   protected readonly items = injectNavItems();
+ * }
+ * ```
+ */
+function injectNavItems(name) {
+    const store = inject(NavStore);
+    return store.scope(name ?? DEFAULT_NAV_SCOPE);
+}
+
+/**
+ * Registers a set of nav items for the activating route under the given scope.
+ * Mirrors `createBreadcrumb` / `createTitle` — designed to be used in a route's
+ * `resolve` map.
+ *
+ * Multiple scopes can be registered on a single route by giving each its own `name`
+ * (and a unique key in the `resolve` map):
+ *
+ * ```typescript
+ * resolve: {
+ *   mainNav: createNavItems([...], { name: 'main' }),
+ *   sideNav: createNavItems([...], { name: 'side' }),
+ * }
+ * ```
+ *
+ * Scope override semantics: when multiple routes in the active chain register items
+ * under the same scope, the deepest active registration wins. Navigating away restores
+ * the shallower registration.
+ */
+function createNavItems(itemsOrFactory, options) {
+    const factory = typeof itemsOrFactory === 'function'
+        ? itemsOrFactory
+        : () => itemsOrFactory;
+    return async (route) => {
+        const router = inject(Router);
+        const store = inject(NavStore);
+        const resolveRoutePath = injectSnapshotPathResolver();
+        const config = injectNavConfig();
+        const routePath = resolveRoutePath(route);
+        const scope = options?.name ?? DEFAULT_NAV_SCOPE;
+        const items = factory().map((input, i) => createInternalNavItem(input, router, route, config.activeMatch, NEVER_TRUE, NEVER_TRUE, `${routePath}#${i}`));
+        store.register(scope, routePath, items);
+        return Promise.resolve();
+    };
+}
+
 /**
  * Creates a WritableSignal that synchronizes with a specific URL query parameter,
  * enabling two-way binding between the signal's state and the URL.
@@ -822,7 +1088,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  *
  * @Component({
  * selector: 'app-product-list',
- * standalone: true,
  * // imports: [FormsModule], // If using ngModel
  * template: `
  * <div>
@@ -880,7 +1145,7 @@ function queryParam(key, route = inject(ActivatedRoute)) {
     const queryParams = toSignal(route.queryParams, {
         initialValue: route.snapshot.queryParams,
     });
-    const queryParam = computed(() => queryParamMap().get(keySignal()), ...(ngDevMode ? [{ debugName: "queryParam" }] : []));
+    const queryParam = computed(() => queryParamMap().get(keySignal()), ...(ngDevMode ? [{ debugName: "queryParam" }] : /* istanbul ignore next */ []));
     const set = (newValue) => {
         const next = {
             ...untracked(queryParams),
@@ -901,7 +1166,7 @@ function queryParam(key, route = inject(ActivatedRoute)) {
     return toWritable(queryParam, set);
 }
 
-const token = new InjectionToken('MMSTACK_TITLE_CONFIG');
+const token = new InjectionToken('@mmstack/router-core:title-config');
 /**
  * used to provide the title configuration, will not be applied unless a `createTitle` resolver is used
  */
@@ -913,29 +1178,41 @@ function provideTitleConfig(config) {
     return {
         provide: token,
         useValue: {
+            initialTitle: config?.initialTitle ?? '',
             parser: prefixFn,
             keepLastKnown: config?.keepLastKnownTitle ?? true,
         },
     };
 }
+function identity(str) {
+    return str;
+}
 function injectTitleConfig() {
-    return inject(token);
+    return (inject(token, {
+        optional: true,
+    }) ?? {
+        initialTitle: '',
+        parser: identity,
+        keepLastKnown: true,
+    });
 }
 
 class TitleStore {
-    title = inject(Title);
     map = mutable(new Map());
-    leafRoutes = injectLeafRoutes();
     constructor() {
-        const reverseLeaves = computed(() => this.leafRoutes().toReversed(), ...(ngDevMode ? [{ debugName: "reverseLeaves" }] : []));
+        const { keepLastKnown, initialTitle } = injectTitleConfig();
+        const leafRoutes = injectLeafRoutes();
+        const title = inject(Title);
+        const fallbackTitle = initialTitle || untracked(() => title.getTitle());
+        const reverseLeaves = computed(() => leafRoutes().toReversed(), ...(ngDevMode ? [{ debugName: "reverseLeaves" }] : /* istanbul ignore next */ []));
         const currentResolvedTitles = computed(() => {
             const map = this.map();
             return reverseLeaves()
-                .map((leaf) => map.get(leaf.path)?.() ?? leaf.route.title)
-                .filter((v) => !!v);
-        }, ...(ngDevMode ? [{ debugName: "currentResolvedTitles" }] : []));
-        const currentTitle = computed(() => currentResolvedTitles().at(0) ?? '', ...(ngDevMode ? [{ debugName: "currentTitle" }] : []));
-        const heldTitle = injectTitleConfig().keepLastKnown
+                .map((leaf) => map.get(leaf.path)?.() ?? leaf.route.title ?? null)
+                .filter((v) => v !== null);
+        }, ...(ngDevMode ? [{ debugName: "currentResolvedTitles" }] : /* istanbul ignore next */ []));
+        const currentTitle = computed(() => currentResolvedTitles().at(0) ?? '', ...(ngDevMode ? [{ debugName: "currentTitle" }] : /* istanbul ignore next */ []));
+        const heldTitle = keepLastKnown
             ? linkedSignal({
                 source: () => currentTitle(),
                 computation: (value, prev) => {
@@ -946,16 +1223,16 @@ class TitleStore {
             })
             : currentTitle;
         effect(() => {
-            this.title.setTitle(heldTitle());
+            title.setTitle(heldTitle() || fallbackTitle);
         });
     }
     register(id, titleFn) {
         this.map.inline((m) => m.set(id, titleFn));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: TitleStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: TitleStore, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: TitleStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: TitleStore, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: TitleStore, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: TitleStore, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -965,23 +1242,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  *
  * Creates a title resolver function that can be used in Angular's router.
  *
- * @param fn
- * A function that returns a string or a Signal<string> representing the title.
+ * @param factoryOrValue
+ * A function that returns a string or a Signal<string> representing the title or just the string directly.
  * @param awaitValue
  * If `true`, the resolver will wait until the title signal has a value before resolving.
  * Defaults to `false`.
  */
-function createTitle(fn, awaitValue = false) {
+function createTitle(factoryOrValue, awaitValue = false) {
+    const factory = typeof factoryOrValue === 'string' ? () => factoryOrValue : factoryOrValue;
     return async (route) => {
         const store = inject(TitleStore);
         const resolver = injectSnapshotPathResolver();
         const fp = resolver(route);
         const { parser } = injectTitleConfig();
-        const resolved = fn();
+        const resolved = factory();
         const titleSignal = typeof resolved === 'string'
             ? computed(() => resolved)
             : computed(resolved);
-        const parsedTitleSignal = computed(() => parser(titleSignal()), ...(ngDevMode ? [{ debugName: "parsedTitleSignal" }] : []));
+        const parsedTitleSignal = computed(() => parser(titleSignal()), ...(ngDevMode ? [{ debugName: "parsedTitleSignal" }] : /* istanbul ignore next */ []));
         store.register(fp, parsedTitleSignal);
         if (awaitValue)
             await until(parsedTitleSignal, (v) => !!v);
@@ -993,5 +1271,5 @@ function createTitle(fn, awaitValue = false) {
  * Generated bundle index. Do not edit.
  */
 
-export { Link, PreloadStrategy, createBreadcrumb, createTitle, injectBreadcrumbs, injectTriggerPreload, provideBreadcrumbConfig, provideMMLinkDefaultConfig, provideTitleConfig, queryParam, url };
+export { Link, PreloadStrategy, createBreadcrumb, createNavItems, createTitle, injectBreadcrumbs, injectNavItems, injectTriggerPreload, provideBreadcrumbConfig, provideMMLinkDefaultConfig, provideNavConfig, provideTitleConfig, queryParam, url };
 //# sourceMappingURL=mmstack-router-core.mjs.map