@sigx/lynx-navigation 0.2.0 → 0.4.0

package/dist/internal/screen-width.d.ts

@@ -1,16 +1,18 @@
 /**
- * Logical screen width (in dp) read from `lynx.SystemInfo` at module load.
- * Falls back to 400 (typical phone) if SystemInfo isn't available — module
- * load happens BG-side after the bundle initializes, by which time
- * `lynx.SystemInfo` is populated, so the fallback only fires in tests / SSR /
- * non-Lynx hosts.
+ * Logical screen dimensions (in dp) read from `lynx.SystemInfo` at module
+ * load. Falls back to typical phone values if SystemInfo isn't available —
+ * module load happens BG-side after the bundle initializes, by which time
+ * `lynx.SystemInfo` is populated, so the fallback only fires in tests /
+ * SSR / non-Lynx hosts.
  *
  * Used by:
- *   - `<ScreenContainer>` for the slide-from-right transform output range.
+ *   - `<ScreenContainer>` for the slide-from-right (translateX) and
+ *     slide-from-bottom (translateY, modal) transform output ranges.
  *   - `<EdgeBackHandle>` for the gesture commit threshold (`dx / width`).
  *
  * Both must agree, otherwise the commit threshold and the animation
- * geometry won't line up. Single shared constant avoids drift.
+ * geometry won't line up. Single shared module avoids drift.
  */
 export declare const SCREEN_WIDTH: number;
+export declare const SCREEN_HEIGHT: number;
 //# sourceMappingURL=screen-width.d.ts.map

package/dist/internal/screen-width.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen-width.d.ts","sourceRoot":"","sources":["../../src/internal/screen-width.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAoBH,eAAO,MAAM,YAAY,QAAoB,CAAC"}
+{"version":3,"file":"screen-width.d.ts","sourceRoot":"","sources":["../../src/internal/screen-width.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AA0BH,eAAO,MAAM,YAAY,QAA4B,CAAC;AACtD,eAAO,MAAM,aAAa,QAA6B,CAAC"}

package/dist/navigator/core.d.ts

@@ -1,7 +1,7 @@
 import { type SharedValue } from '@sigx/lynx';
-import type { Nav } from '../hooks/use-nav.js';
-import type { ScreenRegistry } from '../internal/screen-registry.js';
-import type { RouteMap, StackEntry } from '../types.js';
+import type { Nav } from '../hooks/use-nav';
+import type { ScreenRegistry } from '../internal/screen-registry';
+import type { RouteMap, StackEntry } from '../types';
 /**
  * The reactive backing state for one navigator instance.
  *
@@ -45,7 +45,8 @@ export interface NavigatorState {
      */
     readonly _screens: {
         register(registry: ScreenRegistry): void;
-        unregister(entryKey: string): void;
+        /** Identity-checked: no-op when a newer registry has taken the slot. */
+        unregister(registry: ScreenRegistry): void;
         get(entryKey: string): ScreenRegistry | undefined;
     };
     /**

package/dist/navigator/core.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../src/navigator/core.ts"],"names":[],"mappings":"AAAA,OAAO,EAKH,KAAK,WAAW,EACnB,MAAM,YAAY,CAAC;AAGpB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,KAAK,EAIR,QAAQ,EACR,UAAU,EAEb,MAAM,aAAa,CAAC;AAErB;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,cAAc;IAC3B,QAAQ,CAAC,GAAG,EAAE,GAAG,CAAC;IAClB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC;IAC1B;;;;;;OAMG;IACH,QAAQ,CAAC,QAAQ,EAAE;QACf,gBAAgB,IAAI,IAAI,CAAC;QACzB,iBAAiB,IAAI,IAAI,CAAC;QAC1B,iBAAiB,IAAI,IAAI,CAAC;KAC7B,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,QAAQ,EAAE;QACf,QAAQ,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;QACzC,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;QACnC,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,cAAc,GAAG,SAAS,CAAC;KACrD,CAAC;IACF;;;;;;OAMG;IACH,QAAQ,CAAC,kBAAkB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC3D;AAuED,MAAM,WAAW,sBAAsB;IACnC,MAAM,EAAE,QAAQ,CAAC;IACjB,OAAO,EAAE,UAAU,CAAC;IACpB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACpB;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACnC;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,sBAAsB,GAAG,cAAc,CA0TjF"}
+{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../src/navigator/core.ts"],"names":[],"mappings":"AAAA,OAAO,EAKH,KAAK,WAAW,EACnB,MAAM,YAAY,CAAC;AAGpB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,KAAK,EAIR,QAAQ,EACR,UAAU,EAEb,MAAM,UAAU,CAAC;AAElB;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,cAAc;IAC3B,QAAQ,CAAC,GAAG,EAAE,GAAG,CAAC;IAClB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC;IAC1B;;;;;;OAMG;IACH,QAAQ,CAAC,QAAQ,EAAE;QACf,gBAAgB,IAAI,IAAI,CAAC;QACzB,iBAAiB,IAAI,IAAI,CAAC;QAC1B,iBAAiB,IAAI,IAAI,CAAC;KAC7B,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,QAAQ,EAAE;QACf,QAAQ,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;QACzC,wEAAwE;QACxE,UAAU,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;QAC3C,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,cAAc,GAAG,SAAS,CAAC;KACrD,CAAC;IACF;;;;;;OAMG;IACH,QAAQ,CAAC,kBAAkB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC3D;AAuED,MAAM,WAAW,sBAAsB;IACnC,MAAM,EAAE,QAAQ,CAAC;IACjB,OAAO,EAAE,UAAU,CAAC;IACpB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACpB;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACnC;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,sBAAsB,GAAG,cAAc,CA0TjF"}

package/dist/register.d.ts

@@ -1,4 +1,4 @@
-import type { ParamsOf, RouteMap, SearchOf } from './types.js';
+import type { ParamsOf, RouteMap, SearchOf } from './types';
 /**
  * Module-augmentation surface for the user's typed route map.
  *

package/dist/register.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"register.d.ts","sourceRoot":"","sources":["../src/register.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE/D;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,WAAW,QAAQ;CAExB;AAED;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,QAAQ,SAAS;IAAE,MAAM,EAAE,MAAM,CAAC,CAAA;CAAE,GAAG,CAAC,GAAG,QAAQ,CAAC;AAEnF,8EAA8E;AAC9E,MAAM,MAAM,OAAO,GAAG,MAAM,gBAAgB,GAAG,MAAM,CAAC;AAEtD,+CAA+C;AAC/C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,OAAO,IAAI,QAAQ,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;AAE3E,+CAA+C;AAC/C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,OAAO,IAAI,QAAQ,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"register.d.ts","sourceRoot":"","sources":["../src/register.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,WAAW,QAAQ;CAExB;AAED;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,QAAQ,SAAS;IAAE,MAAM,EAAE,MAAM,CAAC,CAAA;CAAE,GAAG,CAAC,GAAG,QAAQ,CAAC;AAEnF,8EAA8E;AAC9E,MAAM,MAAM,OAAO,GAAG,MAAM,gBAAgB,GAAG,MAAM,CAAC;AAEtD,+CAA+C;AAC/C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,OAAO,IAAI,QAAQ,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;AAE3E,+CAA+C;AAC/C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,OAAO,IAAI,QAAQ,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC"}

package/dist/url/index.d.ts

@@ -4,10 +4,10 @@
  * Not re-exported from the package root. Public surface is `hrefFor` /
  * `parseHref` in ../href.ts plus `_setRouteRegistry` for tests/bootstrap.
  */
-export { compilePath, type CompiledPath } from './compile.js';
-export { buildUrl } from './build.js';
-export { parseHrefImpl } from './parse.js';
-export { formatSearch, parseSearch } from './format.js';
-export { _setRouteRegistry, _clearRouteRegistry, getRouteRegistry, getCompiledPath, } from './registry.js';
-export { validateSync, type ValidateOutcome } from './validate.js';
+export { compilePath, type CompiledPath } from './compile';
+export { buildUrl } from './build';
+export { parseHrefImpl } from './parse';
+export { formatSearch, parseSearch } from './format';
+export { _setRouteRegistry, _clearRouteRegistry, getRouteRegistry, getCompiledPath, } from './registry';
+export { validateSync, type ValidateOutcome } from './validate';
 //# sourceMappingURL=index.d.ts.map

package/dist/url/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/url/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EACH,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/url/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACrD,OAAO,EACH,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,GAClB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,YAAY,EAAE,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC"}

package/dist/url/parse.d.ts

@@ -9,7 +9,7 @@
  * Validation failures return `null` rather than throwing — deep-link handlers
  * fall back to the initial route on a bad URL instead of crashing the app.
  */
-import type { Href } from '../href.js';
+import type { Href } from '../href';
 /**
  * Parse a URL string against the active route registry.
  *

package/dist/url/parse.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"parse.d.ts","sourceRoot":"","sources":["../../src/url/parse.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAQvC;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAkCtD"}
+{"version":3,"file":"parse.d.ts","sourceRoot":"","sources":["../../src/url/parse.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAQpC;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAkCtD"}

package/dist/url/registry.d.ts

@@ -11,8 +11,8 @@
  * directly. The leading underscore is a convention: not part of the supported
  * public API (test/integration use only).
  */
-import type { CompiledPath } from './compile.js';
-import type { RouteMap } from '../types.js';
+import type { CompiledPath } from './compile';
+import type { RouteMap } from '../types';
 interface RegistryState {
     readonly routes: RouteMap;
     /** Lazy-compiled paths keyed by route name. */

package/dist/url/registry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/url/registry.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C,UAAU,aAAa;IACnB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC;IAC1B,+CAA+C;IAC/C,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;CAChD;AAID;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,QAAQ,GAAG,IAAI,CAExD;AAED,+EAA+E;AAC/E,wBAAgB,mBAAmB,IAAI,IAAI,CAE1C;AAED,wEAAwE;AACxE,wBAAgB,gBAAgB,IAAI,aAAa,CAOhD;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAU1F"}
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/url/registry.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEzC,UAAU,aAAa;IACnB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC;IAC1B,+CAA+C;IAC/C,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;CAChD;AAID;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,QAAQ,GAAG,IAAI,CAExD;AAED,+EAA+E;AAC/E,wBAAgB,mBAAmB,IAAI,IAAI,CAE1C;AAED,wEAAwE;AACxE,wBAAgB,gBAAgB,IAAI,aAAa,CAOhD;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAU1F"}

package/dist/url/validate.d.ts

@@ -5,7 +5,7 @@
  * resolution) so we restrict to sync validators. Zod/Valibot/ArkType are all
  * sync, which covers the common case. Async validators throw a clear error.
  */
-import type { StandardSchemaV1 } from '../types.js';
+import type { StandardSchemaV1 } from '../types';
 /** Outcome of a sync validation call — discriminated for explicit handling. */
 export type ValidateOutcome = {
     readonly ok: true;

package/dist/url/validate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"validate.d.ts","sourceRoot":"","sources":["../../src/url/validate.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAmBpD,+EAA+E;AAC/E,MAAM,MAAM,eAAe,GACrB;IAAE,QAAQ,CAAC,EAAE,EAAE,IAAI,CAAC;IAAC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;CAAE,GAC9C;IAAE,QAAQ,CAAC,EAAE,EAAE,KAAK,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;CAAE,CAAC;AAErE;;;;;GAKG;AACH,wBAAgB,YAAY,CACxB,MAAM,EAAE,gBAAgB,GAAG,SAAS,EACpC,KAAK,EAAE,OAAO,GACf,eAAe,CAiBjB"}
+{"version":3,"file":"validate.d.ts","sourceRoot":"","sources":["../../src/url/validate.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAmBjD,+EAA+E;AAC/E,MAAM,MAAM,eAAe,GACrB;IAAE,QAAQ,CAAC,EAAE,EAAE,IAAI,CAAC;IAAC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;CAAE,GAC9C;IAAE,QAAQ,CAAC,EAAE,EAAE,KAAK,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;CAAE,CAAC;AAErE;;;;;GAKG;AACH,wBAAgB,YAAY,CACxB,MAAM,EAAE,gBAAgB,GAAG,SAAS,EACpC,KAAK,EAAE,OAAO,GACf,eAAe,CAiBjB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sigx/lynx-navigation",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "Type-first native navigator for sigx-lynx — Stack, Tabs, Drawer, modals, lazy routes, deep links",
   "type": "module",
   "main": "./dist/index.js",
@@ -16,9 +16,9 @@
     "dist"
   ],
   "peerDependencies": {
-    "@sigx/lynx": "^0.1.4",
-    "@sigx/lynx-motion": "^0.1.2",
-    "@sigx/lynx-linking": "^0.1.2"
+    "@sigx/lynx-linking": "^0.4.0",
+    "@sigx/lynx": "^0.4.0",
+    "@sigx/lynx-motion": "^0.4.0"
   },
   "peerDependenciesMeta": {
     "@sigx/lynx-linking": {
@@ -28,10 +28,11 @@
   "devDependencies": {
     "typescript": "^6.0.3",
     "vitest": "^4.1.6",
-    "@sigx/lynx": "^0.1.4",
-    "@sigx/lynx-linking": "^0.1.2",
-    "@sigx/lynx-motion": "^0.1.2",
-    "@sigx/lynx-testing": "^0.2.6"
+    "@sigx/vite": "^0.4.3",
+    "@sigx/lynx": "^0.4.0",
+    "@sigx/lynx-linking": "^0.4.0",
+    "@sigx/lynx-testing": "^0.4.0",
+    "@sigx/lynx-motion": "^0.4.0"
   },
   "keywords": [
     "sigx",
@@ -59,8 +60,8 @@
     "access": "public"
   },
   "scripts": {
-    "build": "tsc",
-    "dev": "tsc --watch",
+    "build": "vite build && tsgo --emitDeclarationOnly",
+    "dev": "vite build --watch",
     "test": "vitest run",
     "test:types": "tsc --noEmit",
     "bench": "vitest bench --run"

package/src/components/Drawer.d.ts

@@ -0,0 +1,55 @@
+/**
+ * `<Drawer>` — minimal off-canvas drawer navigator.
+ *
+ * Usage:
+ *
+ * ```tsx
+ * <NavigationRoot routes={routes}>
+ *   <Drawer slots={{ sidebar: () => <view><text>Menu</text></view> }}>
+ *     <Stack />
+ *   </Drawer>
+ * </NavigationRoot>
+ * ```
+ *
+ * `useDrawer()` from inside any descendant gives `{ isOpen, open(), close(),
+ * toggle() }`. The sidebar is laid out absolutely on the left and is
+ * visible whenever `isOpen` is true.
+ *
+ * Scope: this slice ships the state primitive + the bare-bones layout.
+ * Gesture-driven open (edge swipe from the left) and MTS slide-in are out
+ * of scope — the app shell can wrap its sidebar JSX in its own transition.
+ *
+ * Design note: the sidebar lives in a named slot (`sidebar`) rather than
+ * a render-prop or a `<Drawer.Sidebar>` child. Mixing
+ * "register-yourself-as-a-fill" children with the parent's own visible
+ * layout creates a feedback loop in sigx's reactive scope (the parent's
+ * render reads the fill, child's setup writes it, parent re-renders,
+ * child re-mounts, …). A scoped slot avoids that entirely and keeps the
+ * call site declarative.
+ *
+ * `default` slot is the main content (almost always a `<Stack>`).
+ */
+import { type Define } from '@sigx/lynx';
+/** Reactive controller returned by `useDrawer()`. */
+export interface DrawerNav {
+    /** True when the drawer is currently visible. Reactive. */
+    readonly isOpen: boolean;
+    /** Opens the drawer. */
+    open(): void;
+    /** Closes the drawer. */
+    close(): void;
+    /** Toggles between open and closed. */
+    toggle(): void;
+}
+/**
+ * Access the enclosing Drawer navigator. Throws when called outside
+ * `<Drawer>`.
+ */
+export declare const useDrawer: import("@sigx/runtime-core").InjectableFunction<DrawerNav>;
+type DrawerProps = Define.Prop<'initialOpen', boolean> & Define.Slot<'sidebar'> & Define.Slot<'default'>;
+export declare const Drawer: import("@sigx/runtime-core").ComponentFactory<DrawerProps, void, {
+    sidebar: () => import("@sigx/runtime-core").JSXElement | import("@sigx/runtime-core").JSXElement[] | null;
+} & {
+    default: () => import("@sigx/runtime-core").JSXElement | import("@sigx/runtime-core").JSXElement[] | null;
+}>;
+export {};

package/src/components/EdgeBackHandle.d.ts

@@ -0,0 +1 @@
+export declare const EdgeBackHandle: import("@sigx/runtime-core").ComponentFactory<{}, void, unknown>;

package/src/components/EdgeBackHandle.tsx

@@ -7,8 +7,8 @@ import {
     type MainThread,
 } from '@sigx/lynx';
 import { withTiming } from '@sigx/lynx-motion';
-import { useNavInternals } from '../hooks/use-nav-internal.js';
-import { SCREEN_WIDTH } from '../internal/screen-width.js';
+import { useNavInternals } from '../hooks/use-nav-internal';
+import { SCREEN_WIDTH } from '../internal/screen-width';
 
 /**
  * Edge-pan recognizer for iOS-style swipe-back. Mounts as an absolutely-

package/{dist/components/EntryScope.js → src/components/EntryScope.d.ts}

@@ -1,6 +1,6 @@
-import { component, defineProvide, onUnmounted } from '@sigx/lynx';
-import { useCurrentEntry, useNavInternals, useScreenRegistry } from '../hooks/use-nav-internal.js';
-import { createScreenRegistry } from '../internal/screen-registry.js';
+import { type Define } from '@sigx/lynx';
+import type { StackEntry } from '../types';
+type EntryScopeProps = Define.Prop<'entry', StackEntry, true> & Define.Slot<'default'>;
 /**
  * Provider wrapper for a single screen mount.
  *
@@ -19,15 +19,7 @@ import { createScreenRegistry } from '../internal/screen-registry.js';
  * Renders the default slot directly; no extra layout element is inserted,
  * so this is layout-neutral for the screen it wraps.
  */
-export const EntryScope = component(({ props, slots }) => {
-    const internals = useNavInternals();
-    const registry = createScreenRegistry(props.entry);
-    internals.screens.register(registry);
-    onUnmounted(() => {
-        internals.screens.unregister(props.entry.key);
-    });
-    defineProvide(useCurrentEntry, () => props.entry);
-    defineProvide(useScreenRegistry, () => registry);
-    return () => slots.default?.();
-});
-//# sourceMappingURL=EntryScope.js.map
+export declare const EntryScope: import("@sigx/runtime-core").ComponentFactory<EntryScopeProps, void, {
+    default: () => import("@sigx/runtime-core").JSXElement | import("@sigx/runtime-core").JSXElement[] | null;
+}>;
+export {};

package/src/components/EntryScope.tsx

@@ -1,7 +1,12 @@
 import { component, defineProvide, onUnmounted, type Define } from '@sigx/lynx';
-import { useCurrentEntry, useNavInternals, useScreenRegistry } from '../hooks/use-nav-internal.js';
-import { createScreenRegistry } from '../internal/screen-registry.js';
-import type { StackEntry } from '../types.js';
+import {
+    useCurrentEntry,
+    useCurrentEntryOptional,
+    useNavInternals,
+    useScreenRegistry,
+} from '../hooks/use-nav-internal';
+import { createScreenRegistry } from '../internal/screen-registry';
+import type { StackEntry } from '../types';
 
 type EntryScopeProps =
     & Define.Prop<'entry', StackEntry, true>
@@ -30,9 +35,15 @@ export const EntryScope = component<EntryScopeProps>(({ props, slots }) => {
     const registry = createScreenRegistry(props.entry);
     internals.screens.register(registry);
     onUnmounted(() => {
-        internals.screens.unregister(props.entry.key);
+        // Pass the registry instance — `unregister` is identity-checked,
+        // so this is a no-op when a newer EntryScope has already taken
+        // over the same entry key (e.g. at the transition→idle handoff
+        // where the reconciler mounts the new EntryScope before
+        // unmounting the old).
+        internals.screens.unregister(registry);
     });
     defineProvide(useCurrentEntry, () => props.entry);
+    defineProvide(useCurrentEntryOptional, () => props.entry);
     defineProvide(useScreenRegistry, () => registry);
     return () => slots.default?.();
 });

package/src/components/Header.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Persistent header chrome. Mount once above `<Stack>`; reactively follows
+ * the focused entry. No props in v1 — styling is a host-app concern,
+ * arrived at through the slot fills.
+ */
+export declare const Header: import("@sigx/runtime-core").ComponentFactory<{}, void, unknown>;

package/src/components/Header.tsx

@@ -20,9 +20,9 @@
  *   - making it opt-in keeps `<Stack>`'s contract narrow.
  */
 import { component, computed } from '@sigx/lynx';
-import { useNav } from '../hooks/use-nav.js';
-import { useNavInternals } from '../hooks/use-nav-internal.js';
-import type { ScreenOptions, ScreenSlotFills, StackEntry } from '../types.js';
+import { useNav } from '../hooks/use-nav';
+import { useNavInternals } from '../hooks/use-nav-internal';
+import type { ScreenOptions, ScreenSlotFills, StackEntry } from '../types';
 
 /**
  * Resolve a title (string or getter) to a plain string.

package/src/components/Layer.d.ts

@@ -0,0 +1,33 @@
+/**
+ * `<Layer>` — one row in `<Stack>`'s layered render. Absolutely-
+ * positioned host view that fills the Stack's relative wrapper, with
+ * an optional MT-bound `translateX` / `translateY` animation driven
+ * by a `SharedValue<number>` from the navigator's transition state.
+ *
+ * `<Stack>` emits one `<Layer>` per entry returned by
+ * `computeLayers(...)`. Layer.key in the parent is
+ * `layer-${entry.key}-${animationVariant(animation)}` so that:
+ *
+ *  - The same entry under the same animation state is preserved across
+ *    renders (modal underneath stays mounted through the modal
+ *    lifecycle; per-tab Stack state survives).
+ *  - An entry transitioning between animated and static (e.g. a card
+ *    top after its push transition completes) remounts so the
+ *    `useAnimatedStyle` binding can be rebound — the underlying
+ *    `useAnimatedStyle` is set-once at setup and can't switch its
+ *    mapper at runtime.
+ *
+ * Layouts:
+ *  - Host view is `position: absolute; top/right/bottom/left: 0;
+ *    display: flex; flexDirection: column` so descendants that
+ *    flex-fill (SafeAreaView, daisyui screens) get a sized parent.
+ *  - No background. Screens own their own surface colour (typically
+ *    via a daisy `bg-base-*` class on the screen body).
+ */
+import { type ComponentFactory, type Define } from '@sigx/lynx';
+import type { LayerAnimation } from '../internal/layer-plan';
+import type { RouteMap, StackEntry } from '../types';
+export type LayerProps = Define.Prop<'entry', StackEntry, true> & Define.Prop<'routes', RouteMap, true>
+/** When set, the host view animates per the transform spec. */
+ & Define.Prop<'animation', LayerAnimation | null, false>;
+export declare const Layer: ComponentFactory<LayerProps, void, {}>;

package/src/components/Layer.tsx

@@ -0,0 +1,96 @@
+/**
+ * `<Layer>` — one row in `<Stack>`'s layered render. Absolutely-
+ * positioned host view that fills the Stack's relative wrapper, with
+ * an optional MT-bound `translateX` / `translateY` animation driven
+ * by a `SharedValue<number>` from the navigator's transition state.
+ *
+ * `<Stack>` emits one `<Layer>` per entry returned by
+ * `computeLayers(...)`. Layer.key in the parent is
+ * `layer-${entry.key}-${animationVariant(animation)}` so that:
+ *
+ *  - The same entry under the same animation state is preserved across
+ *    renders (modal underneath stays mounted through the modal
+ *    lifecycle; per-tab Stack state survives).
+ *  - An entry transitioning between animated and static (e.g. a card
+ *    top after its push transition completes) remounts so the
+ *    `useAnimatedStyle` binding can be rebound — the underlying
+ *    `useAnimatedStyle` is set-once at setup and can't switch its
+ *    mapper at runtime.
+ *
+ * Layouts:
+ *  - Host view is `position: absolute; top/right/bottom/left: 0;
+ *    display: flex; flexDirection: column` so descendants that
+ *    flex-fill (SafeAreaView, daisyui screens) get a sized parent.
+ *  - No background. Screens own their own surface colour (typically
+ *    via a daisy `bg-base-*` class on the screen body).
+ */
+import {
+    component,
+    useMainThreadRef,
+    useAnimatedStyle,
+    type ComponentFactory,
+    type Define,
+    type MainThread,
+} from '@sigx/lynx';
+import { Suspense, isLazyComponent } from '@sigx/lynx';
+import type { LayerAnimation } from '../internal/layer-plan';
+import type { RouteMap, StackEntry } from '../types';
+import { EntryScope } from './EntryScope';
+
+export type LayerProps =
+    & Define.Prop<'entry', StackEntry, true>
+    & Define.Prop<'routes', RouteMap, true>
+    /** When set, the host view animates per the transform spec. */
+    & Define.Prop<'animation', LayerAnimation | null, false>;
+
+export const Layer = component<LayerProps>(({ props }) => {
+    const ref = useMainThreadRef<MainThread.Element | null>(null);
+    // `useAnimatedStyle` binds once at setup. Calling it conditionally
+    // is safe because setup runs once per mount and props.animation
+    // never changes for a given Layer instance — animation changes
+    // re-key the Layer at the parent, forcing a fresh mount.
+    if (props.animation) {
+        const a = props.animation;
+        useAnimatedStyle(ref, a.progress, a.axis, {
+            inputRange: [a.inputRange[0], a.inputRange[1]],
+            outputRange: [a.outputRange[0], a.outputRange[1]],
+        });
+    }
+
+    return () => {
+        const route = props.routes[props.entry.route];
+        if (!route) return null;
+        const Comp = route.component as unknown as ComponentFactory<
+            Record<string, unknown>,
+            unknown,
+            unknown
+        >;
+        if (typeof Comp !== 'function') return null;
+        const entryParams = props.entry.params as Record<string, unknown>;
+        const body = isLazyComponent(Comp) && route.fallback
+            ? (
+                <Suspense fallback={route.fallback as never}>
+                    <Comp {...entryParams} />
+                </Suspense>
+            )
+            : <Comp {...entryParams} />;
+        return (
+            <view
+                main-thread:ref={ref}
+                style={{
+                    position: 'absolute',
+                    top: '0',
+                    left: '0',
+                    right: '0',
+                    bottom: '0',
+                    display: 'flex',
+                    flexDirection: 'column',
+                }}
+            >
+                <EntryScope key={props.entry.key} entry={props.entry}>
+                    {body}
+                </EntryScope>
+            </view>
+        );
+    };
+});

package/src/components/Link.d.ts

@@ -0,0 +1,60 @@
+import type { RouteId, RouteParams, RouteSearch } from '../register';
+import type { RoutesWithParams } from '../hooks/use-nav';
+/**
+ * Per-route conditional props for `<Link>`.
+ *
+ * Mapped over `RouteId`, then indexed by `RouteId` to flatten into a union.
+ * Each branch enforces the `params`-required-iff-route-has-schema rule:
+ *
+ *   - `<Link to="profile" />`             → TS error (profile requires params)
+ *   - `<Link to="profile" params={...} />` → ok
+ *   - `<Link to="home" />`                → ok (home has no params)
+ *   - `<Link to="home" params={...} />`   → TS error (home accepts no params)
+ *
+ * Same per-route discrimination as `nav.push`, expressed as a JSX-friendly
+ * union rather than overloads.
+ */
+type LinkPropsByRoute = {
+    [K in RouteId]: K extends RoutesWithParams ? {
+        to: K;
+        params: RouteParams<K>;
+        search?: RouteSearch<K>;
+    } : {
+        to: K;
+        params?: undefined;
+        search?: RouteSearch<K>;
+    };
+}[RouteId];
+/**
+ * Public type for `<Link>`'s props. The conditional `LinkPropsByRoute` carries
+ * the typed `to`/`params`/`search` triple; the rest are simple optionals.
+ *
+ * `children` is declared explicitly because the public type is exposed via a
+ * type-cast (so JSX sees a function-shaped signature). The cast strips sigx's
+ * built-in `Define.Slot<'default'>` → JSX-children wiring, so we add a
+ * permissive `children?` slot ourselves.
+ */
+export type LinkProps = LinkPropsByRoute & {
+    /** Use `replace` instead of `push` (no new history entry). */
+    replace?: boolean;
+    /** Link content rendered inside the tappable container. */
+    children?: unknown;
+};
+/**
+ * Declarative navigation. Same typing as `nav.push` — pass `params` only when
+ * the route declares a schema. Wraps a `<view>` that fires `nav.push` (or
+ * `nav.replace` if `replace` is set) on tap.
+ *
+ * @example
+ * ```tsx
+ * <Link to="home">Home</Link>
+ * <Link to="profile" params={{ id: '42' }}>View profile</Link>
+ * <Link to="profile" params={{ id: '42' }} search={{ tab: 'about' }}>About</Link>
+ * <Link to="settings" replace>Settings (no back)</Link>
+ * ```
+ *
+ * The cast widens the inferred prop type from the loose impl to the strict
+ * `LinkProps` so JSX usage gets per-route discrimination. Runtime is identical.
+ */
+export declare const Link: (props: LinkProps) => unknown;
+export {};

package/src/components/Link.tsx

@@ -1,8 +1,8 @@
 import { component, type Define } from '@sigx/lynx';
-import { useNav } from '../hooks/use-nav.js';
-import { useNavRoutes } from '../hooks/use-nav-internal.js';
-import type { RouteId, RouteParams, RouteSearch } from '../register.js';
-import type { RoutesWithParams } from '../hooks/use-nav.js';
+import { useNav } from '../hooks/use-nav';
+import { useNavRoutes } from '../hooks/use-nav-internal';
+import type { RouteId, RouteParams, RouteSearch } from '../register';
+import type { RoutesWithParams } from '../hooks/use-nav';
 
 /**
  * Per-route conditional props for `<Link>`.

package/src/components/NavigationRoot.d.ts

@@ -0,0 +1,36 @@
+import { type Define } from '@sigx/lynx';
+import type { RouteId } from '../register';
+import type { RouteMap } from '../types';
+type NavigationRootProps = Define.Prop<'routes', RouteMap, true> & Define.Prop<'initialRoute', RouteId> & Define.Prop<'initialParams', Record<string, unknown>> & Define.Prop<'initialSearch', Record<string, unknown>>
+/**
+ * Enable slide-from-right transitions on push/pop. Defaults to true.
+ * Tests against `@sigx/lynx-testing` (which doesn't have an MT runtime)
+ * should pass `animated={false}` so navigations commit synchronously.
+ */
+ & Define.Prop<'animated', boolean>
+/**
+ * Enable the iOS-style edge-swipe-back gesture. Defaults to true. Set
+ * to false if it conflicts with screen content on the leftmost 20px,
+ * or while debugging gesture issues.
+ */
+ & Define.Prop<'edgeSwipeEnabled', boolean> & Define.Slot<'default'>;
+/**
+ * Root of a navigator subtree.
+ *
+ * Creates a fresh `NavigatorState` from `routes` and provides it via
+ * `defineProvide`, so descendant `<Stack>` / `<Screen>` components and any
+ * `useNav()` / `useParams()` calls resolve through this instance.
+ *
+ * The bottom-of-stack entry is built from `initialRoute` (defaults to the
+ * first key in `routes`). For routes that declare a params schema, you must
+ * pass `initialParams` matching that schema.
+ *
+ * Mirrors the install pattern of `@sigx/router` (see
+ * `packages/router/src/router.ts:519-528`), but at component scope rather than
+ * `app.use(router)` — no app-wide singleton, so multi-navigator apps and
+ * tests get isolated state for free.
+ */
+export declare const NavigationRoot: import("@sigx/runtime-core").ComponentFactory<NavigationRootProps, void, {
+    default: () => import("@sigx/runtime-core").JSXElement | import("@sigx/runtime-core").JSXElement[] | null;
+}>;
+export {};

package/src/components/NavigationRoot.tsx

@@ -1,10 +1,10 @@
 import { component, defineProvide, useSharedValue, type Define } from '@sigx/lynx';
-import { createNavigatorState } from '../navigator/core.js';
-import { useNav } from '../hooks/use-nav.js';
-import { useNavInternals, useNavRoutes } from '../hooks/use-nav-internal.js';
-import type { RouteId } from '../register.js';
-import type { Presentation, RouteMap, StackEntry } from '../types.js';
-import { _setRouteRegistry } from '../url/registry.js';
+import { createNavigatorState } from '../navigator/core';
+import { useNav } from '../hooks/use-nav';
+import { useNavInternals, useNavRoutes } from '../hooks/use-nav-internal';
+import type { RouteId } from '../register';
+import type { Presentation, RouteMap, StackEntry } from '../types';
+import { _setRouteRegistry } from '../url/registry';
 
 type NavigationRootProps =
     & Define.Prop<'routes', RouteMap, true>