@ternkit/tern 0.3.1 → 1.0.0

package/dist/index.d.ts

@@ -7,10 +7,12 @@
  * </script>
  * ```
  */
-export { page, navigating } from './runtime/state.svelte.js';
-export { goto, invalidateAll, preloadData, applyAction } from './runtime/router.svelte.js';
+export { page, navigating, env } from './runtime/state.svelte.js';
+export { goto, invalidate, invalidateAll, preloadData, applyAction } from './runtime/router.svelte.js';
+export { beforeNavigate, onNavigate, afterNavigate } from './runtime/navigation.js';
+export type { BeforeNavigateEvent, OnNavigateEvent } from './runtime/navigation.js';
 export { enhance } from './runtime/forms.js';
 export type { SubmitFunction, SubmitInput, SubmitResult } from './runtime/forms.js';
 export type { ActionResult, GotoOptions, Navigation, NavigationTarget, NavigationType } from './runtime/types.js';
 /** The version of the Tern client runtime. */
-export declare const VERSION = "0.3.1";
+export declare const VERSION = "1.0.0";

package/dist/index.js

@@ -7,8 +7,9 @@
  * </script>
  * ```
  */
-export { page, navigating } from './runtime/state.svelte.js';
-export { goto, invalidateAll, preloadData, applyAction } from './runtime/router.svelte.js';
+export { page, navigating, env } from './runtime/state.svelte.js';
+export { goto, invalidate, invalidateAll, preloadData, applyAction } from './runtime/router.svelte.js';
+export { beforeNavigate, onNavigate, afterNavigate } from './runtime/navigation.js';
 export { enhance } from './runtime/forms.js';
 /** The version of the Tern client runtime. */
-export const VERSION = '0.3.1';
+export const VERSION = '1.0.0';

package/dist/runtime/navigation.d.ts

@@ -0,0 +1,55 @@
+import type { Navigation } from './types.js';
+/** Passed to beforeNavigate callbacks. */
+export interface BeforeNavigateEvent extends Navigation {
+    /** True when the browser is about to leave the app (a reload, closing the tab, or another site). */
+    willUnload: boolean;
+    /** Stops the navigation. When leaving the page, the browser asks the user to confirm. */
+    cancel(): void;
+}
+/** Passed to onNavigate callbacks. */
+export interface OnNavigateEvent extends Navigation {
+    /** Resolves when the new page has rendered. */
+    complete: Promise<void>;
+}
+type BeforeFn = (nav: BeforeNavigateEvent) => void;
+type OnFn = (nav: OnNavigateEvent) => void | Promise<void> | (() => void) | Promise<() => void>;
+type AfterFn = (nav: Navigation) => void;
+/**
+ * Runs before every navigation, including leaving the app. Call
+ * `nav.cancel()` to stop it, for example to keep unsaved changes:
+ *
+ * ```js
+ * beforeNavigate((nav) => {
+ *   if (dirty && !confirm('Discard your changes?')) nav.cancel();
+ * });
+ * ```
+ *
+ * Call it while a component initializes; it is removed when the component is destroyed.
+ */
+export declare function beforeNavigate(fn: BeforeFn): void;
+/**
+ * Runs when a client-side navigation has loaded its data, right before the
+ * new page renders. Return a promise to delay rendering, for example to
+ * start a view transition; return a function to run after the navigation.
+ *
+ * ```js
+ * onNavigate((nav) => {
+ *   if (!document.startViewTransition) return;
+ *   return new Promise((resolve) => {
+ *     document.startViewTransition(async () => {
+ *       resolve();
+ *       await nav.complete;
+ *     });
+ *   });
+ * });
+ * ```
+ */
+export declare function onNavigate(fn: OnFn): void;
+/** Runs after every navigation, including the first page load. */
+export declare function afterNavigate(fn: AfterFn): void;
+/** Runs beforeNavigate callbacks; reports whether the navigation may go ahead. */
+export declare function runBefore(nav: Navigation, willUnload: boolean): boolean;
+/** Runs onNavigate callbacks and returns the cleanups to call afterwards. */
+export declare function runOn(nav: Navigation, complete: Promise<void>): Promise<(() => void)[]>;
+export declare function runAfter(nav: Navigation): void;
+export {};

package/dist/runtime/navigation.js

@@ -0,0 +1,69 @@
+import { onMount } from 'svelte';
+const before = new Set();
+const on = new Set();
+const after = new Set();
+/**
+ * Runs before every navigation, including leaving the app. Call
+ * `nav.cancel()` to stop it, for example to keep unsaved changes:
+ *
+ * ```js
+ * beforeNavigate((nav) => {
+ *   if (dirty && !confirm('Discard your changes?')) nav.cancel();
+ * });
+ * ```
+ *
+ * Call it while a component initializes; it is removed when the component is destroyed.
+ */
+export function beforeNavigate(fn) {
+    onMount(() => {
+        before.add(fn);
+        return () => before.delete(fn);
+    });
+}
+/**
+ * Runs when a client-side navigation has loaded its data, right before the
+ * new page renders. Return a promise to delay rendering, for example to
+ * start a view transition; return a function to run after the navigation.
+ *
+ * ```js
+ * onNavigate((nav) => {
+ *   if (!document.startViewTransition) return;
+ *   return new Promise((resolve) => {
+ *     document.startViewTransition(async () => {
+ *       resolve();
+ *       await nav.complete;
+ *     });
+ *   });
+ * });
+ * ```
+ */
+export function onNavigate(fn) {
+    onMount(() => {
+        on.add(fn);
+        return () => on.delete(fn);
+    });
+}
+/** Runs after every navigation, including the first page load. */
+export function afterNavigate(fn) {
+    onMount(() => {
+        after.add(fn);
+        return () => after.delete(fn);
+    });
+}
+/** Runs beforeNavigate callbacks; reports whether the navigation may go ahead. */
+export function runBefore(nav, willUnload) {
+    let cancelled = false;
+    const event = { ...nav, willUnload, cancel: () => (cancelled = true) };
+    for (const fn of before)
+        fn(event);
+    return !cancelled;
+}
+/** Runs onNavigate callbacks and returns the cleanups to call afterwards. */
+export async function runOn(nav, complete) {
+    const results = await Promise.all([...on].map((fn) => fn({ ...nav, complete })));
+    return results.filter((r) => typeof r === 'function');
+}
+export function runAfter(nav) {
+    for (const fn of after)
+        fn(nav);
+}

package/dist/runtime/router.svelte.d.ts

@@ -3,6 +3,11 @@ import type { ActionResult, ClientManifest, GotoOptions, Payload } from './types
 export declare function start(m: ClientManifest): Promise<void>;
 /** Navigates to href, which may be relative to the current URL. */
 export declare function goto(href: string | URL, opts?: GotoOptions): Promise<void>;
+/**
+ * Reruns the loads that depend on key, as declared with ctx.Depends(key)
+ * in Go, plus the current page's load.
+ */
+export declare function invalidate(key: string): Promise<void>;
 /** Reruns every load for the current page. */
 export declare function invalidateAll(): Promise<void>;
 /**

package/dist/runtime/router.svelte.js

@@ -3,6 +3,7 @@ import DefaultError from './DefaultError.svelte';
 import Passthrough from './Passthrough.svelte';
 import Root from './Root.svelte';
 import { DeferredScope, readStreamed, revive } from './deferred.js';
+import { runAfter, runBefore, runOn } from './navigation.js';
 import { plan } from './select.js';
 import { applyPayloadToPage, page, setNavigating } from './state.svelte.js';
 const MAX_REDIRECTS = 20;
@@ -22,6 +23,11 @@ const props = $state({
     form: null
 });
 const preloads = new Map();
+const held = new Map();
+const invalidated = new Set();
+let ignoreNextPop = false;
+/** Marks invalidate() reloads, which are not navigations: no hooks, no navigating state. */
+const RELOAD = Symbol('reload');
 /** Starts the client. Called by the generated entry module. */
 export async function start(m) {
     manifest = m;
@@ -36,7 +42,7 @@ export async function start(m) {
     catch {
         scrollPositions = {};
     }
-    historyIndex = history.state?.ternIndex ?? Date.now();
+    historyIndex = history.state?.ternIndex ?? 0;
     if (history.state?.ternIndex == null) {
         history.replaceState({ ...history.state, ternIndex: historyIndex, ternState: {} }, '');
     }
@@ -58,6 +64,8 @@ export async function start(m) {
         mount(Root, { target, props });
     }
     started = true;
+    await tick();
+    runAfter({ from: null, to: current(), type: 'enter' });
     const saved = scrollPositions[historyIndex];
     if (saved) {
         scrollTo(saved.x, saved.y);
@@ -73,12 +81,27 @@ export async function goto(href, opts = {}) {
         throw new Error('Tern: goto() was called before the app started');
     }
     const url = new URL(href, location.href);
-    if (url.origin !== location.origin) {
+    if (!inApp(url)) {
         location.href = url.href;
         return;
     }
     await navigate(url, opts, 'goto', 0);
 }
+/**
+ * Reruns the loads that depend on key, as declared with ctx.Depends(key)
+ * in Go, plus the current page's load.
+ */
+export function invalidate(key) {
+    invalidated.add(key);
+    preloads.clear();
+    return navigate(new URL(location.href), {
+        replaceState: true,
+        noScroll: true,
+        keepFocus: true,
+        state: page.state,
+        [RELOAD]: true
+    }, 'goto', 0);
+}
 /** Reruns every load for the current page. */
 export function invalidateAll() {
     return navigate(new URL(location.href), {
@@ -86,7 +109,8 @@ export function invalidateAll() {
         noScroll: true,
         keepFocus: true,
         invalidateAll: true,
-        state: page.state
+        state: page.state,
+        [RELOAD]: true
     }, 'goto', 0);
 }
 /**
@@ -136,13 +160,34 @@ function setForm(form) {
     page.form = form;
     props.form = form;
 }
-function dataURL(url) {
+function dataURL(url, reuse) {
     const path = url.pathname.replace(/\/$/, '');
-    return `${path}/__data.json${url.search}`;
+    // The base path is part of the pathname; the server strips it.
+    let target = `${path}/__data.json${url.search}`;
+    if (reuse) {
+        const here = url.pathname + url.search;
+        const entries = [];
+        for (const [i, h] of held) {
+            if (!h.uses)
+                continue; // no load: nothing to reuse
+            if (h.uses.url && h.url !== here)
+                continue;
+            if (h.uses.deps?.some((d) => invalidated.has(d)))
+                continue;
+            const p = {};
+            for (const name of h.uses.params ?? [])
+                p[name] = h.params[name] ?? '';
+            entries.push({ i, p });
+        }
+        if (entries.length) {
+            target += (url.search ? '&' : '?') + 'x-tern-reuse=' + encodeURIComponent(JSON.stringify(entries));
+        }
+    }
+    return target;
 }
-async function fetchPayload(url) {
+async function fetchPayload(url, reuse = true) {
     try {
-        const res = await fetch(dataURL(url), {
+        const res = await fetch(dataURL(url, reuse), {
             headers: { accept: 'application/json' },
             credentials: 'same-origin'
         });
@@ -164,18 +209,30 @@ function takePreload(url) {
     }
     return undefined;
 }
-async function navigate(url, opts, type, redirects, popIndex) {
+async function navigate(url, opts, type, redirects, popIndex, fromIndex) {
     const id = ++token;
     // A change of hash alone is a scroll, not a navigation.
     if (type !== 'popstate' && !opts.invalidateAll && url.hash && samePage(url)) {
         saveScroll();
-        history.pushState({ ternIndex: (historyIndex = Date.now()), ternState: $state.snapshot(opts.state ?? {}) }, '', url);
+        history.pushState({ ternIndex: (historyIndex = historyIndex + 1), ternState: $state.snapshot(opts.state ?? {}) }, '', url);
         scrollToHash(url.hash);
         return;
     }
     const from = current();
-    setNavigating({ from, to: { url, params: null, route: { id: null } }, type });
-    const payload = await (opts.invalidateAll ? undefined : takePreload(url)) ?? (await fetchPayload(url));
+    const nav = { from, to: { url, params: null, route: { id: null } }, type };
+    const reload = opts[RELOAD] === true;
+    if (!reload && !runBefore(nav, false)) {
+        if (type === 'popstate' && popIndex != null && fromIndex != null) {
+            // The browser already moved; move back to where we were.
+            ignoreNextPop = true;
+            historyIndex = fromIndex;
+            history.go(fromIndex - popIndex);
+        }
+        return;
+    }
+    if (!reload)
+        setNavigating(nav);
+    const payload = await (opts.invalidateAll ? undefined : takePreload(url)) ?? (await fetchPayload(url, !opts.invalidateAll));
     if (id !== token)
         return;
     if (!payload) {
@@ -184,15 +241,21 @@ async function navigate(url, opts, type, redirects, popIndex) {
     }
     if (payload.type === 'redirect' && payload.location) {
         const next = new URL(payload.location, url);
-        if (redirects >= MAX_REDIRECTS || next.origin !== location.origin) {
+        if (redirects >= MAX_REDIRECTS || !inApp(next)) {
             location.href = next.href;
             return;
         }
-        return navigate(next, { ...opts, replaceState: true }, type, redirects + 1);
+        return navigate(next, { ...opts, replaceState: true, [RELOAD]: false }, type, redirects + 1);
     }
     if (type !== 'popstate')
         saveScroll(); // popstate saved before historyIndex changed
     const state = opts.state ?? (type === 'popstate' ? history.state?.ternState ?? {} : {});
+    nav.to = { url, params: payload.params ?? {}, route: { id: payload.route ?? null } };
+    let finish;
+    const complete = new Promise((resolve) => (finish = resolve));
+    const cleanups = reload ? [] : await runOn(nav, complete);
+    if (id !== token)
+        return;
     const ok = await render(payload, url, state, id);
     if (id !== token)
         return;
@@ -207,7 +270,7 @@ async function navigate(url, opts, type, redirects, popIndex) {
             history.replaceState(entry, '', url);
         }
         else {
-            entry.ternIndex = historyIndex = Date.now();
+            entry.ternIndex = historyIndex = historyIndex + 1;
             history.pushState(entry, '', url);
         }
     }
@@ -226,6 +289,12 @@ async function navigate(url, opts, type, redirects, popIndex) {
     if (!opts.keepFocus) {
         resetFocus();
     }
+    invalidated.clear();
+    finish();
+    if (!reload)
+        runAfter(nav);
+    for (const fn of cleanups)
+        fn();
 }
 function samePage(url) {
     return url.pathname === location.pathname && url.search === location.search;
@@ -249,6 +318,16 @@ function loadRoute(id) {
 }
 /** Renders a payload. It reports false if the payload is not a page. */
 async function render(p, url, state, id) {
+    const route = p.route ? manifest.routes[p.route] : undefined;
+    const layouts = route ? route.layouts : manifest.fallback.layouts;
+    // Fill in the layout data the server skipped because we already have it.
+    if (p.reused?.length) {
+        p.nodes = [...(p.nodes ?? [])];
+        for (const k of p.reused) {
+            const li = layouts[k];
+            p.nodes[k] = li === undefined ? null : (held.get(li)?.data ?? null);
+        }
+    }
     const what = plan(manifest, p);
     let components;
     switch (what.kind) {
@@ -274,6 +353,14 @@ async function render(p, url, state, id) {
     nodes = p.nodes ?? [];
     if (id !== token)
         return true; // superseded; the newer navigation renders
+    if (p.type === 'data') {
+        const here = url.pathname + url.search;
+        layouts.forEach((li, k) => {
+            if (p.reused?.includes(k))
+                return;
+            held.set(li, { data: p.nodes?.[k] ?? null, uses: p.uses?.[k] ?? null, params: p.params ?? {}, url: here });
+        });
+    }
     applyPayloadToPage(p, url, state, what.data);
     props.components = components;
     props.data = what.data;
@@ -324,12 +411,19 @@ function findAnchor(event) {
     }
     return null;
 }
+/** Reports whether url belongs to this app (its origin and base path). */
+function inApp(url) {
+    if (url.origin !== location.origin)
+        return false;
+    const base = manifest.base ?? '';
+    return !base || url.pathname === base || url.pathname.startsWith(base + '/');
+}
 function anchorURL(a) {
     const href = a instanceof SVGAElement ? a.href.baseVal : a.href;
     if (!href)
         return null;
     const url = new URL(href, document.baseURI);
-    if (url.origin !== location.origin || !/^https?:$/.test(url.protocol))
+    if (!inApp(url) || !/^https?:$/.test(url.protocol))
         return null;
     const target = a instanceof SVGAElement ? a.target.baseVal : a.target;
     if (target && target !== '_self')
@@ -376,13 +470,45 @@ function listen() {
     };
     document.addEventListener('mousedown', onTap);
     document.addEventListener('touchstart', onTap, { passive: true });
+    // GET forms navigate on the client, like links. POST forms are handled
+    // by use:enhance or submit normally.
+    document.addEventListener('submit', (event) => {
+        if (event.defaultPrevented)
+            return;
+        const form = event.target;
+        const submitter = event.submitter;
+        const own = HTMLFormElement.prototype.cloneNode.call(form);
+        const method = submitter?.hasAttribute('formmethod') ? submitter.formMethod : own.method;
+        const target = submitter?.getAttribute('formtarget') ?? own.target;
+        if (method !== 'get' || (target && target !== '_self') || form.closest('[data-tern-reload]:not([data-tern-reload="off"])')) {
+            return;
+        }
+        const url = new URL(submitter?.hasAttribute('formaction') ? submitter.formAction : own.action);
+        if (!inApp(url))
+            return;
+        event.preventDefault();
+        url.search = new URLSearchParams(new FormData(form, submitter)).toString();
+        const filtering = url.pathname === location.pathname;
+        void navigate(url, { keepFocus: filtering, noScroll: filtering }, 'form', 0);
+    });
+    addEventListener('beforeunload', (event) => {
+        if (!runBefore({ from: current(), to: null, type: 'leave' }, true)) {
+            event.preventDefault();
+            event.returnValue = '';
+        }
+    });
     addEventListener('popstate', (event) => {
+        if (ignoreNextPop) {
+            ignoreNextPop = false;
+            return;
+        }
         const index = event.state?.ternIndex;
         if (index == null)
             return;
         saveScroll();
+        const fromIndex = historyIndex;
         historyIndex = index;
-        void navigate(new URL(location.href), { state: event.state?.ternState ?? {} }, 'popstate', 0, index);
+        void navigate(new URL(location.href), { state: event.state?.ternState ?? {} }, 'popstate', 0, index, fromIndex);
     });
     addEventListener('pagehide', saveScroll);
 }

package/dist/runtime/state.svelte.d.ts

@@ -46,6 +46,17 @@ export declare const navigating: {
     readonly current: Navigation | null;
 };
 export declare function setNavigating(n: Navigation | null): void;
+/**
+ * The server's PUBLIC_ environment variables, read when it started:
+ *
+ * ```js
+ * import { env } from '@ternkit/tern';
+ * fetch(`${env.PUBLIC_API_URL}/status`);
+ * ```
+ *
+ * Only variables whose names start with PUBLIC_ are sent to the browser.
+ */
+export declare const env: Record<string, string | undefined>;
 /** Updates page state for a rendered payload. */
 export declare function applyPayloadToPage(p: Payload, url: URL, state: Record<string, unknown>, data: Record<string, unknown>[]): void;
 export {};

package/dist/runtime/state.svelte.js

@@ -49,8 +49,24 @@ export const navigating = {
 export function setNavigating(n) {
     navigatingState.current = n;
 }
+/**
+ * The server's PUBLIC_ environment variables, read when it started:
+ *
+ * ```js
+ * import { env } from '@ternkit/tern';
+ * fetch(`${env.PUBLIC_API_URL}/status`);
+ * ```
+ *
+ * Only variables whose names start with PUBLIC_ are sent to the browser.
+ */
+export const env = {};
 /** Updates page state for a rendered payload. */
 export function applyPayloadToPage(p, url, state, data) {
+    if (p.env) {
+        for (const k of Object.keys(env))
+            delete env[k];
+        Object.assign(env, p.env);
+    }
     page.url = url;
     page.params = p.params ?? {};
     page.route = { id: p.route ?? null };

package/dist/runtime/types.d.ts

@@ -21,6 +21,8 @@ export interface RouteEntry {
 }
 /** The client manifest generated by `tern gen` in .tern/generated/manifest.js. */
 export interface ClientManifest {
+    /** The base path from tern.json, such as '/app', or ''. */
+    base?: string;
     layouts: LayoutEntry[];
     routes: Record<string, RouteEntry>;
     fallback: {
@@ -43,6 +45,18 @@ export interface Payload {
     data?: unknown;
     form?: unknown;
     hasForm?: boolean;
+    /** What each node's load read, so the client knows when to rerun it. */
+    uses?: (NodeUses | null)[];
+    /** Nodes the server skipped because the client already has their data. */
+    reused?: number[];
+    /** PUBLIC_ environment variables, on full page loads. */
+    env?: Record<string, string>;
+}
+export interface NodeUses {
+    url?: boolean;
+    params?: string[];
+    deps?: string[];
+    parent?: boolean;
 }
 /** The result of submitting a form action with `use:enhance`. */
 export type ActionResult<Success = Record<string, unknown>, Failure = Record<string, unknown>> = {
@@ -71,7 +85,7 @@ export interface NavigationTarget {
         id: string | null;
     };
 }
-export type NavigationType = 'enter' | 'link' | 'goto' | 'popstate' | 'form';
+export type NavigationType = 'enter' | 'link' | 'goto' | 'popstate' | 'form' | 'leave';
 export interface Navigation {
     from: NavigationTarget | null;
     to: NavigationTarget | null;

package/dist/server/intl.d.ts

@@ -0,0 +1,100 @@
+type Opts = Record<string, unknown>;
+declare class NumberFormat {
+    #private;
+    constructor(_locale?: unknown, options?: Opts);
+    format(value: number | bigint): string;
+    formatToParts(value: number): {
+        type: string;
+        value: string;
+    }[];
+    resolvedOptions(): {
+        locale: string;
+        numberingSystem: string;
+    };
+    static supportedLocalesOf(): string[];
+}
+declare class DateTimeFormat {
+    #private;
+    constructor(_locale?: unknown, options?: Opts);
+    format(value?: Date | number): string;
+    formatToParts(value?: Date | number): {
+        type: string;
+        value: string;
+    }[];
+    formatRange(a: Date | number, b: Date | number): string;
+    resolvedOptions(): {
+        locale: string;
+        calendar: string;
+        numberingSystem: string;
+        timeZone: string;
+    };
+    static supportedLocalesOf(): string[];
+}
+declare class PluralRules {
+    select(n: number): "one" | "other";
+    resolvedOptions(): {
+        locale: string;
+        pluralCategories: string[];
+    };
+    static supportedLocalesOf(): string[];
+}
+declare class Collator {
+    #private;
+    constructor(_locale?: unknown, options?: Opts);
+    compare: (a: string, b: string) => number;
+    resolvedOptions(): {
+        locale: string;
+        usage: string;
+        sensitivity: string;
+    };
+    static supportedLocalesOf(): string[];
+}
+declare class RelativeTimeFormat {
+    format(value: number, unit: string): string;
+    static supportedLocalesOf(): string[];
+}
+declare class ListFormat {
+    #private;
+    constructor(_locale?: unknown, options?: Opts);
+    format(list: Iterable<string>): string;
+    static supportedLocalesOf(): string[];
+}
+declare class Locale {
+    baseName: string;
+    language: string;
+    region?: string;
+    constructor(tag?: string);
+    get weekInfo(): {
+        firstDay: number;
+        weekend: number[];
+        minimalDays: number;
+    };
+    getWeekInfo(): {
+        firstDay: number;
+        weekend: number[];
+        minimalDays: number;
+    };
+    maximize(): this;
+    minimize(): this;
+    toString(): string;
+}
+declare class Segmenter {
+    segment(input: string): {
+        segment: string;
+        index: number;
+        input: string;
+    }[];
+}
+export declare const IntlShim: {
+    NumberFormat: typeof NumberFormat;
+    DateTimeFormat: typeof DateTimeFormat;
+    PluralRules: typeof PluralRules;
+    Collator: typeof Collator;
+    RelativeTimeFormat: typeof RelativeTimeFormat;
+    ListFormat: typeof ListFormat;
+    Locale: typeof Locale;
+    Segmenter: typeof Segmenter;
+    getCanonicalLocales: (l?: string | string[]) => string[];
+    supportedValuesOf: () => never[];
+};
+export {};

package/dist/server/intl.js

@@ -0,0 +1,222 @@
+// A small Intl for the server renderer. The embedded engine (QuickJS) has
+// no Intl, and many libraries create formatters when they load. This shim
+// formats like en-US, which is good enough for server-rendered HTML: the
+// browser hydrates with the user's real Intl and locale.
+const MONTHS = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
+const DAYS = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
+function group(int) {
+    return int.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+}
+class NumberFormat {
+    #o;
+    constructor(_locale, options = {}) {
+        this.#o = options;
+    }
+    format(value) {
+        let n = Number(value);
+        const o = this.#o;
+        if (!Number.isFinite(n))
+            return Number.isNaN(n) ? 'NaN' : n > 0 ? '∞' : '-∞';
+        let suffix = '';
+        if (o.style === 'percent') {
+            n *= 100;
+            suffix = '%';
+        }
+        if (o.notation === 'compact') {
+            const abs = Math.abs(n);
+            for (const [limit, s] of [[1e12, 'T'], [1e9, 'B'], [1e6, 'M'], [1e3, 'K']]) {
+                if (abs >= limit) {
+                    n /= limit;
+                    suffix = s + suffix;
+                    break;
+                }
+            }
+        }
+        const isCurrency = o.style === 'currency';
+        const max = o.maximumFractionDigits ?? (isCurrency ? 2 : o.notation === 'compact' ? 1 : 3);
+        const min = o.minimumFractionDigits ?? (isCurrency ? 2 : 0);
+        let s = Math.abs(n).toFixed(Math.max(min, Math.min(max, 20)));
+        if (s.includes('.')) {
+            let [int, frac = ''] = s.split('.');
+            while (frac.length > min && frac.endsWith('0'))
+                frac = frac.slice(0, -1);
+            s = frac ? `${int}.${frac}` : int;
+        }
+        const [int, frac] = s.split('.');
+        s = (o.useGrouping === false ? int : group(int)) + (frac ? `.${frac}` : '');
+        if (isCurrency) {
+            const code = String(o.currency ?? 'USD').toUpperCase();
+            s = (code === 'USD' ? '$' : code === 'EUR' ? '€' : code === 'GBP' ? '£' : `${code} `) + s;
+        }
+        return (n < 0 ? '-' : '') + s + suffix;
+    }
+    formatToParts(value) {
+        return [{ type: 'literal', value: this.format(value) }];
+    }
+    resolvedOptions() {
+        return { locale: 'en-US', numberingSystem: 'latn', ...this.#o };
+    }
+    static supportedLocalesOf() {
+        return ['en-US'];
+    }
+}
+class DateTimeFormat {
+    #o;
+    constructor(_locale, options = {}) {
+        this.#o = options;
+    }
+    format(value) {
+        const d = value === undefined ? new Date() : new Date(value);
+        if (Number.isNaN(d.getTime()))
+            return 'Invalid Date';
+        const o = this.#o;
+        const utc = o.timeZone === 'UTC';
+        const get = {
+            y: utc ? d.getUTCFullYear() : d.getFullYear(),
+            m: utc ? d.getUTCMonth() : d.getMonth(),
+            d: utc ? d.getUTCDate() : d.getDate(),
+            w: utc ? d.getUTCDay() : d.getDay(),
+            h: utc ? d.getUTCHours() : d.getHours(),
+            min: utc ? d.getUTCMinutes() : d.getMinutes()
+        };
+        const hasDate = o.year || o.month || o.day || o.weekday || o.dateStyle;
+        const hasTime = o.hour || o.minute || o.timeStyle;
+        const parts = [];
+        if (hasDate || !hasTime) {
+            const month = o.month ?? (o.dateStyle ? 'short' : 'numeric');
+            if (o.weekday)
+                parts.push((o.weekday === 'long' ? DAYS[get.w] : DAYS[get.w].slice(0, 3)) + ',');
+            if (month === 'numeric' || month === '2-digit') {
+                parts.push(`${get.m + 1}/${get.d}/${get.y}`);
+            }
+            else {
+                const name = month === 'long' ? MONTHS[get.m] : MONTHS[get.m].slice(0, 3);
+                const day = o.day !== undefined || o.dateStyle ? ` ${get.d}` : '';
+                const year = o.year !== undefined || o.dateStyle ? `, ${get.y}` : '';
+                parts.push(name + day + (day ? year : year.replace(', ', ' ')));
+            }
+        }
+        if (hasTime) {
+            const h12 = o.hour12 !== false;
+            const hour = h12 ? get.h % 12 || 12 : get.h;
+            const mm = String(get.min).padStart(2, '0');
+            parts.push(`${hour}:${mm}${h12 ? (get.h < 12 ? ' AM' : ' PM') : ''}`);
+        }
+        return parts.join(' ');
+    }
+    formatToParts(value) {
+        return [{ type: 'literal', value: this.format(value) }];
+    }
+    formatRange(a, b) {
+        return `${this.format(a)} – ${this.format(b)}`;
+    }
+    resolvedOptions() {
+        return { locale: 'en-US', calendar: 'gregory', numberingSystem: 'latn', timeZone: 'UTC', ...this.#o };
+    }
+    static supportedLocalesOf() {
+        return ['en-US'];
+    }
+}
+class PluralRules {
+    select(n) {
+        return n === 1 ? 'one' : 'other';
+    }
+    resolvedOptions() {
+        return { locale: 'en-US', pluralCategories: ['one', 'other'] };
+    }
+    static supportedLocalesOf() {
+        return ['en-US'];
+    }
+}
+class Collator {
+    #numeric;
+    constructor(_locale, options = {}) {
+        this.#numeric = options.numeric === true;
+    }
+    compare = (a, b) => {
+        if (this.#numeric) {
+            const na = Number(a);
+            const nb = Number(b);
+            if (!Number.isNaN(na) && !Number.isNaN(nb))
+                return na - nb;
+        }
+        const x = String(a).toLowerCase();
+        const y = String(b).toLowerCase();
+        return x < y ? -1 : x > y ? 1 : 0;
+    };
+    resolvedOptions() {
+        return { locale: 'en-US', usage: 'sort', sensitivity: 'variant' };
+    }
+    static supportedLocalesOf() {
+        return ['en-US'];
+    }
+}
+class RelativeTimeFormat {
+    format(value, unit) {
+        const u = unit.replace(/s$/, '');
+        const n = Math.abs(value);
+        const label = `${n} ${u}${n === 1 ? '' : 's'}`;
+        return value < 0 ? `${label} ago` : `in ${label}`;
+    }
+    static supportedLocalesOf() {
+        return ['en-US'];
+    }
+}
+class ListFormat {
+    #type;
+    constructor(_locale, options = {}) {
+        this.#type = options.type === 'disjunction' ? 'or' : 'and';
+    }
+    format(list) {
+        const items = [...list];
+        if (items.length < 3)
+            return items.join(` ${this.#type} `);
+        return `${items.slice(0, -1).join(', ')}, ${this.#type} ${items[items.length - 1]}`;
+    }
+    static supportedLocalesOf() {
+        return ['en-US'];
+    }
+}
+class Locale {
+    baseName;
+    language;
+    region;
+    constructor(tag = 'en-US') {
+        this.baseName = String(tag);
+        const [language, region] = this.baseName.split(/[-_]/);
+        this.language = language || 'en';
+        this.region = region;
+    }
+    get weekInfo() {
+        return this.getWeekInfo();
+    }
+    getWeekInfo() {
+        return { firstDay: 7, weekend: [6, 7], minimalDays: 1 };
+    }
+    maximize() {
+        return this;
+    }
+    minimize() {
+        return this;
+    }
+    toString() {
+        return this.baseName;
+    }
+}
+class Segmenter {
+    segment(input) {
+        return [...input].map((segment, index) => ({ segment, index, input }));
+    }
+}
+export const IntlShim = {
+    NumberFormat,
+    DateTimeFormat,
+    PluralRules,
+    Collator,
+    RelativeTimeFormat,
+    ListFormat,
+    Locale,
+    Segmenter,
+    getCanonicalLocales: (l) => (l === undefined ? [] : Array.isArray(l) ? l : [l]),
+    supportedValuesOf: () => []
+};

package/dist/server/polyfills.js

@@ -4,7 +4,16 @@
 // during development.
 import 'core-js/actual/url';
 import 'core-js/actual/url-search-params';
+import { IntlShim } from './intl.js';
 const g = globalThis;
+// Some libraries read process.env.SOMETHING at runtime. Give them an empty
+// environment instead of a ReferenceError.
+if (typeof g.process === 'undefined') {
+    g.process = { env: { NODE_ENV: 'production' }, browser: false, version: '', versions: {} };
+}
+if (typeof g.Intl === 'undefined') {
+    g.Intl = IntlShim;
+}
 if (typeof g.queueMicrotask !== 'function') {
     g.queueMicrotask = (fn) => void Promise.resolve().then(fn);
 }

package/dist/vite/index.js

@@ -1,4 +1,5 @@
 import { svelte } from '@sveltejs/vite-plugin-svelte';
+import fs from 'node:fs';
 import path from 'node:path';
 /** Paths shared with the Go code generator; keep in sync with internal/codegen. */
 const CLIENT_ENTRY = '.tern/generated/client.js';
@@ -28,9 +29,16 @@ export function tern(options = {}) {
         name: 'tern',
         config(config, env) {
             root = path.resolve(config.root ?? process.cwd());
+            const basePath = readBasePath(root);
             const shared = {
                 appType: 'custom',
-                resolve: { alias: { $lib: path.join(root, 'src/lib') } }
+                base: basePath + '/',
+                resolve: {
+                    alias: {
+                        $lib: path.join(root, 'src/lib'),
+                        $routes: path.join(root, '.tern/generated/routes.js')
+                    }
+                }
             };
             if (env.isSsrBuild) {
                 return {
@@ -49,7 +57,10 @@ export function tern(options = {}) {
                     },
                     // One self-contained file: the renderer runs in an embedded engine
                     // without a module loader or Node built-ins.
-                    ssr: { noExternal: true }
+                    ssr: { noExternal: true },
+                    // Libraries often read process.env.NODE_ENV; the engine has no
+                    // process object, so replace it at build time.
+                    define: { 'process.env.NODE_ENV': JSON.stringify('production') }
                 };
             }
             const vitePort = Number(process.env.TERN_VITE_PORT) || undefined;
@@ -71,7 +82,7 @@ export function tern(options = {}) {
                     port: vitePort,
                     strictPort: vitePort !== undefined,
                     // The browser talks to the Go app, which proxies HMR to Vite.
-                    hmr: appPort ? { clientPort: appPort } : undefined,
+                    ws: appPort ? { clientPort: appPort } : undefined,
                     fs: { allow: [root] }
                 },
                 optimizeDeps: {
@@ -107,4 +118,14 @@ export function tern(options = {}) {
     }
     return [...svelte(options.svelte), plugin];
 }
+/** Reads basePath from tern.json; the Go side validates it. */
+function readBasePath(root) {
+    try {
+        const config = JSON.parse(fs.readFileSync(path.join(root, 'tern.json'), 'utf8'));
+        return config.basePath ?? '';
+    }
+    catch {
+        return '';
+    }
+}
 export default tern;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ternkit/tern",
-  "version": "0.3.1",
+  "version": "1.0.0",
   "description": "Client runtime and Vite plugin for Tern: Svelte on the client, Go on the server",
   "license": "MIT",
   "type": "module",
@@ -51,7 +51,8 @@
   "scripts": {
     "build": "svelte-package -i src -o dist",
     "prepare": "svelte-package -i src -o dist",
-    "typecheck": "svelte-check --tsconfig ./tsconfig.json --fail-on-warnings"
+    "typecheck": "svelte-check --tsconfig ./tsconfig.json --fail-on-warnings",
+    "test": "vitest run"
   },
   "peerDependencies": {
     "svelte": "^5.46.4",
@@ -67,6 +68,7 @@
     "svelte": "^5.57.3",
     "svelte-check": "^4.7.8",
     "typescript": "^6.0.0",
-    "vite": "^8.3.7"
+    "vite": "^8.3.7",
+    "vitest": "^5.1.0"
   }
 }