@loozo/angular-router 0.0.7 → 0.0.9

package/node/src/generation/overlay.js

@@ -10,8 +10,15 @@ export function overlayHost(options, authored) {
     const read = host.readFile.bind(host);
     const exists = host.fileExists.bind(host);
     const directoryExists = host.directoryExists.bind(host);
+    // On a case-insensitive host, a stale import that still spells a renamed directory's old
+    // casing names the same file as its authored rewrite, and TypeScript keeps whichever
+    // spelling it reaches first; both spellings must read the rewrite.
+    const byName = new Map();
+    for (const [file, raw] of authored) {
+        byName.set(host.getCanonicalFileName(file), raw);
+    }
     host.readFile = (file) => {
-        const raw = authored.get(resolve(file));
+        const raw = byName.get(host.getCanonicalFileName(resolve(file)));
         if (raw === undefined) {
             return read(file);
         }
@@ -22,7 +29,7 @@ export function overlayHost(options, authored) {
         }
         return raw;
     };
-    host.fileExists = (file) => authored.has(resolve(file)) || exists(file);
+    host.fileExists = (file) => byName.has(host.getCanonicalFileName(resolve(file))) || exists(file);
     host.directoryExists = (directory) => {
         for (const file of authored.keys()) {
             if (contains(resolve(directory), file)) {

package/node/src/generation/sources.js

@@ -3,13 +3,15 @@ import { readFile, realpath } from "node:fs/promises";
 import { dirname, isAbsolute, relative, resolve, sep } from "node:path";
 import { fileURLToPath } from "node:url";
 import { parsePath } from "../../_core/src/path.js";
-import { auditPath, contains, metadata, walk, workspacePaths, markers } from "./files.js";
+import { auditPath, contains, marked, metadata, walk, workspacePaths, markers } from "./files.js";
 import { overlayDirectory, overlayHost } from "./overlay.js";
 import { synchronize, transparent } from "./filesystem.js";
 export function fail(node, message) {
     const source = node.getSourceFile();
     const position = source.getLineAndCharacterOfPosition(node.getStart());
-    throw new Error(`${source.fileName}:${position.line + 1}:${position.character + 1}: ${message}`);
+    // Native, like the generator's other file diagnostics; TypeScript's fileName uses "/" everywhere.
+    const file = resolve(source.fileName);
+    throw new Error(`${file}:${position.line + 1}:${position.character + 1}: ${message}`);
 }
 export function properties(node, label) {
     if (!ts.isObjectLiteralExpression(node)) {
@@ -39,7 +41,13 @@ export function properties(node, label) {
     return result;
 }
 export function resolveModule(name, source, options, host = ts.sys) {
-    return ts.resolveModuleName(name, source, options, host).resolvedModule?.resolvedFileName;
+    const resolved = ts.resolveModuleName(name, source, options, host).resolvedModule
+        ?.resolvedFileName;
+    // TypeScript separates resolved paths with "/" on every host; callers compare native paths.
+    if (resolved === undefined) {
+        return undefined;
+    }
+    return resolve(resolved);
 }
 export function namedImport(source, name, imported) {
     if (!ts.isIdentifier(name)) {
@@ -259,8 +267,7 @@ export async function discover(workspace, config, scans, out, auto, authored = n
             }
             throw new Error(`Cannot read admitted TypeScript source: ${file}`);
         }
-        if (file.endsWith(`${sep}route.generated.ts`) &&
-            bytes.split("\n", 1)[0] === markers["route.generated.ts"]) {
+        if (file.endsWith(`${sep}route.generated.ts`) && marked(bytes, markers["route.generated.ts"])) {
             continue;
         }
         const source = syntaxProgram.getSourceFile(file);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loozo/angular-router",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "description": "Typed route declarations, URLs, navigation and route handles for Angular's native router.",
   "bugs": "https://github.com/theo-matzavinos/loozo/issues",
   "license": "MIT",

package/snippets/generated/destinations.generated.ts

@@ -1,5 +1,6 @@
 // @loozo/angular-router routegen: owned destinations.generated.ts
-import type { RouteSet, Handle as GeneratedHandle, Destination as GeneratedDestination } from '@loozo/angular-router/_generated';
+import type { Signal } from '@angular/core';
+import { injectGeneratedActiveRoute, type RouteSet, type Handle as GeneratedHandle, type Destination as GeneratedDestination } from '@loozo/angular-router/_generated';
 import definition_products_$productId_route from "../src/routes/products/$productId/route.js";
 import definition_reports_$reportId_route from "../src/routes/reports/$reportId/route.js";
 import definition_teams_$teamId_items_$id_route from "../src/routes/teams/$teamId/items/$id/route.js";
@@ -44,6 +45,29 @@ type ParentOf<Id extends Retained> = Id extends keyof Parents ? Definitions[Pare
 export type Handle<Id extends Retained> = GeneratedHandle<Definitions[Id], AbsoluteSelected, ParentOf<Id>, typeof setIdentity, Pick<Definitions, Retained>>;
 /** A same-set nominal reference; use the destination exported by a colocated facade. */
 export type Destination<Id extends Retained> = GeneratedDestination<Definitions[Id], typeof setIdentity, Id>;
+interface ActiveBase {
+  /** Exactly this route, not an ancestor. Narrows to that route's handle. */
+  is<Other extends Retained>(destination: Destination<Other>): this is ActiveHandle<Other>;
+  /** This route or one of its active ancestors. */
+  contains(destination: Destination<Retained>): boolean;
+  /** Active generated routes, top-level first, ending with this one. */
+  readonly chain: readonly ActiveRoute[];
+}
+/** An active route narrowed by is(): that declaration's handle. */
+export interface ActiveHandle<Id extends Retained> extends Handle<Id>, ActiveBase {}
+/** An active route before narrowing: params, search, data and title read as the union of the set's values; link and navigate need is(). */
+export interface ActiveRoute extends Pick<Handle<Retained>, "params" | "search" | "data" | "title">, ActiveBase {}
+/**
+ * Injects a signal of the deepest active generated route in the primary outlet.
+ *
+ * @remarks
+ * Call in an Angular injection context. The value changes only when a navigation
+ * commits, and is undefined before the first one or when no route of this set is
+ * active. A route keeps its handle while it stays active; each call is its own reader.
+ */
+export function injectActiveRoute(): Signal<ActiveRoute | undefined> {
+  return injectGeneratedActiveRoute(getRouteSet());
+}
 const routeSet: RouteSet = { records: {
 "src/routes/products/$productId/route.ts": { definition: () => definition_products_$productId_route, owners: ["src/routes/products/$productId/route.ts"] },
 "src/routes/reports/$reportId/route.ts": { definition: () => definition_reports_$reportId_route, owners: ["src/routes/reports/$reportId/route.ts"] },

package/snippets/src/routes/products/$productId/route.generated.ts

@@ -13,8 +13,10 @@ export const destination: Destination<"src/routes/products/$productId/route.ts">
  *
  * @remarks
  * Call in an Angular injection context. The handle exposes readonly native
- * params/search/data Signals and destination-typed link/navigate methods.
- * Data includes local resolver results only, not static or inherited data.
+ * params/search/data/title Signals and destination-typed link/navigate methods.
+ * Data holds the resolver results of this route and its ancestors, a nearer
+ * key hiding an ancestor's; native static data and the title stay out. Title
+ * is the nearest declared title in the chain, or undefined when none declares one.
  * All navigation values are explicit; current inputs are never reused implicitly.
  *
  * @returns A noncallable handle for this declaration.

package/snippets/src/routes/reports/$reportId/route.generated.ts

@@ -13,8 +13,10 @@ export const destination: Destination<"src/routes/reports/$reportId/route.ts"> =
  *
  * @remarks
  * Call in an Angular injection context. The handle exposes readonly native
- * params/search/data Signals and destination-typed link/navigate methods.
- * Data includes local resolver results only, not static or inherited data.
+ * params/search/data/title Signals and destination-typed link/navigate methods.
+ * Data holds the resolver results of this route and its ancestors, a nearer
+ * key hiding an ancestor's; native static data and the title stay out. Title
+ * is the nearest declared title in the chain, or undefined when none declares one.
  * All navigation values are explicit; current inputs are never reused implicitly.
  *
  * @returns A noncallable handle for this declaration.

package/snippets/src/routes/teams/$teamId/items/$id/inputs.ts

@@ -10,6 +10,7 @@ export function readInputs() {
 
   route.params(); // { teamId: number; id: number }
   route.search(); // { score?: number }
-  route.data(); // { item: Item }, local resolver results only
+  route.data(); // { team: { id: number; name: string }; item: Item }, ancestors' resolver results too
+  route.title(); // string: this route's title, or the nearest ancestor's
 }
 // #endregion inputs

package/snippets/src/routes/teams/$teamId/items/$id/links.ts

@@ -6,8 +6,10 @@ export function itemLinks() {
   const route = injectRoute();
 
   route.link({ params: { teamId: 7, id: 8 } }); // this route
-  route.link(".", { params: { teamId: 7, id: 8 } }); // same as above
-  route.link("/teams/$teamId/items/$id", { params: { teamId: 7, id: 9 } }); // absolute
-  route.link("..", { params: { teamId: 7 } }); // parent route
-  void route.navigate(report, { params: { reportId: 42 } }); // another route's destination
+  route.link({ to: "/teams/$teamId/items/$id", params: { teamId: 7, id: 9 } }); // absolute
+  route.link({ to: "..", params: { teamId: 7 } }); // parent route
+  void route.navigate({ to: report, params: { reportId: 42 } }); // another route's destination
+
+  // Angular's navigation behavior options go in the same object, for navigate only.
+  void route.navigate({ params: { teamId: 7, id: 8 }, search: { score: 10 }, replaceUrl: true });
 }

package/snippets/src/routes/teams/$teamId/items/$id/page.spec.ts

@@ -0,0 +1,29 @@
+import { TestBed } from "@angular/core/testing";
+import { provideRouter } from "@angular/router";
+import { RouterTestingHarness } from "@angular/router/testing";
+import { describe, expect, it } from "vitest";
+import { routes } from "../../../../../../generated/routes.generated.js";
+import { ItemCatalog, type Item, type ItemQuery } from "../../../../../catalog.js";
+import ItemPage from "./page.js";
+
+async function stubCatalog(query: ItemQuery): Promise<Item> {
+  return { ...query, name: "Stub item" };
+}
+
+describe("ItemPage", () => {
+  it("renders the item from the route's resolvers", async () => {
+    TestBed.configureTestingModule({
+      providers: [provideRouter(routes), { provide: ItemCatalog, useValue: stubCatalog }],
+    });
+
+    const harness = await RouterTestingHarness.create();
+    const page = await harness.navigateByUrl("/teams/7/items/3?score=5", ItemPage);
+
+    expect(page.route.params()).toEqual({ teamId: 7, id: 3 });
+    expect(page.route.search()).toEqual({ score: 5 });
+    // The parent route's resolver result, merged into this route's data.
+    expect(page.route.data().team).toEqual({ id: 7, name: "Team 7" });
+    expect(page.route.data().item.name).toBe("Stub item");
+    expect(harness.routeNativeElement?.querySelector("h1")?.textContent).toBe("Stub item");
+  });
+});

package/snippets/src/routes/teams/$teamId/items/$id/route.generated.ts

@@ -13,8 +13,10 @@ export const destination: Destination<"src/routes/teams/$teamId/items/$id/route.
  *
  * @remarks
  * Call in an Angular injection context. The handle exposes readonly native
- * params/search/data Signals and destination-typed link/navigate methods.
- * Data includes local resolver results only, not static or inherited data.
+ * params/search/data/title Signals and destination-typed link/navigate methods.
+ * Data holds the resolver results of this route and its ancestors, a nearer
+ * key hiding an ancestor's; native static data and the title stay out. Title
+ * is the nearest declared title in the chain, or undefined when none declares one.
  * All navigation values are explicit; current inputs are never reused implicitly.
  *
  * @returns A noncallable handle for this declaration.

package/snippets/src/routes/teams/$teamId/members/$memberId/route.generated.ts

@@ -13,8 +13,10 @@ export const destination: Destination<"src/routes/teams/$teamId/members/$memberI
  *
  * @remarks
  * Call in an Angular injection context. The handle exposes readonly native
- * params/search/data Signals and destination-typed link/navigate methods.
- * Data includes local resolver results only, not static or inherited data.
+ * params/search/data/title Signals and destination-typed link/navigate methods.
+ * Data holds the resolver results of this route and its ancestors, a nearer
+ * key hiding an ancestor's; native static data and the title stay out. Title
+ * is the nearest declared title in the chain, or undefined when none declares one.
  * All navigation values are explicit; current inputs are never reused implicitly.
  *
  * @returns A noncallable handle for this declaration.

package/snippets/src/routes/teams/$teamId/route.generated.ts

@@ -13,8 +13,10 @@ export const destination: Destination<"src/routes/teams/$teamId/route.ts"> = /*
  *
  * @remarks
  * Call in an Angular injection context. The handle exposes readonly native
- * params/search/data Signals and destination-typed link/navigate methods.
- * Data includes local resolver results only, not static or inherited data.
+ * params/search/data/title Signals and destination-typed link/navigate methods.
+ * Data holds the resolver results of this route and its ancestors, a nearer
+ * key hiding an ancestor's; native static data and the title stay out. Title
+ * is the nearest declared title in the chain, or undefined when none declares one.
  * All navigation values are explicit; current inputs are never reused implicitly.
  *
  * @returns A noncallable handle for this declaration.

package/snippets/src/routes/teams/$teamId/route.ts

@@ -3,4 +3,7 @@ import { defineRoute, numberParam } from "@loozo/angular-router";
 export default defineRoute("teams/$teamId", {
   params: { teamId: numberParam },
   search: { score: numberParam },
+  resolve: {
+    team: ({ params }) => ({ id: params.teamId, name: `Team ${params.teamId}` }),
+  },
 });

package/snippets/src/shell.ts

@@ -1,9 +1,45 @@
-import { Component } from "@angular/core";
+import { Component, computed } from "@angular/core";
 import { RouterOutlet } from "@angular/router";
+import { injectActiveRoute } from "../generated/destinations.generated.js";
+import { destination as team } from "./routes/teams/$teamId/route.generated.js";
+import { destination as item } from "./routes/teams/$teamId/items/$id/route.generated.js";
 
 @Component({
   selector: "app-shell",
   imports: [RouterOutlet],
-  template: "<router-outlet />",
+  template: `
+    @if (teamId() !== undefined) {
+      <nav>Team {{ teamId() }} <button (click)="next()">Next item</button></nav>
+    }
+    <router-outlet />
+  `,
 })
-export default class Shell {}
+export default class Shell {
+  // The deepest active route, or undefined before the first navigation.
+  readonly active = injectActiveRoute();
+
+  // An ancestor's params: number | undefined.
+  readonly teamId = computed(
+    () =>
+      this.active()
+        ?.chain.find((route) => route.is(team))
+        ?.params().teamId,
+  );
+
+  // Before narrowing, params, search and data read as a union over every route.
+  readonly params = computed(() => this.active()?.params());
+
+  // Whether this route or one of its ancestors is the team route.
+  readonly inTeam = computed(() => this.active()?.contains(team) ?? false);
+
+  next() {
+    const route = this.active();
+
+    // is() narrows to the item's handle, so link and navigate are typed for it.
+    if (route?.is(item)) {
+      const { teamId, id } = route.params();
+
+      void route.navigate({ params: { teamId, id: id + 1 }, replaceUrl: true });
+    }
+  }
+}