@tinyfx/runtime 0.1.9 → 0.2.1

package/README.md

@@ -1,15 +1,20 @@
 # @tinyfx/runtime
 
-The TinyFX browser runtime: signals, DOM helpers, typed HTTP, and router lifecycle utilities.
+The TinyFX browser runtime: signals, DOM helpers, typed HTTP, router lifecycle utilities, and dynamic registration APIs.
 
 ## Features
 
 - Signals (`signal`, `effect`)
 - DOM binding helpers (`bindText`, `bindAttr`, `bindClass`)
-- Typed HTTP client (`createHttp`)
-- Router helpers (`initRouter`, `navigate`, `goBack`, `getParam`)
+- Typed HTTP client (`createHttp`) with discriminated error types
+- Router helpers (`getParam`, `getParams`, `navigate`, `goBack`)
 - Lifecycle hooks (`onMount`, `onDestroy`)
 - Lightweight `TinyFxContext` (`params`, `navigate`)
+- Dynamic component registration (`registerComponent`, `getComponentFactory`, `mountComponents`)
+- Dynamic page registration (`registerPage`, `getPageModule`, `runPageInit`)
+- Mount state tracking (`markMounted`, `isMounted`)
+- Path matching (`matchPath`, `splitPath`, `RouteDef`)
+- Unified initialization (`init`)
 
 ## Installation
 
@@ -33,7 +38,7 @@ effect(() => {
 count.set(count() + 1);
 ```
 
-### DOM bindings
+### DOM Bindings
 
 ```ts
 import { signal, bindText, bindClass, bindAttr } from "@tinyfx/runtime";
@@ -46,12 +51,12 @@ const btn = document.querySelector("button");
 
 if (el && btn) {
   bindText(el, () => `Count: ${count()}`);
-  bindClass(btn, "active", isActive);
+  bindClass(btn, "active", () => isActive());
   bindAttr(btn, "disabled", () => count() > 10);
 }
 ```
 
-### HTTP client
+### HTTP Client
 
 ```ts
 import { createHttp } from "@tinyfx/runtime";
@@ -65,20 +70,16 @@ const users = await http.get<{ id: number; name: string }[]>("/users");
 ```ts
 import type { TinyFxContext } from "@tinyfx/runtime";
 
-export function init(el: HTMLElement, ctx: TinyFxContext) {
+export function init(_el: HTMLElement, ctx: TinyFxContext) {
   console.log(ctx.params);
   ctx.navigate("/about");
 }
 ```
 
-### Router + lifecycle hooks
+### Router + Lifecycle Hooks
 
 ```ts
-import { initRouter, onMount, onDestroy } from "@tinyfx/runtime";
-
-initRouter({
-  "/": { page: "index", path: "/" },
-});
+import { onMount, onDestroy } from "@tinyfx/runtime";
 
 onMount(() => {
   console.log("mounted");
@@ -89,21 +90,66 @@ onDestroy(() => {
 });
 ```
 
-## API overview
-
-- `signal<T>(value: T)`
-- `effect(fn)`
-- `bindText(el, source)`
-- `bindAttr(el, attr, source)`
-- `bindClass(el, className, source)`
-- `createHttp(config?)`
-- `initRouter(routes)`
-- `getParam(name)`
-- `navigate(path)`
-- `goBack()`
-- `onMount(fn)`
-- `onDestroy(fn)`
-- `TinyFxContext`
+### Component Registration
+
+```ts
+import { registerComponent } from "@tinyfx/runtime";
+
+registerComponent("MyButton", (el, ctx) => {
+  el.addEventListener("click", () => console.log("clicked"));
+  return { el };
+});
+```
+
+### Page Registration
+
+```ts
+import { registerPage } from "@tinyfx/runtime";
+
+registerPage("/", {
+  init(_el, _ctx) {
+    console.log("home page loaded");
+  },
+});
+```
+
+### Initialization
+
+The compiler-generated `tinyfx.gen.ts` calls `init()` automatically. You typically do not need to call it yourself.
+
+```ts
+import { init } from "@tinyfx/runtime";
+
+init({ routes, setupDirectives });
+```
+
+## API Overview
+
+- `signal<T>(value: T)` — creates a reactive signal
+- `effect(fn)` — registers a reactive effect
+- `bindText(el, source)` — binds text content reactively
+- `bindAttr(el, attr, source)` — binds an attribute reactively
+- `bindClass(el, className, source)` — binds a class toggle reactively
+- `createHttp(config?)` — creates a typed HTTP client
+- `getParam(name)` — gets a single route parameter
+- `getParams()` — gets all route parameters
+- `navigate(path)` — triggers full browser navigation
+- `goBack()` — goes back in browser history
+- `onMount(fn)` — registers a mount callback
+- `onDestroy(fn)` — registers a destroy callback
+- `registerComponent(name, factory)` — registers a dynamic component
+- `getComponentFactory(name)` — retrieves a registered component factory
+- `mountComponents(ctx, root?)` — mounts all components in a root element
+- `registerPage(route, module)` — registers a page module
+- `getPageModule(route)` — retrieves a registered page module
+- `runPageInit(route, ctx)` — runs page init if registered
+- `markMounted(el)` — marks an element as mounted (returns true on first call)
+- `isMounted(el)` — checks if an element has been mounted
+- `matchPath(def, segments)` — matches a RouteDef against path segments
+- `splitPath(pathname)` — splits a pathname into segments
+- `init(config)` — unified bootstrap entry point
+- `TinyFxContext` — type for page/component context
+- `RouteMap`, `RouteMeta`, `RouteDef` — routing types
 
 ## License
 

package/dist/__tests__/http-errors.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/__tests__/http-errors.test.js

@@ -0,0 +1,65 @@
+import { describe, it, expect } from "vitest";
+import { httpError, timeoutError, parseError } from "../http/data";
+describe("httpError", () => {
+    it("creates http error with all fields", () => {
+        const err = httpError(404, "Not Found", "/api/test", "GET");
+        expect(err.kind).toBe("http");
+        if (err.kind === "http") {
+            expect(err.status).toBe(404);
+            expect(err.statusText).toBe("Not Found");
+            expect(err.url).toBe("/api/test");
+            expect(err.method).toBe("GET");
+        }
+    });
+    it("includes optional response", () => {
+        const response = new Response();
+        const err = httpError(500, "Server Error", "/api", "POST", response);
+        if (err.kind === "http") {
+            expect(err.response).toBe(response);
+        }
+    });
+});
+describe("timeoutError", () => {
+    it("creates timeout error with url and timeout", () => {
+        const err = timeoutError("/api/slow", 5000);
+        expect(err.kind).toBe("timeout");
+        if (err.kind === "timeout") {
+            expect(err.url).toBe("/api/slow");
+            expect(err.timeout).toBe(5000);
+        }
+    });
+});
+describe("parseError", () => {
+    it("creates parse error with message and url", () => {
+        const err = parseError("Unexpected token", "/api/json");
+        expect(err.kind).toBe("parse");
+        if (err.kind === "parse") {
+            expect(err.message).toBe("Unexpected token");
+            expect(err.url).toBe("/api/json");
+        }
+    });
+});
+describe("error discrimination", () => {
+    it("allows discriminating by kind", () => {
+        const errors = [
+            httpError(400, "Bad Request", "/a", "GET"),
+            timeoutError("/b", 1000),
+            parseError("Bad JSON", "/c"),
+        ];
+        const httpErr = errors.find((e) => e.kind === "http");
+        expect(httpErr === null || httpErr === void 0 ? void 0 : httpErr.kind).toBe("http");
+        if ((httpErr === null || httpErr === void 0 ? void 0 : httpErr.kind) === "http") {
+            expect(httpErr.status).toBe(400);
+        }
+        const timeoutErr = errors.find((e) => e.kind === "timeout");
+        expect(timeoutErr === null || timeoutErr === void 0 ? void 0 : timeoutErr.kind).toBe("timeout");
+        if ((timeoutErr === null || timeoutErr === void 0 ? void 0 : timeoutErr.kind) === "timeout") {
+            expect(timeoutErr.timeout).toBe(1000);
+        }
+        const parseErr = errors.find((e) => e.kind === "parse");
+        expect(parseErr === null || parseErr === void 0 ? void 0 : parseErr.kind).toBe("parse");
+        if ((parseErr === null || parseErr === void 0 ? void 0 : parseErr.kind) === "parse") {
+            expect(parseErr.message).toBe("Bad JSON");
+        }
+    });
+});

package/dist/__tests__/router-merged.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/__tests__/router-merged.test.js

@@ -0,0 +1,33 @@
+import { describe, it, expect, vi } from "vitest";
+import { navigate, goBack } from "../router/index";
+describe("navigate", () => {
+    it("is a function that accepts a path string", () => {
+        expect(typeof navigate).toBe("function");
+        expect(() => navigate("/test/path")).not.toThrow();
+    });
+});
+describe("goBack", () => {
+    it("calls history.go(-1)", () => {
+        const spy = vi.spyOn(window.history, "go");
+        goBack();
+        expect(spy).toHaveBeenCalledWith(-1);
+        spy.mockRestore();
+    });
+});
+describe("RouteMeta type", () => {
+    it("accepts valid route metadata", () => {
+        const meta = { page: "blog-post", path: "/blog/:slug" };
+        expect(meta.page).toBe("blog-post");
+        expect(meta.path).toBe("/blog/:slug");
+    });
+});
+describe("RouteMap type", () => {
+    it("accepts route map object", () => {
+        const routes = {
+            "/": { page: "index", path: "/" },
+            "/blog/:slug": { page: "blog-post", path: "/blog/:slug" },
+        };
+        expect(Object.keys(routes)).toHaveLength(2);
+        expect(routes["/blog/:slug"].page).toBe("blog-post");
+    });
+});

package/dist/__tests__/signals.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/__tests__/signals.test.js

@@ -0,0 +1,93 @@
+import { describe, it, expect } from "vitest";
+import { signal, effect } from "../signals";
+describe("signal (inlined)", () => {
+    it("returns current value when called", () => {
+        const count = signal(0);
+        expect(count()).toBe(0);
+    });
+    it("updates value via set()", () => {
+        const count = signal(0);
+        count.set(5);
+        expect(count()).toBe(5);
+    });
+    it("does not notify subscribers when value is the same", () => {
+        const count = signal(0);
+        let runs = 0;
+        effect(() => {
+            count();
+            runs++;
+        });
+        expect(runs).toBe(1);
+        count.set(0);
+        expect(runs).toBe(1);
+    });
+    it("notifies subscribers on change", () => {
+        const count = signal(0);
+        let value = 0;
+        effect(() => {
+            value = count();
+        });
+        expect(value).toBe(0);
+        count.set(10);
+        expect(value).toBe(10);
+    });
+    it("supports multiple subscribers", () => {
+        const count = signal(0);
+        let a = 0;
+        let b = 0;
+        effect(() => { a = count(); });
+        effect(() => { b = count() * 2; });
+        count.set(3);
+        expect(a).toBe(3);
+        expect(b).toBe(6);
+    });
+    it("works with objects", () => {
+        const user = signal({ name: "Alice" });
+        expect(user().name).toBe("Alice");
+        user.set({ name: "Bob" });
+        expect(user().name).toBe("Bob");
+    });
+    it("does not re-run effect when unrelated signal changes", () => {
+        const a = signal(0);
+        const b = signal(0);
+        let runs = 0;
+        effect(() => {
+            a();
+            runs++;
+        });
+        expect(runs).toBe(1);
+        b.set(1);
+        expect(runs).toBe(1);
+    });
+});
+describe("effect", () => {
+    it("runs immediately on creation", () => {
+        let ran = false;
+        effect(() => { ran = true; });
+        expect(ran).toBe(true);
+    });
+    it("re-runs when tracked signal changes", () => {
+        const count = signal(0);
+        let runs = 0;
+        effect(() => {
+            count();
+            runs++;
+        });
+        expect(runs).toBe(1);
+        count.set(1);
+        expect(runs).toBe(2);
+    });
+    it("supports nested signal reads", () => {
+        const a = signal(1);
+        const b = signal(2);
+        let sum = 0;
+        effect(() => {
+            sum = a() + b();
+        });
+        expect(sum).toBe(3);
+        a.set(10);
+        expect(sum).toBe(12);
+        b.set(5);
+        expect(sum).toBe(15);
+    });
+});

package/dist/http/data.d.ts

@@ -1,56 +1,47 @@
 /**
- * Error thrown for non-success HTTP responses.
+ * Discriminated union type for HTTP errors.
  *
  * @example
  * try {
  *   await http.get("/posts");
  * } catch (error) {
- *   if (error instanceof HttpError) {
+ *   if (error.kind === "http") {
  *     console.error(error.status, error.url);
- *   }
- * }
- */
-export declare class HttpError extends Error {
-    readonly status: number;
-    readonly statusText: string;
-    readonly url: string;
-    readonly method: string;
-    readonly response?: Response | undefined;
-    constructor(status: number, statusText: string, url: string, method: string, response?: Response | undefined);
-}
-/**
- * Error thrown when a request times out.
- *
- * @example
- * try {
- *   await http.get("/slow", { timeout: 100 });
- * } catch (error) {
- *   if (error instanceof HttpTimeoutError) {
+ *   } else if (error.kind === "timeout") {
  *     console.error(error.timeout);
- *   }
- * }
- */
-export declare class HttpTimeoutError extends Error {
-    readonly url: string;
-    readonly timeout: number;
-    constructor(url: string, timeout: number);
-}
-/**
- * Error thrown when a JSON response cannot be parsed.
- *
- * @example
- * try {
- *   await http.get("/broken-json");
- * } catch (error) {
- *   if (error instanceof HttpParseError) {
+ *   } else if (error.kind === "parse") {
  *     console.error(error.url);
  *   }
  * }
  */
-export declare class HttpParseError extends Error {
-    readonly url: string;
-    constructor(message: string, url: string);
-}
+export type HttpError = {
+    kind: "http";
+    status: number;
+    statusText: string;
+    url: string;
+    method: string;
+    response?: Response;
+} | {
+    kind: "timeout";
+    url: string;
+    timeout: number;
+} | {
+    kind: "parse";
+    message: string;
+    url: string;
+};
+export declare function httpError(status: number, statusText: string, url: string, method: string, response?: Response): HttpError;
+export declare function timeoutError(url: string, timeout: number): HttpError;
+export declare function parseError(message: string, url: string): HttpError;
+export declare function isHttpError(err: unknown): err is Extract<HttpError, {
+    kind: "http";
+}>;
+export declare function isTimeoutError(err: unknown): err is Extract<HttpError, {
+    kind: "timeout";
+}>;
+export declare function isParseError(err: unknown): err is Extract<HttpError, {
+    kind: "parse";
+}>;
 /**
  * Hook that can rewrite an outgoing request before `fetch` runs.
  *
@@ -117,4 +108,5 @@ export interface RequestOptions {
     timeout?: number;
     signal?: AbortSignal;
     params?: Record<string, string | number | boolean>;
+    json?: boolean;
 }

package/dist/http/data.js

@@ -1,62 +1,18 @@
-/**
- * Error thrown for non-success HTTP responses.
- *
- * @example
- * try {
- *   await http.get("/posts");
- * } catch (error) {
- *   if (error instanceof HttpError) {
- *     console.error(error.status, error.url);
- *   }
- * }
- */
-export class HttpError extends Error {
-    constructor(status, statusText, url, method, response) {
-        super(`HTTP ${status} ${statusText}: ${method} ${url}`);
-        this.status = status;
-        this.statusText = statusText;
-        this.url = url;
-        this.method = method;
-        this.response = response;
-        this.name = "HttpError";
-    }
+export function httpError(status, statusText, url, method, response) {
+    return { kind: "http", status, statusText, url, method, response };
 }
-/**
- * Error thrown when a request times out.
- *
- * @example
- * try {
- *   await http.get("/slow", { timeout: 100 });
- * } catch (error) {
- *   if (error instanceof HttpTimeoutError) {
- *     console.error(error.timeout);
- *   }
- * }
- */
-export class HttpTimeoutError extends Error {
-    constructor(url, timeout) {
-        super(`Request timeout after ${timeout}ms: ${url}`);
-        this.url = url;
-        this.timeout = timeout;
-        this.name = "HttpTimeoutError";
-    }
+export function timeoutError(url, timeout) {
+    return { kind: "timeout", url, timeout };
 }
-/**
- * Error thrown when a JSON response cannot be parsed.
- *
- * @example
- * try {
- *   await http.get("/broken-json");
- * } catch (error) {
- *   if (error instanceof HttpParseError) {
- *     console.error(error.url);
- *   }
- * }
- */
-export class HttpParseError extends Error {
-    constructor(message, url) {
-        super(message);
-        this.url = url;
-        this.name = "HttpParseError";
-    }
+export function parseError(message, url) {
+    return { kind: "parse", message, url };
+}
+export function isHttpError(err) {
+    return typeof err === "object" && err !== null && "kind" in err && err.kind === "http";
+}
+export function isTimeoutError(err) {
+    return typeof err === "object" && err !== null && "kind" in err && err.kind === "timeout";
+}
+export function isParseError(err) {
+    return typeof err === "object" && err !== null && "kind" in err && err.kind === "parse";
 }

package/dist/http/http.js

@@ -1,6 +1,6 @@
 // @tinyfx/runtime — HTTP client
 // Thin, typed wrapper over fetch.
-import { HttpError, HttpParseError, HttpTimeoutError } from "./data";
+import { httpError, timeoutError, parseError, isHttpError } from "./data";
 import { buildUrl, sleep } from "./helper";
 /**
  * Creates a typed HTTP client around `fetch`.
@@ -25,22 +25,26 @@ export function createHttp(config = {}) {
     const requestInterceptors = (_f = config.requestInterceptors) !== null && _f !== void 0 ? _f : [];
     const responseInterceptors = (_g = config.responseInterceptors) !== null && _g !== void 0 ? _g : [];
     async function request(method, url, body, options = {}) {
-        var _a, _b;
+        var _a, _b, _c;
         const fullUrl = buildUrl(url, base, options.params);
         const timeoutMs = (_a = options.timeout) !== null && _a !== void 0 ? _a : defaultTimeout;
+        const useJson = (_b = options.json) !== null && _b !== void 0 ? _b : true;
         let attempts = 0;
         const maxAttempts = maxRetries + 1;
         while (attempts < maxAttempts) {
             attempts++;
             try {
                 const headers = Object.assign(Object.assign({}, defaultHeaders), options.headers);
-                if (body !== undefined && !headers["Content-Type"]) {
+                if (body !== undefined && useJson && !headers["Content-Type"]) {
                     headers["Content-Type"] = "application/json";
                 }
+                const serializedBody = body !== undefined
+                    ? (useJson ? JSON.stringify(body) : body)
+                    : undefined;
                 let fetchOptions = {
                     method,
                     headers,
-                    body: body !== undefined ? JSON.stringify(body) : undefined,
+                    body: serializedBody,
                     signal: options.signal,
                 };
                 let requestUrl = fullUrl;
@@ -70,10 +74,10 @@ export function createHttp(config = {}) {
                 catch (err) {
                     clearTimeout(timeoutId);
                     if (err instanceof Error && err.name === "AbortError") {
-                        if ((_b = options.signal) === null || _b === void 0 ? void 0 : _b.aborted) {
+                        if ((_c = options.signal) === null || _c === void 0 ? void 0 : _c.aborted) {
                             throw err; // User cancelled
                         }
-                        throw new HttpTimeoutError(requestUrl, timeoutMs);
+                        throw timeoutError(requestUrl, timeoutMs);
                     }
                     throw err;
                 }
@@ -85,7 +89,7 @@ export function createHttp(config = {}) {
                     res = await interceptor(res);
                 }
                 if (!res.ok) {
-                    throw new HttpError(res.status, res.statusText, requestUrl, method, res);
+                    throw httpError(res.status, res.statusText, requestUrl, method, res);
                 }
                 // Parse response based on content type
                 const contentType = res.headers.get("content-type") || "";
@@ -98,7 +102,7 @@ export function createHttp(config = {}) {
                         return JSON.parse(text);
                     }
                     catch (err) {
-                        throw new HttpParseError(`Failed to parse JSON response: ${err instanceof Error ? err.message : "Unknown error"}`, requestUrl);
+                        throw parseError(`Failed to parse JSON response: ${err instanceof Error ? err.message : "Unknown error"}`, requestUrl);
                     }
                 }
                 if (contentType.includes("text/")) {
@@ -109,14 +113,14 @@ export function createHttp(config = {}) {
                     const text = await res.text();
                     return (text || undefined);
                 }
-                catch (_c) {
+                catch (_d) {
                     return undefined;
                 }
             }
             catch (err) {
                 // Retry logic for network errors or 5xx errors
-                const shouldRetry = attempts < maxAttempts &&
-                    (!(err instanceof HttpError) || (err.status >= 500 && err.status < 600));
+                const is5xx = isHttpError(err) && err.status >= 500 && err.status < 600;
+                const shouldRetry = attempts < maxAttempts && (!isHttpError(err) || is5xx);
                 if (shouldRetry) {
                     await sleep(retryDelay * attempts);
                     continue;

package/dist/index.d.ts

@@ -9,7 +9,7 @@ export { matchPath, splitPath } from "./router/path-matcher";
 export type { RouteDef } from "./router/path-matcher";
 export { init } from "./init";
 export type { InitConfig } from "./init";
-export { initRouter, getParam, navigate, goBack } from "./router/index";
+export { getParam, getParams, navigate, goBack } from "./router/index";
 export { onMount, onDestroy } from "./router/lifecycle";
 export type { TinyFxContext } from "./context";
-export type { RouteMap, RouteMeta } from "./router/types";
+export type { RouteMap, RouteMeta } from "./router/index";

package/dist/index.js

@@ -10,5 +10,5 @@ export { markMounted, isMounted } from "./mount-state";
 export { matchPath, splitPath } from "./router/path-matcher";
 export { init } from "./init";
 // Keep existing router exports
-export { initRouter, getParam, navigate, goBack } from "./router/index";
+export { getParam, getParams, navigate, goBack } from "./router/index";
 export { onMount, onDestroy } from "./router/lifecycle";

package/dist/init.js

@@ -3,7 +3,8 @@
 import { matchPath, splitPath } from "./router/path-matcher";
 import { initLifecycle } from "./router/lifecycle";
 import { highlightActiveLinks } from "./router/active-links";
-import { navigate } from "./router/navigate";
+import { navigate } from "./router/index";
+import { setParams } from "./router/params";
 import { mountComponents } from "./registry";
 import { runPageInit } from "./page-registry";
 let initialized = false;
@@ -24,12 +25,15 @@ export function init(config) {
         }
     }
     if (!matchedPath) {
-        console.warn(`[tinyfx] No route matched for pathname: "${pathname}". ` +
-            "Check that a page file exists for this URL in src/pages/.");
+        if (__DEV__) {
+            console.warn(`[tinyfx] No route matched for pathname: "${pathname}". ` +
+                "Check that a page file exists for this URL in src/pages/.");
+        }
         return null;
     }
     initLifecycle();
     highlightActiveLinks(pathname);
+    setParams(params);
     const ctx = { params, navigate };
     const instances = mountComponents(ctx);
     if (config.setupDirectives) {

package/dist/router/index.d.ts

@@ -1,25 +1,23 @@
-import type { RouteMap } from "./types";
-import { navigate, goBack } from "./navigate";
-import { getParam } from "./params";
-export type { RouteMap };
-export { navigate, goBack, getParam };
 /**
- * Initialise the TinyFX router for the current page.
- *
- * Called automatically from the compiler-generated `tinyfx.gen.ts` on every
- * page load.  Matches `window.location.pathname` against the compiled route
- * map, resolves URL params, starts lifecycle hooks, and highlights active
- * navigation links.
- *
- * @param routes - The route map emitted by `tinyfx build`.
- * @returns Nothing
- *
- * @example
- * // tinyfx.gen.ts (auto-generated — do not edit)
- * initRouter({
- *   "/":          { page: "home",      path: "/" },
- *   "/blog":      { page: "blog",      path: "/blog" },
- *   "/blog/:slug":{ page: "blog-post", path: "/blog/:slug" },
- * });
+ * Metadata for a single route produced by the compiler.
  */
-export declare function initRouter(routes: RouteMap): void;
+export interface RouteMeta {
+    /** The page name, derived from the source filename. */
+    page: string;
+    /** The declared URL pattern, e.g. "/blog/:slug". */
+    path: string;
+}
+/**
+ * The full route map emitted by `tinyfx build` into `tinyfx.gen.ts`.
+ */
+export type RouteMap = Record<string, RouteMeta>;
+/**
+ * Navigate to the given path.
+ * This is a full browser navigation — not a DOM swap.
+ */
+export declare function navigate(path: string): void;
+/**
+ * Go back one step in the browser history.
+ */
+export declare function goBack(): void;
+export { getParam, getParams } from "./params";

package/dist/router/index.js

@@ -1,39 +1,15 @@
-// @tinyfx/runtime — router entry point
-import { navigate, goBack } from "./navigate";
-import { getParam, resolveParams } from "./params";
-import { initLifecycle } from "./lifecycle";
-import { highlightActiveLinks } from "./active-links";
-export { navigate, goBack, getParam };
+// @tinyfx/runtime — router utilities
 /**
- * Initialise the TinyFX router for the current page.
- *
- * Called automatically from the compiler-generated `tinyfx.gen.ts` on every
- * page load.  Matches `window.location.pathname` against the compiled route
- * map, resolves URL params, starts lifecycle hooks, and highlights active
- * navigation links.
- *
- * @param routes - The route map emitted by `tinyfx build`.
- * @returns Nothing
- *
- * @example
- * // tinyfx.gen.ts (auto-generated — do not edit)
- * initRouter({
- *   "/":          { page: "home",      path: "/" },
- *   "/blog":      { page: "blog",      path: "/blog" },
- *   "/blog/:slug":{ page: "blog-post", path: "/blog/:slug" },
- * });
+ * Navigate to the given path.
+ * This is a full browser navigation — not a DOM swap.
  */
-export function initRouter(routes) {
-    const pathname = window.location.pathname;
-    for (const pattern of Object.keys(routes)) {
-        if (resolveParams(pattern, pathname)) {
-            // Match found
-            initLifecycle();
-            highlightActiveLinks(pathname);
-            return;
-        }
-    }
-    // No route matched — log a warning and do nothing else.
-    console.warn(`[tinyfx] No route matched for pathname: "${pathname}". ` +
-        "Check that a page file exists for this URL in src/pages/.");
+export function navigate(path) {
+    window.location.href = path;
 }
+/**
+ * Go back one step in the browser history.
+ */
+export function goBack() {
+    window.history.go(-1);
+}
+export { getParam, getParams } from "./params";

package/dist/router/lifecycle.d.ts

@@ -29,7 +29,7 @@ export declare function onMount(fn: LifecycleCallback): void;
 export declare function onDestroy(fn: LifecycleCallback): void;
 /**
  * Trigger all registered `onMount` callbacks.
- * Called by `initRouter` after matching the current route.
+ * Called by `init()` after matching the current route.
  *
  * @returns Nothing
  *
@@ -39,7 +39,7 @@ export declare function onDestroy(fn: LifecycleCallback): void;
 export declare function flushMount(): void;
 /**
  * Wire up registered `onDestroy` callbacks to the `pagehide` event.
- * Called by `initRouter` after matching the current route.
+ * Called by `init()` after matching the current route.
  *
  * @returns Nothing
  *

package/dist/router/lifecycle.js

@@ -39,7 +39,7 @@ export function onDestroy(fn) {
 }
 /**
  * Trigger all registered `onMount` callbacks.
- * Called by `initRouter` after matching the current route.
+ * Called by `init()` after matching the current route.
  *
  * @returns Nothing
  *
@@ -57,7 +57,7 @@ export function flushMount() {
 }
 /**
  * Wire up registered `onDestroy` callbacks to the `pagehide` event.
- * Called by `initRouter` after matching the current route.
+ * Called by `init()` after matching the current route.
  *
  * @returns Nothing
  *

package/dist/router/params.d.ts

@@ -1,20 +1,9 @@
 /**
- * Match `pattern` (e.g. "/blog/:slug") against `pathname` (e.g. "/blog/hello").
+ * Set resolved route params (called internally by init()).
  *
- * Returns true if they match, and stores any `:param` captures in the
- * module-level store so `getParam()` can retrieve them.
- *
- * Static segments must match exactly; `:param` segments match any non-empty
- * path segment.
- *
- * @param pattern - The route pattern produced by the compiler
- * @param pathname - The current browser pathname
- * @returns `true` when the pathname matches the pattern, otherwise `false`
- *
- * @example
- * resolveParams("/blog/:slug", "/blog/hello-world");
+ * @param params - The resolved URL parameters
  */
-export declare function resolveParams(pattern: string, pathname: string): boolean;
+export declare function setParams(params: Record<string, string>): void;
 /**
  * Retrieve a URL parameter resolved for the current page.
  *

package/dist/router/params.js

@@ -2,40 +2,12 @@
 /** Module-level store for the current page's resolved params. */
 let currentParams = {};
 /**
- * Match `pattern` (e.g. "/blog/:slug") against `pathname` (e.g. "/blog/hello").
+ * Set resolved route params (called internally by init()).
  *
- * Returns true if they match, and stores any `:param` captures in the
- * module-level store so `getParam()` can retrieve them.
- *
- * Static segments must match exactly; `:param` segments match any non-empty
- * path segment.
- *
- * @param pattern - The route pattern produced by the compiler
- * @param pathname - The current browser pathname
- * @returns `true` when the pathname matches the pattern, otherwise `false`
- *
- * @example
- * resolveParams("/blog/:slug", "/blog/hello-world");
+ * @param params - The resolved URL parameters
  */
-export function resolveParams(pattern, pathname) {
-    const patternParts = pattern.split("/").filter(Boolean);
-    const pathParts = pathname.split("/").filter(Boolean);
-    if (patternParts.length !== pathParts.length)
-        return false;
-    const captured = {};
-    for (let i = 0; i < patternParts.length; i++) {
-        const seg = patternParts[i];
-        if (seg.startsWith(":")) {
-            // Dynamic segment — capture the value
-            captured[seg.slice(1)] = decodeURIComponent(pathParts[i]);
-        }
-        else if (seg !== pathParts[i]) {
-            // Static segment mismatch
-            return false;
-        }
-    }
-    currentParams = captured;
-    return true;
+export function setParams(params) {
+    currentParams = params;
 }
 /**
  * Retrieve a URL parameter resolved for the current page.

package/dist/signals.d.ts

@@ -1,23 +1,3 @@
-/**
- * Reactive value container used by TinyFX signals.
- *
- * Reading the value through {@link Signal.get} during an active effect records
- * that effect as a subscriber. Writing through {@link Signal.set} re-runs the
- * affected subscribers.
- *
- * @example
- * const count = new Signal(0);
- * console.log(count.get());
- * count.set(1);
- * console.log(count.get());
- */
-export declare class Signal<T> {
-    private value;
-    private subs;
-    constructor(v: T);
-    get(): T;
-    set(v: T): void;
-}
 /**
  * Creates a reactive signal function.
  *

package/dist/signals.js

@@ -1,38 +1,6 @@
 // @tinyfx/runtime — signals
 // Minimal, explicit reactivity — no proxies, no magic.
 const effectStack = [];
-/**
- * Reactive value container used by TinyFX signals.
- *
- * Reading the value through {@link Signal.get} during an active effect records
- * that effect as a subscriber. Writing through {@link Signal.set} re-runs the
- * affected subscribers.
- *
- * @example
- * const count = new Signal(0);
- * console.log(count.get());
- * count.set(1);
- * console.log(count.get());
- */
-export class Signal {
-    constructor(v) {
-        this.subs = new Set();
-        this.value = v;
-    }
-    get() {
-        const running = effectStack[effectStack.length - 1];
-        if (running) {
-            this.subs.add(running);
-        }
-        return this.value;
-    }
-    set(v) {
-        if (Object.is(v, this.value))
-            return;
-        this.value = v;
-        this.subs.forEach((fn) => fn());
-    }
-}
 /**
  * Creates a reactive signal function.
  *
@@ -46,9 +14,20 @@ export class Signal {
  * count.set(1);
  */
 export function signal(v) {
-    const s = new Signal(v);
-    const fn = () => s.get();
-    fn.set = (v) => s.set(v);
+    let value = v;
+    const subs = new Set();
+    const fn = () => {
+        const running = effectStack[effectStack.length - 1];
+        if (running)
+            subs.add(running);
+        return value;
+    };
+    fn.set = (next) => {
+        if (Object.is(next, value))
+            return;
+        value = next;
+        subs.forEach((s) => s());
+    };
     return fn;
 }
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tinyfx/runtime",
-  "version": "0.1.9",
+  "version": "0.2.1",
   "description": "Minimal frontend runtime — signals, DOM helpers, typed HTTP, DTO mapping",
   "type": "module",
   "main": "./dist/index.js",