@ternkit/tern 1.14.0 → 1.15.0

package/dist/index.d.ts

@@ -15,7 +15,8 @@ export { enhance } from './runtime/forms.js';
 export { validate, checkField, type FormField, type FormErrors } from './runtime/validate.js';
 export type { SubmitFunction, SubmitInput, SubmitResult } from './runtime/forms.js';
 export type { ActionResult, GotoOptions, Navigation, NavigationTarget, NavigationType } from './runtime/types.js';
-export { ApiError, createApi } from './runtime/api.js';
+export { ApiError, createApi, createStream } from './runtime/api.js';
+export type { ApiStream } from './runtime/api.js';
 export { stream, socket, EventStreamState, SocketState } from './runtime/realtime.svelte.js';
 export type { ConnectionStatus, StreamOptions, SocketOptions } from './runtime/realtime.svelte.js';
 export { default as Image } from './image/Image.svelte';
@@ -30,4 +31,4 @@ export type { MessageKey } from './runtime/i18n.svelte.js';
 export interface Messages {
 }
 /** The version of the Tern client runtime. */
-export declare const VERSION = "1.14.0";
+export declare const VERSION = "1.15.0";

package/dist/index.js

@@ -12,10 +12,10 @@ export { goto, invalidate, invalidateAll, preloadData, applyAction } from './run
 export { beforeNavigate, onNavigate, afterNavigate } from './runtime/navigation.js';
 export { enhance } from './runtime/forms.js';
 export { validate, checkField } from './runtime/validate.js';
-export { ApiError, createApi } from './runtime/api.js';
+export { ApiError, createApi, createStream } from './runtime/api.js';
 export { stream, socket, EventStreamState, SocketState } from './runtime/realtime.svelte.js';
 export { default as Image } from './image/Image.svelte';
 export { t, i18n, setLocale } from './runtime/i18n.svelte.js';
 export { passkeysSupported, registerPasskey, signInWithPasskey, PasskeyError } from './runtime/passkeys.js';
 /** The version of the Tern client runtime. */
-export const VERSION = '1.14.0';
+export const VERSION = '1.15.0';

package/dist/runtime/api.d.ts

@@ -13,6 +13,17 @@ type Options = {
     signal?: AbortSignal;
     fetch?: typeof fetch;
 };
+type Route = (pattern: string, params?: Record<string, unknown>) => string;
 /** Creates the $api client from $routes' route(); generated code calls it. */
-export declare function createApi(route: (pattern: string, params?: Record<string, unknown>) => string): (endpoint: string, options?: Options) => Promise<unknown>;
+export declare function createApi(route: Route): (endpoint: string, options?: Options) => Promise<unknown>;
+/**
+ * A streaming endpoint's answer: iterate it with for await to get each
+ * value as the server sends it.
+ */
+export interface ApiStream<T> extends AsyncIterable<T> {
+    /** Stops the stream: the loop ends, and the server's request is cancelled. */
+    abort(): void;
+}
+/** Creates $api's stream from $routes' route(); generated code calls it. */
+export declare function createStream(route: Route): (endpoint: string, options?: Options) => ApiStream<unknown>;
 export {};

package/dist/runtime/api.js

@@ -11,45 +11,144 @@ export class ApiError extends Error {
         this.body = body;
     }
 }
+function request(route, endpoint, options, accept) {
+    const space = endpoint.indexOf(' ');
+    const method = endpoint.slice(0, space);
+    let url = route(endpoint.slice(space + 1), options.params ?? {});
+    const headers = { Accept: accept };
+    const init = { method, headers, credentials: 'same-origin', signal: options.signal };
+    if (method === 'GET' || method === 'HEAD' || method === 'DELETE') {
+        const q = new URLSearchParams();
+        for (const [k, v] of Object.entries(options.query ?? {})) {
+            if (v === undefined || v === null)
+                continue;
+            for (const item of Array.isArray(v) ? v : [v])
+                q.append(k, item instanceof Date ? item.toISOString() : String(item));
+        }
+        const qs = q.toString();
+        if (qs)
+            url += '?' + qs;
+    }
+    else {
+        headers['Content-Type'] = 'application/json';
+        init.body = JSON.stringify(options.body ?? {});
+    }
+    return { url, init };
+}
+async function failure(res) {
+    const text = await res.text();
+    let data = text || null;
+    try {
+        data = text ? JSON.parse(text) : null;
+    }
+    catch {
+        // not JSON: keep the text
+    }
+    const message = data?.message ?? res.statusText;
+    return new ApiError(res.status, message, data);
+}
 /** Creates the $api client from $routes' route(); generated code calls it. */
 export function createApi(route) {
     return async function api(endpoint, options = {}) {
-        const space = endpoint.indexOf(' ');
-        const method = endpoint.slice(0, space);
-        let url = route(endpoint.slice(space + 1), options.params ?? {});
-        const headers = { Accept: 'application/json' };
-        const init = { method, headers, credentials: 'same-origin', signal: options.signal };
-        if (method === 'GET' || method === 'HEAD' || method === 'DELETE') {
-            const q = new URLSearchParams();
-            for (const [k, v] of Object.entries(options.query ?? {})) {
-                if (v === undefined || v === null)
-                    continue;
-                for (const item of Array.isArray(v) ? v : [v])
-                    q.append(k, item instanceof Date ? item.toISOString() : String(item));
-            }
-            const qs = q.toString();
-            if (qs)
-                url += '?' + qs;
-        }
-        else {
-            headers['Content-Type'] = 'application/json';
-            init.body = JSON.stringify(options.body ?? {});
-        }
+        const { url, init } = request(route, endpoint, options, 'application/json');
         const res = await (options.fetch ?? fetch)(url, init);
+        if (!res.ok)
+            throw await failure(res);
         const text = await res.text();
-        let data = null;
-        if (text) {
+        if (!text)
+            return null;
+        try {
+            return JSON.parse(text);
+        }
+        catch {
+            return text;
+        }
+    };
+}
+/** Creates $api's stream from $routes' route(); generated code calls it. */
+export function createStream(route) {
+    return function stream(endpoint, options = {}) {
+        const controller = new AbortController();
+        options.signal?.addEventListener('abort', () => controller.abort(options.signal?.reason), { once: true });
+        let started = false;
+        async function* read() {
+            const { url, init } = request(route, endpoint, options, 'text/event-stream');
+            init.signal = controller.signal;
+            let res;
             try {
-                data = JSON.parse(text);
+                res = await (options.fetch ?? fetch)(url, init);
             }
-            catch {
-                data = text;
+            catch (err) {
+                if (controller.signal.aborted)
+                    return;
+                throw err;
+            }
+            if (!res.ok)
+                throw await failure(res);
+            if (!res.body || !res.headers.get('content-type')?.includes('text/event-stream')) {
+                throw new ApiError(res.status, `${endpoint} didn’t answer with a stream`, null);
+            }
+            const reader = res.body.pipeThrough(new TextDecoderStream()).getReader();
+            let buf = '';
+            try {
+                for (;;) {
+                    let chunk;
+                    try {
+                        chunk = await reader.read();
+                    }
+                    catch (err) {
+                        if (controller.signal.aborted)
+                            return;
+                        throw err;
+                    }
+                    if (chunk.done) {
+                        // The body ended without the server's done: it was cut off.
+                        if (controller.signal.aborted)
+                            return;
+                        throw new ApiError(0, 'The stream ended before it was done', null);
+                    }
+                    buf += chunk.value.replace(/\r\n/g, '\n');
+                    let end;
+                    while ((end = buf.indexOf('\n\n')) >= 0) {
+                        if (controller.signal.aborted)
+                            return;
+                        const raw = buf.slice(0, end);
+                        buf = buf.slice(end + 2);
+                        let event = 'message';
+                        const data = [];
+                        for (const line of raw.split('\n')) {
+                            if (line.startsWith('event:'))
+                                event = line.slice(6).trim();
+                            else if (line.startsWith('data:'))
+                                data.push(line.slice(5).replace(/^ /, ''));
+                        }
+                        if (!data.length)
+                            continue;
+                        const value = JSON.parse(data.join('\n'));
+                        if (event === 'done')
+                            return;
+                        if (event === 'error') {
+                            const e = value;
+                            throw new ApiError(e.status ?? 500, e.message ?? 'The stream failed', value);
+                        }
+                        yield value;
+                    }
+                }
+            }
+            finally {
+                reader.releaseLock();
+                // Leaving the loop early, with break or an error, stops the request.
+                controller.abort();
             }
         }
-        if (!res.ok) {
-            const message = data?.message ?? res.statusText;
-            throw new ApiError(res.status, message, data);
-        }
-        return data;
+        return {
+            [Symbol.asyncIterator]() {
+                if (started)
+                    throw new Error('A stream can be read only once');
+                started = true;
+                return read();
+            },
+            abort: () => controller.abort()
+        };
     };
 }

package/dist/runtime/builtin.js

@@ -33,6 +33,33 @@ export const builtin = {
     "tern.accounts.verify.button": "Confirm my email address",
     "tern.accounts.verify.subject": "Confirm your email address",
     "tern.accounts.verify.text": "Hello {name},\n\nConfirm your email address by opening this link:\n{link}\n\nIf you didn’t create an account, you can ignore this email.",
+    "tern.admin.all": "All",
+    "tern.admin.back": "All {name}",
+    "tern.admin.clear": "Clear",
+    "tern.admin.count": "{count, plural, one {# record} other {# records}}",
+    "tern.admin.create": "Create",
+    "tern.admin.delete": "Delete",
+    "tern.admin.deleteDescription": "This can’t be undone.",
+    "tern.admin.deleteTitle": "Delete this {name}?",
+    "tern.admin.done.created": "Created.",
+    "tern.admin.done.deleted": "Deleted.",
+    "tern.admin.done.saved": "Saved.",
+    "tern.admin.edit": "Edit {name}",
+    "tern.admin.empty": "There are no {name} yet.",
+    "tern.admin.error.referenced": "Other records refer to this {name}, so it can’t be deleted.",
+    "tern.admin.error.unique": "There’s already a {name} with one of these values.",
+    "tern.admin.home": "Overview",
+    "tern.admin.menu": "Sections",
+    "tern.admin.new": "New {name}",
+    "tern.admin.no": "No",
+    "tern.admin.noMatches": "Nothing matches.",
+    "tern.admin.passwordKept": "Leave it empty to keep the current one.",
+    "tern.admin.save": "Save",
+    "tern.admin.search": "Search",
+    "tern.admin.searchLabel": "Search {name}",
+    "tern.admin.showing": "{from}–{to} of {total}",
+    "tern.admin.sortBy": "Sort by {field}",
+    "tern.admin.yes": "Yes",
     "tern.billing.limit": "The {plan} plan allows {max} {limit}. Upgrade to add more.",
     "tern.ui.activity.description": "Sign-ins and changes to the account. If something wasn’t you, change your password.",
     "tern.ui.activity.empty": "Nothing yet.",
@@ -168,6 +195,13 @@ export const builtin = {
     "tern.ui.resetPassword.submit": "Save password",
     "tern.ui.resetPassword.title": "Choose a new password",
     "tern.ui.resizable.label": "Resize",
+    "tern.ui.search.all": "All results for “{query}”",
+    "tern.ui.search.empty": "Nothing matches “{query}”.",
+    "tern.ui.search.failed": "Searching didn’t work. Try again.",
+    "tern.ui.search.label": "Search",
+    "tern.ui.search.placeholder": "Search…",
+    "tern.ui.search.results": "{n, plural, one {# result} other {# results}}",
+    "tern.ui.search.searching": "Searching…",
     "tern.ui.selectMenu.placeholder": "Choose…",
     "tern.ui.sidebar.label": "Main",
     "tern.ui.sidebar.open": "Open navigation",

package/dist/runtime/dev.d.ts

@@ -0,0 +1,35 @@
+import type { Payload } from './types.js';
+/** What the server tells the overlay about a response, in dev only. */
+export type DevInfo = {
+    requestId: string;
+    components: string[];
+    flags?: Record<string, boolean>;
+};
+export type DevEvent = {
+    kind: 'page';
+    url: string;
+    route: string | null;
+    params: Record<string, string>;
+    status: number;
+    error: string | null;
+    /** The node whose load failed, for an error. */
+    failed: number | null;
+    nodes: unknown[];
+    requestId: string;
+    components: string[];
+    /** The feature flags the request checked, and what each decided. */
+    flags: Record<string, boolean>;
+} | {
+    kind: 'action';
+    url: string;
+    type: string;
+    status: number;
+    requestId: string;
+    data: unknown;
+};
+export declare function devPage(p: Payload, url: URL): void;
+export declare function devAction(action: URL, result: {
+    type: string;
+    status?: number;
+    data?: unknown;
+}, requestId: string): void;

package/dist/runtime/dev.js

@@ -0,0 +1,32 @@
+// Under tern dev, the router and forms tell the dev overlay what each
+// page and action did, with a "tern:dev" event on window. The overlay
+// (tern dev's /__tern/dev/client.js) looks up the request's logs, spans
+// and errors by its ID. Builds leave this out: callers check
+// import.meta.env.DEV first.
+function emit(detail) {
+    const w = window;
+    // The overlay may load after the first page renders: it reads what it missed here.
+    (w.__ternDev ??= []).push(detail);
+    if (w.__ternDev.length > 50)
+        w.__ternDev.shift();
+    dispatchEvent(new CustomEvent('tern:dev', { detail }));
+}
+export function devPage(p, url) {
+    const dev = p.dev;
+    emit({
+        kind: 'page',
+        url: url.pathname + url.search,
+        route: p.route ?? null,
+        params: p.params ?? {},
+        status: p.status,
+        error: p.error?.message ?? null,
+        failed: p.failed ?? null,
+        nodes: p.nodes ?? [],
+        requestId: dev?.requestId ?? '',
+        components: dev?.components ?? [],
+        flags: dev?.flags ?? {}
+    });
+}
+export function devAction(action, result, requestId) {
+    emit({ kind: 'action', url: action.pathname + action.search, type: result.type, status: result.status ?? 200, requestId, data: result.data ?? null });
+}

package/dist/runtime/forms.js

@@ -1,4 +1,5 @@
 import { applyAction, invalidateAll } from './router.svelte.js';
+import { devAction } from './dev.js';
 // Cloning a form without children reads its own action/method/enctype,
 // even if it contains inputs named "action" or "method".
 function attrs(form) {
@@ -65,6 +66,8 @@ export function enhance(form, submit = () => { }) {
             else {
                 result = { type: 'error', status: res.status, error: { message: res.statusText || 'Request failed' } };
             }
+            if (import.meta.env?.DEV)
+                devAction(action, result, res.headers.get('x-request-id') ?? '');
         }
         catch (err) {
             if (controller.signal.aborted)

package/dist/runtime/router.svelte.js

@@ -1,4 +1,5 @@
 import { hydrate, mount, tick } from 'svelte';
+import { devPage } from './dev.js';
 import DefaultError from './DefaultError.svelte';
 import Passthrough from './Passthrough.svelte';
 import Root from './Root.svelte';
@@ -426,6 +427,8 @@ async function render(p, url, state, id) {
         });
     }
     applyPayloadToPage(p, url, state, what.data);
+    if (import.meta.env?.DEV)
+        devPage(p, url);
     props.components = components;
     props.data = what.data;
     props.form = page.form;

package/dist/runtime/types.d.ts

@@ -61,6 +61,12 @@ export interface Payload {
     env?: Record<string, string>;
     /** The request's locale, when the app has src/locales. */
     locale?: string;
+    /** Under tern dev: the request's ID and the route's files, for the dev overlay. */
+    dev?: {
+        requestId: string;
+        components: string[];
+        flags?: Record<string, boolean>;
+    };
 }
 export interface NodeUses {
     url?: boolean;