turbine-orm 0.15.0 → 0.18.0

package/dist/cjs/realtime.js

@@ -0,0 +1,147 @@
+"use strict";
+/**
+ * turbine-orm — LISTEN/NOTIFY realtime pub/sub
+ *
+ * Postgres LISTEN/NOTIFY is a first-class realtime primitive that neither
+ * Prisma nor Drizzle expose ergonomically. This module backs the thin
+ * `$listen` / `$notify` methods on TurbineClient.
+ *
+ * Design — **one dedicated connection per subscription**:
+ *
+ *   Each `$listen(channel, handler)` acquires its OWN long-lived client from
+ *   the pool, runs `LISTEN "chan"`, and keeps that connection checked out for
+ *   the life of the subscription. This is the simplest correct model: each
+ *   subscription owns its lifecycle, `unsubscribe()` cleanly UNLISTENs and
+ *   releases exactly one connection, and there is no shared multiplexing
+ *   state to reason about. The trade-off is one pool slot per active channel
+ *   — for the handful of channels a typical app listens on, that's a fine
+ *   price for clarity. (A future optimization could multiplex many channels
+ *   over a single shared notification connection.)
+ *
+ * Serverless / HTTP-pool caveat:
+ *
+ *   LISTEN requires a *persistent* TCP connection that can push asynchronous
+ *   notification messages back to the client. Stateless HTTP drivers
+ *   (Neon HTTP, Vercel Postgres over fetch) cannot hold such a connection, so
+ *   `$listen` will surface a clear error rather than hang. `$notify` works
+ *   everywhere — it's a single round-trip `SELECT pg_notify(...)`.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateChannel = validateChannel;
+exports.createSubscription = createSubscription;
+const errors_js_1 = require("./errors.js");
+// ---------------------------------------------------------------------------
+// Identifier validation
+// ---------------------------------------------------------------------------
+/**
+ * Strict Postgres identifier: a letter or underscore followed by letters,
+ * digits, or underscores. Channel names CANNOT be parameterized in
+ * LISTEN/UNLISTEN (`LISTEN $1` is a syntax error), so the channel is the one
+ * place an identifier is interpolated into SQL — it MUST pass this regex AND
+ * go through `quoteIdent` before reaching the SQL string.
+ */
+const CHANNEL_REGEX = /^[A-Za-z_][A-Za-z0-9_]*$/;
+/** Postgres NAMEDATALEN caps identifiers at 63 bytes. */
+const MAX_CHANNEL_LEN = 63;
+/**
+ * Validate a LISTEN/NOTIFY channel name. Throws ValidationError on anything
+ * that isn't a plain, reasonable-length SQL identifier. This is enforced for
+ * BOTH `$listen` (where the channel is interpolated) and `$notify` (where the
+ * channel is a bound param) — defensive parity, and it catches user typos
+ * loudly.
+ */
+function validateChannel(channel) {
+    if (typeof channel !== 'string' || channel.length === 0) {
+        throw new errors_js_1.ValidationError('[turbine] $listen/$notify channel must be a non-empty string');
+    }
+    if (channel.length > MAX_CHANNEL_LEN) {
+        throw new errors_js_1.ValidationError(`[turbine] $listen/$notify channel "${channel}" exceeds the ${MAX_CHANNEL_LEN}-character Postgres identifier limit`);
+    }
+    if (!CHANNEL_REGEX.test(channel)) {
+        throw new errors_js_1.ValidationError(`[turbine] Invalid $listen/$notify channel "${channel}" — must match /^[A-Za-z_][A-Za-z0-9_]*$/ ` +
+            '(letters, digits, underscores; cannot start with a digit)');
+    }
+}
+/**
+ * Acquire a dedicated connection, run `LISTEN "channel"`, and wire the handler.
+ *
+ * @param pool        the pg-compatible pool to check a long-lived client out of
+ * @param channel     channel name — MUST already be validated by the caller
+ * @param quotedChannel  the channel run through quoteIdent (interpolated into SQL)
+ * @param handler     called with each notification's payload
+ * @param onClosed    invoked when the subscription releases, so the client can
+ *                    drop it from its active-subscription registry
+ */
+async function createSubscription(pool, channel, quotedChannel, handler, onClosed) {
+    let client;
+    try {
+        client = (await pool.connect());
+    }
+    catch (err) {
+        throw (0, errors_js_1.wrapPgError)(err);
+    }
+    // Verify the checked-out client can actually receive async notifications.
+    // Stateless HTTP drivers return a client with no `.on` — LISTEN would hang
+    // forever waiting for messages that can never arrive, so fail loudly now and
+    // give the connection straight back.
+    if (typeof client.on !== 'function') {
+        client.release?.();
+        throw new errors_js_1.ConnectionError('[turbine] $listen requires a persistent connection that can push notifications. ' +
+            'The configured pool returned a client with no event support (stateless HTTP drivers ' +
+            'like Neon HTTP / Vercel Postgres cannot LISTEN). Use a TCP pg.Pool for LISTEN/NOTIFY.');
+    }
+    const onNotification = (msg) => {
+        // pg delivers ALL notifications for the connection to every listener; a
+        // dedicated connection only ever LISTENs on one channel, but guard anyway.
+        if (msg.channel === channel) {
+            handler(msg.payload ?? '');
+        }
+    };
+    try {
+        client.on('notification', onNotification);
+        await client.query(`LISTEN ${quotedChannel}`);
+    }
+    catch (err) {
+        client.removeListener?.('notification', onNotification);
+        client.release?.();
+        throw (0, errors_js_1.wrapPgError)(err);
+    }
+    let closed = false;
+    const sub = {
+        channel,
+        async unsubscribe() {
+            if (closed)
+                return;
+            closed = true;
+            try {
+                await client.query(`UNLISTEN ${quotedChannel}`);
+            }
+            catch (err) {
+                // Best-effort: the connection may already be dead. Still detach +
+                // release below so we don't leak the pool slot.
+                client.removeListener?.('notification', onNotification);
+                client.release?.();
+                onClosed(sub);
+                throw (0, errors_js_1.wrapPgError)(err);
+            }
+            client.removeListener?.('notification', onNotification);
+            client.release?.();
+            onClosed(sub);
+        },
+        _forceRelease() {
+            if (closed)
+                return;
+            closed = true;
+            client.removeListener?.('notification', onNotification);
+            // Destroy the connection (release(true)) rather than return it to the pool:
+            // we skip UNLISTEN here (the pool is being torn down), so a recycled
+            // connection would otherwise carry a stale LISTEN registration. Destroying
+            // it guarantees no pooled backend keeps receiving NOTIFY traffic. Matters
+            // most for external/serverless pools, where disconnect() is a no-op and the
+            // pool outlives this client.
+            client.release?.(true);
+            onClosed(sub);
+        },
+    };
+    return sub;
+}

package/dist/cjs/schema-builder.js

@@ -27,6 +27,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.camelToSnake = exports.column = exports.ColumnBuilder = void 0;
 exports.defineSchema = defineSchema;
 exports.table = table;
+exports.applyManyToManyRelations = applyManyToManyRelations;
 /** Maps shorthand names to actual Postgres type strings */
 const TYPE_MAP = {
     serial: 'BIGSERIAL',
@@ -102,7 +103,17 @@ function defineSchema(input) {
             const raw = value;
             const columns = {};
             let pk;
+            let m2m;
             for (const [fieldName, def] of Object.entries(raw)) {
+                if (fieldName === 'manyToMany') {
+                    if (def !== undefined) {
+                        if (!Array.isArray(def)) {
+                            throw new Error(`Table "${accessor}": "manyToMany" must be an array of relation declarations`);
+                        }
+                        m2m = def;
+                    }
+                    continue;
+                }
                 if (fieldName === 'primaryKey') {
                     // Top-level composite primary key declaration
                     if (def !== undefined) {
@@ -142,6 +153,7 @@ function defineSchema(input) {
                 accessor,
                 columns,
                 ...(pk && pk.length > 0 ? { primaryKey: pk } : {}),
+                ...(m2m && m2m.length > 0 ? { manyToMany: m2m } : {}),
             };
         }
     }
@@ -303,6 +315,80 @@ function table(columns) {
     return { name: '', accessor: '', columns: built };
 }
 // ---------------------------------------------------------------------------
+// Explicit many-to-many: merge declared relations into introspected metadata
+// ---------------------------------------------------------------------------
+/**
+ * Merge the explicit `manyToMany` declarations from a code-first {@link SchemaDef}
+ * into an introspected {@link SchemaMetadata}, returning a new metadata object
+ * with the `manyToMany` {@link RelationDef}s added.
+ *
+ * This is the runtime bridge for the code-first m2m API: `defineSchema` only
+ * produces DDL, so after `introspect()`ing the live database you call this to
+ * attach the m2m relations you declared. It is PURELY ADDITIVE — existing
+ * belongsTo/hasMany/hasOne relations are preserved, and a declared relation is
+ * skipped (not overwritten) if its name already exists on the source table.
+ *
+ * @example
+ * ```ts
+ * const def = defineSchema({
+ *   posts: { id: { type: 'serial', primaryKey: true },
+ *            manyToMany: [{ name: 'tags', target: 'tags', through: 'postsTags',
+ *                           sourceKey: 'postId', targetKey: 'tagId' }] },
+ *   tags:  { id: { type: 'serial', primaryKey: true } },
+ *   postsTags: { postId: { type: 'integer', references: 'posts.id' },
+ *                tagId:  { type: 'integer', references: 'tags.id' },
+ *                primaryKey: ['postId', 'tagId'] },
+ * });
+ * let meta = await introspect({ connectionString });
+ * meta = applyManyToManyRelations(meta, def);
+ * ```
+ */
+function applyManyToManyRelations(meta, def) {
+    // Map accessor (camelCase key) → DDL snake_case table name.
+    const accessorToTable = new Map();
+    for (const [accessor, t] of Object.entries(def.tables)) {
+        accessorToTable.set(accessor, t.name);
+    }
+    const resolveTable = (accessor) => accessorToTable.get(accessor) ?? camelToSnakeLocal(accessor);
+    const resolveCols = (k) => {
+        if (Array.isArray(k))
+            return k.map(camelToSnakeLocal);
+        return camelToSnakeLocal(k);
+    };
+    // Deep-ish clone of the tables we touch so the input metadata is not mutated.
+    const tables = { ...meta.tables };
+    for (const tableDef of Object.values(def.tables)) {
+        if (!tableDef.manyToMany || tableDef.manyToMany.length === 0)
+            continue;
+        const sourceTable = tableDef.name;
+        const sourceMeta = tables[sourceTable];
+        if (!sourceMeta)
+            continue; // table not present in introspected metadata — skip
+        const relations = { ...sourceMeta.relations };
+        for (const m of tableDef.manyToMany) {
+            // Additive-only: never clobber an existing relation name.
+            if (relations[m.name])
+                continue;
+            const ref = m.references ?? 'id';
+            relations[m.name] = {
+                type: 'manyToMany',
+                name: m.name,
+                from: sourceTable,
+                to: resolveTable(m.target),
+                referenceKey: resolveCols(ref),
+                foreignKey: resolveCols(ref),
+                through: {
+                    table: resolveTable(m.through),
+                    sourceKey: resolveCols(m.sourceKey),
+                    targetKey: resolveCols(m.targetKey),
+                },
+            };
+        }
+        tables[sourceTable] = { ...sourceMeta, relations };
+    }
+    return { ...meta, tables };
+}
+// ---------------------------------------------------------------------------
 // Helpers
 // ---------------------------------------------------------------------------
 var schema_js_1 = require("./schema.js");

package/dist/cjs/schema.js

@@ -76,6 +76,16 @@ const PG_TO_TS = {
     // TSVector
     tsvector: 'string',
     tsquery: 'string',
+    // pgvector — embeddings. Mapped to `number[]` for DX (the natural shape an app
+    // passes when inserting / comparing embeddings). NOTE: like `numeric` above,
+    // there is a runtime caveat — pg has no built-in parser for the `vector` type,
+    // so over the wire a fetched vector arrives as a string literal like
+    // '[1,2,3]' unless the app registers its own parser (e.g. via pgvector's
+    // `registerType`). Turbine never auto-registers one (no side-effecting type
+    // parsers outside the client constructor). The query-side helpers (KNN
+    // orderBy, distance WHERE) always bind the query vector as a `$n::vector`
+    // param, so writing/comparing is unaffected by the read-side caveat.
+    vector: 'number[]',
 };
 const DATE_TYPES = new Set(['timestamptz', 'timestamp', 'date']);
 const PG_TO_ARRAY = {

package/dist/cjs/typed-sql.js

@@ -0,0 +1,149 @@
+"use strict";
+/**
+ * turbine-orm — Typed raw SQL (Turbine's answer to Prisma's TypedSQL)
+ *
+ * `client.raw()` returns untyped rows. This module adds a *typed* escape hatch:
+ * a generic tagged template where the caller supplies the row shape, and the
+ * builder yields a typed result that can be awaited as an array of rows, or
+ * narrowed to a single row (`.one()`) or a single scalar value (`.scalar()`).
+ *
+ * Design goals & guarantees:
+ *
+ *  1. **Compile-time only types.** `T` is supplied by the caller and never
+ *     validated at runtime — exactly like Prisma's TypedSQL and the existing
+ *     `raw<T>()`. Postgres still returns whatever the SQL selects; the generic
+ *     is a convenience for autocomplete and downstream type-checking.
+ *
+ *  2. **Mandatory parameterization.** Only the *static* string segments of the
+ *     template literal ever reach the SQL text. Every interpolated `${value}`
+ *     becomes a `$N` placeholder and is passed in the params array — it is
+ *     impossible to string-concatenate a value into the query through this API.
+ *     This is the whole point of the tagged-template shape: the literal segments
+ *     are frozen by the compiler (`TemplateStringsArray`), and the only way to
+ *     get a runtime value into the query is via `${...}`, which we bind.
+ *
+ *  3. **Rows are returned as-is (no snake→camel mapping).** This matches the
+ *     existing `client.raw()` behavior: a typed raw query is a literal escape
+ *     hatch, so the result columns are whatever your `SELECT` names them. Alias
+ *     columns in SQL (`SELECT created_at AS "createdAt"`) if you want camelCase.
+ *
+ * @example
+ * ```ts
+ * // Awaited directly -> rows
+ * const rows = await db.sql<{ id: number; name: string }>`
+ *   SELECT id, name FROM users WHERE org_id = ${orgId}
+ * `;
+ * //    ^? { id: number; name: string }[]
+ *
+ * // .one() -> single row or null
+ * const user = await db.sql<{ id: number; name: string }>`
+ *   SELECT id, name FROM users WHERE id = ${userId}
+ * `.one();
+ * //    ^? { id: number; name: string } | null
+ *
+ * // .scalar() -> first column of first row, or null
+ * const total = await db.sql<{ count: number }>`
+ *   SELECT COUNT(*)::int AS count FROM users WHERE org_id = ${orgId}
+ * `.scalar();
+ * //    ^? number | null
+ * ```
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TypedSqlQuery = void 0;
+exports.buildTypedSql = buildTypedSql;
+const errors_js_1 = require("./errors.js");
+/**
+ * Build a `(sql, params)` pair from a tagged-template invocation.
+ *
+ * Each interpolated value is replaced by a positional `$N` placeholder and
+ * pushed to the params array in order. The static string segments are the only
+ * thing concatenated into the SQL text. This is the single point that
+ * guarantees parameterization for the entire typed-SQL surface.
+ *
+ * Exported for unit testing the parameterization invariant without a database.
+ */
+function buildTypedSql(strings, values) {
+    // The tagged-template API guarantees `strings.length === values.length + 1`.
+    // Guard the directly-callable (exported) surface so a mismatched call can't
+    // silently desync `$N` placeholders from params (pg would reject it, but fail
+    // loudly here instead).
+    if (strings.length !== values.length + 1) {
+        throw new errors_js_1.ValidationError(`[turbine] sql template segment/value count mismatch: ${strings.length} segments, ${values.length} values.`);
+    }
+    let sql = '';
+    for (let i = 0; i < strings.length; i++) {
+        sql += strings[i];
+        if (i < values.length) {
+            sql += `$${i + 1}`;
+        }
+    }
+    return { sql, params: values.slice() };
+}
+/**
+ * A pending typed raw SQL query. Implements the thenable contract, so it can be
+ * `await`ed directly to get `T[]`, or refined via `.one()` / `.scalar()` first.
+ *
+ * The query is executed lazily and exactly once per terminal call (`then`,
+ * `one`, `scalar`). Each terminal method runs the query independently — this is
+ * an escape hatch, not a cached query object, so don't call two terminals on
+ * the same builder expecting a single round-trip; build a fresh template each
+ * time (the common pattern is `await db.sql\`...\`` inline).
+ */
+class TypedSqlQuery {
+    pool;
+    sql;
+    params;
+    logging;
+    constructor(pool, sql, params, logging) {
+        this.pool = pool;
+        this.sql = sql;
+        this.params = params;
+        this.logging = logging;
+    }
+    /** Execute and return all rows. Internal; powers `then`, `one`, and `scalar`. */
+    async run() {
+        if (this.logging) {
+            console.log(`[turbine] Typed SQL: ${this.sql.trim().substring(0, 120)}...`);
+        }
+        try {
+            const result = await this.pool.query(this.sql, this.params);
+            return result.rows;
+        }
+        catch (err) {
+            throw (0, errors_js_1.wrapPgError)(err);
+        }
+    }
+    /**
+     * PromiseLike implementation: `await db.sql<T>\`...\`` resolves to `T[]`.
+     */
+    // biome-ignore lint/suspicious/noThenProperty: intentional thenable — this IS the PromiseLike contract that makes `await db.sql\`...\`` resolve to rows
+    then(onfulfilled, onrejected) {
+        return this.run().then(onfulfilled, onrejected);
+    }
+    /**
+     * Execute and return the first row, or `null` if the query returns no rows.
+     * Use for queries you expect to match at most one row.
+     */
+    async one() {
+        const rows = await this.run();
+        return rows.length > 0 ? rows[0] : null;
+    }
+    /**
+     * Execute and return the first column of the first row, or `null` if there
+     * are no rows. Useful for `SELECT COUNT(*)`, `SELECT EXISTS(...)`, etc.
+     *
+     * The generic `V` defaults to the value type of `T`'s first property, but you
+     * can override it: `db.sql<{ count: number }>\`...\`.scalar<number>()`.
+     */
+    async scalar() {
+        const rows = await this.run();
+        if (rows.length === 0)
+            return null;
+        const first = rows[0];
+        const keys = Object.keys(first);
+        if (keys.length === 0)
+            return null;
+        return first[keys[0]];
+    }
+}
+exports.TypedSqlQuery = TypedSqlQuery;

package/dist/cli/index.d.ts

@@ -13,6 +13,7 @@
  *   turbine seed                  — Run seed file
  *   turbine status                — Show schema summary
  *   turbine studio                — Launch local read-only web UI
+ *   turbine observe               — Launch metrics dashboard (requires TURBINE_OBSERVE_URL)
  *
  * Usage:
  *   DATABASE_URL=postgres://... npx turbine generate

package/dist/cli/index.js

@@ -13,6 +13,7 @@
  *   turbine seed                  — Run seed file
  *   turbine status                — Show schema summary
  *   turbine studio                — Launch local read-only web UI
+ *   turbine observe               — Launch metrics dashboard (requires TURBINE_OBSERVE_URL)
  *
  * Usage:
  *   DATABASE_URL=postgres://... npx turbine generate
@@ -28,6 +29,7 @@ import { schemaDiff, schemaPush } from '../schema-sql.js';
 import { configTemplate, findConfigFile, loadConfig, resolveConfig } from './config.js';
 import { needsTsLoader, registerTsLoader } from './loader.js';
 import { createMigration, listMigrationFiles, migrateDown, migrateStatus, migrateUp } from './migrate.js';
+import { startObserve } from './observe.js';
 import { startStudio } from './studio.js';
 import { banner, blue, bold, box, cyan, dim, divider, elapsed, error, table as formatTable, gray, green, header, info, label, magenta, newline, red, redactUrl, Spinner, success, symbols, warn, yellow, } from './ui.js';
 function parseArgs() {
@@ -970,6 +972,65 @@ async function cmdStudio(args, config) {
     });
 }
 // ---------------------------------------------------------------------------
+// Command: observe
+// ---------------------------------------------------------------------------
+async function cmdObserve(args) {
+    banner();
+    const url = process.env.TURBINE_OBSERVE_URL;
+    if (!url) {
+        error('TURBINE_OBSERVE_URL environment variable is required for the observe command.');
+        newline();
+        console.log(`  ${dim('Set it to the Postgres connection string where metrics are stored.')}`);
+        console.log(`  ${dim('Example:')} ${cyan('TURBINE_OBSERVE_URL=postgres://... npx turbine observe')}`);
+        newline();
+        process.exit(1);
+    }
+    const port = args.port ?? 4984;
+    const host = args.host ?? '127.0.0.1';
+    const openBrowser = !args.noOpen;
+    if (!Number.isFinite(port) || port <= 0 || port > 65535) {
+        console.log(red(`✗ invalid port: ${args.port}`));
+        process.exit(1);
+    }
+    if (host !== '127.0.0.1' && host !== 'localhost' && host !== '::1') {
+        console.log(warn(`Observe is binding to ${yellow(host)} — this is NOT loopback. ` +
+            `Anyone on your network who can reach this port + guess the session token can read your metrics.`));
+    }
+    const spinner = new Spinner('Connecting to metrics database').start();
+    let handle;
+    try {
+        handle = await startObserve({ url, port, host, openBrowser });
+        spinner.succeed('Observe dashboard is running');
+    }
+    catch (err) {
+        spinner.fail(`Failed to start Observe: ${err instanceof Error ? err.message : String(err)}`);
+        process.exit(1);
+    }
+    newline();
+    console.log(box([
+        `${bold('Turbine Observe')}  ${dim('— query metrics dashboard')}`,
+        '',
+        `  ${cyan('URL:')}  ${bold(handle.url)}`,
+        '',
+        dim('Open the URL above in your browser. Press Ctrl+C to stop.'),
+    ].join('\n'), { title: bold(cyan('Observe')), padding: 1 }));
+    newline();
+    await new Promise((resolve) => {
+        const shutdown = async () => {
+            console.log(dim('\n  shutting down…'));
+            try {
+                await handle.dispose();
+            }
+            catch {
+                /* ignore */
+            }
+            resolve();
+        };
+        process.once('SIGINT', shutdown);
+        process.once('SIGTERM', shutdown);
+    });
+}
+// ---------------------------------------------------------------------------
 // Subcommand help
 // ---------------------------------------------------------------------------
 function showSubcommandHelp(command) {
@@ -1253,6 +1314,9 @@ async function main() {
             case 'studio':
                 await cmdStudio(args, config);
                 break;
+            case 'observe':
+                await cmdObserve(args);
+                break;
             default:
                 error(`Unknown command: ${bold(args.command)}`);
                 newline();

package/dist/cli/observe-ui.d.ts

@@ -0,0 +1,2 @@
+export declare const OBSERVE_HTML = "<!doctype html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"utf-8\" />\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n  <meta name=\"color-scheme\" content=\"dark\" />\n  <title>Turbine Observe</title>\n  <style>\n    :root {\n      --bg: #0a0a0b;\n      --bg-elev: #111113;\n      --bg-hover: #1a1a1d;\n      --border: #26262b;\n      --text: #e6e6ea;\n      --text-dim: #8a8a93;\n      --accent: #60a5fa;\n      --green: #4ade80;\n      --red: #f87171;\n      --orange: #fb923c;\n      --purple: #a78bfa;\n      --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n      --sans: system-ui, -apple-system, sans-serif;\n      --radius: 6px;\n    }\n    * { margin: 0; padding: 0; box-sizing: border-box; }\n    body { background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 14px; padding: 24px; }\n    h1 { font-size: 20px; margin-bottom: 4px; }\n    .subtitle { color: var(--text-dim); margin-bottom: 24px; }\n    .controls { display: flex; gap: 8px; margin-bottom: 24px; }\n    .controls button {\n      background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius);\n      color: var(--text); padding: 6px 12px; cursor: pointer; font-size: 13px;\n    }\n    .controls button.active { border-color: var(--accent); color: var(--accent); }\n    .card {\n      background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius);\n      padding: 16px; margin-bottom: 16px;\n    }\n    .card h2 { font-size: 14px; color: var(--text-dim); margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.5px; }\n    table { width: 100%; border-collapse: collapse; font-family: var(--mono); font-size: 12px; }\n    th { text-align: left; padding: 6px 8px; color: var(--text-dim); border-bottom: 1px solid var(--border); }\n    td { padding: 6px 8px; border-bottom: 1px solid var(--border); }\n    .num { text-align: right; }\n    .error-rate { color: var(--red); }\n    .low-error { color: var(--green); }\n    svg { width: 100%; height: 200px; }\n    .chart-line { fill: none; stroke-width: 1.5; }\n    .line-avg { stroke: var(--accent); }\n    .line-p95 { stroke: var(--orange); }\n    .line-p99 { stroke: var(--red); }\n    .legend { display: flex; gap: 16px; margin-top: 8px; font-size: 12px; color: var(--text-dim); }\n    .legend span::before { content: ''; display: inline-block; width: 12px; height: 2px; margin-right: 4px; vertical-align: middle; }\n    .legend .l-avg::before { background: var(--accent); }\n    .legend .l-p95::before { background: var(--orange); }\n    .legend .l-p99::before { background: var(--red); }\n    .empty { color: var(--text-dim); text-align: center; padding: 40px; }\n  </style>\n</head>\n<body>\n  <h1>Turbine Observe</h1>\n  <p class=\"subtitle\">Query performance metrics</p>\n  <div class=\"controls\">\n    <button data-range=\"1h\" class=\"active\">1h</button>\n    <button data-range=\"6h\">6h</button>\n    <button data-range=\"24h\">24h</button>\n    <button data-range=\"7d\">7d</button>\n  </div>\n  <div class=\"card\" id=\"latency-card\">\n    <h2>Latency over time</h2>\n    <div id=\"chart\"></div>\n    <div class=\"legend\">\n      <span class=\"l-avg\">avg</span>\n      <span class=\"l-p95\">p95</span>\n      <span class=\"l-p99\">p99</span>\n    </div>\n  </div>\n  <div class=\"card\" id=\"models-card\">\n    <h2>Top models</h2>\n    <div id=\"models-table\"></div>\n  </div>\n  <div class=\"card\" id=\"errors-card\">\n    <h2>Error rates</h2>\n    <div id=\"errors-table\"></div>\n  </div>\n  <script>\n    let currentRange = '1h';\n    const token = document.cookie.match(/turbine_observe_token=([a-f0-9]+)/)?.[1] || '';\n    const headers = { 'x-turbine-token': token };\n\n    document.querySelector('.controls').addEventListener('click', e => {\n      if (e.target.tagName !== 'BUTTON') return;\n      document.querySelectorAll('.controls button').forEach(b => b.classList.remove('active'));\n      e.target.classList.add('active');\n      currentRange = e.target.dataset.range;\n      refresh();\n    });\n\n    async function fetchJson(path) {\n      const res = await fetch(path, { headers });\n      if (!res.ok) return null;\n      return res.json();\n    }\n\n    function buildSvgPath(points, width, height, maxY) {\n      if (points.length === 0) return '';\n      const xStep = width / Math.max(points.length - 1, 1);\n      return points.map((y, i) => {\n        const px = i * xStep;\n        const py = height - (y / maxY) * height;\n        return (i === 0 ? 'M' : 'L') + px.toFixed(1) + ',' + py.toFixed(1);\n      }).join(' ');\n    }\n\n    function renderChart(data) {\n      const el = document.getElementById('chart');\n      if (!data || data.length === 0) { el.innerHTML = '<p class=\"empty\">No data yet</p>'; return; }\n      const width = 800; const height = 180;\n      const allVals = data.flatMap(d => [d.avg_ms, d.p95_ms, d.p99_ms]);\n      const maxY = Math.max(...allVals, 1) * 1.1;\n      const avgPath = buildSvgPath(data.map(d => d.avg_ms), width, height, maxY);\n      const p95Path = buildSvgPath(data.map(d => d.p95_ms), width, height, maxY);\n      const p99Path = buildSvgPath(data.map(d => d.p99_ms), width, height, maxY);\n      el.innerHTML = '<svg viewBox=\"0 0 ' + width + ' ' + height + '\" preserveAspectRatio=\"none\">'\n        + '<path class=\"chart-line line-avg\" d=\"' + avgPath + '\"/>'\n        + '<path class=\"chart-line line-p95\" d=\"' + p95Path + '\"/>'\n        + '<path class=\"chart-line line-p99\" d=\"' + p99Path + '\"/>'\n        + '</svg>';\n    }\n\n    function renderModels(data) {\n      const el = document.getElementById('models-table');\n      if (!data || data.length === 0) { el.innerHTML = '<p class=\"empty\">No data yet</p>'; return; }\n      let html = '<table><thead><tr><th>Model</th><th>Action</th><th class=\"num\">Count</th><th class=\"num\">Avg (ms)</th><th class=\"num\">P95 (ms)</th><th class=\"num\">P99 (ms)</th></tr></thead><tbody>';\n      for (const row of data) {\n        html += '<tr><td>' + row.model + '</td><td>' + row.action + '</td>'\n          + '<td class=\"num\">' + row.count + '</td>'\n          + '<td class=\"num\">' + row.avg_ms.toFixed(1) + '</td>'\n          + '<td class=\"num\">' + row.p95_ms.toFixed(1) + '</td>'\n          + '<td class=\"num\">' + row.p99_ms.toFixed(1) + '</td></tr>';\n      }\n      html += '</tbody></table>';\n      el.innerHTML = html;\n    }\n\n    function renderErrors(data) {\n      const el = document.getElementById('errors-table');\n      if (!data || data.length === 0) { el.innerHTML = '<p class=\"empty\">No errors</p>'; return; }\n      let html = '<table><thead><tr><th>Model</th><th>Action</th><th class=\"num\">Total</th><th class=\"num\">Errors</th><th class=\"num\">Rate</th></tr></thead><tbody>';\n      for (const row of data) {\n        const rate = row.count > 0 ? (row.error_count / row.count * 100).toFixed(1) : '0.0';\n        const cls = parseFloat(rate) > 5 ? 'error-rate' : 'low-error';\n        html += '<tr><td>' + row.model + '</td><td>' + row.action + '</td>'\n          + '<td class=\"num\">' + row.count + '</td>'\n          + '<td class=\"num\">' + row.error_count + '</td>'\n          + '<td class=\"num ' + cls + '\">' + rate + '%</td></tr>';\n      }\n      html += '</tbody></table>';\n      el.innerHTML = html;\n    }\n\n    async function refresh() {\n      const [latency, models] = await Promise.all([\n        fetchJson('/api/latency?range=' + currentRange),\n        fetchJson('/api/models?range=' + currentRange),\n      ]);\n      renderChart(latency);\n      renderModels(models);\n      // Derive errors from models data\n      const withErrors = (models || []).filter(m => m.error_count > 0);\n      renderErrors(withErrors);\n    }\n\n    refresh();\n    setInterval(refresh, 60000);\n  </script>\n</body>\n</html>";
+//# sourceMappingURL=observe-ui.d.ts.map