@zackbart/connecta 0.15.1 → 0.16.0

package/src/node.ts

@@ -1,206 +0,0 @@
-import { createServer } from "node:http";
-import type { IncomingMessage, Server, ServerResponse } from "node:http";
-import { Readable } from "node:stream";
-import { pipeline } from "node:stream/promises";
-import type { Connecta } from "./index.js";
-
-export { fileStorage } from "./storage/file.js";
-export type { FileStorageOptions } from "./storage/file.js";
-
-/** 10 MiB. Tool arguments are JSON; nothing legitimate approaches this. */
-const DEFAULT_MAX_BODY_BYTES = 10 * 1024 * 1024;
-
-export interface ListenOptions {
-  port: number;
-  /** Interface to bind. Defaults to Node's own (all interfaces). */
-  host?: string;
-  /** Reject request bodies larger than this with 413. Default 10 MiB. */
-  maxBodyBytes?: number;
-  /**
-   * Stop accepting connections on SIGTERM/SIGINT, let in-flight requests
-   * finish, drain deferred work, then exit. Default true — Docker sends
-   * SIGTERM on every `compose up` recreate and Node's default is to die
-   * mid-request. Set false to install your own handlers.
-   */
-  gracefulShutdown?: boolean;
-  /** Shutdown deadline before forcing exit. Default 10s (Docker's own grace). */
-  shutdownTimeoutMs?: number;
-}
-
-const BODY_TOO_LARGE = Symbol("body-too-large");
-
-async function toRequest(
-  req: IncomingMessage,
-  maxBodyBytes: number,
-  signal: AbortSignal,
-): Promise<Request | typeof BODY_TOO_LARGE> {
-  const host = req.headers.host ?? "localhost";
-  const proto =
-    (req.headers["x-forwarded-proto"] as string | undefined) ?? "http";
-  const url = `${proto}://${host}${req.url ?? "/"}`;
-  const method = req.method ?? "GET";
-  const headers = new Headers();
-  for (const [key, value] of Object.entries(req.headers)) {
-    if (value == null) continue;
-    headers.set(key, Array.isArray(value) ? value.join(", ") : value);
-  }
-  let body: Uint8Array | undefined;
-  if (method !== "GET" && method !== "HEAD") {
-    const chunks: Buffer[] = [];
-    let size = 0;
-    for await (const chunk of req) {
-      size += (chunk as Buffer).length;
-      // Stop reading as soon as the cap is passed rather than buffering the
-      // rest of a body we have already decided to reject.
-      if (size > maxBodyBytes) return BODY_TOO_LARGE;
-      chunks.push(chunk as Buffer);
-    }
-    if (chunks.length) body = new Uint8Array(Buffer.concat(chunks));
-  }
-  return new Request(url, {
-    method,
-    headers,
-    body,
-    signal,
-    // Required by Node's fetch when sending a body stream.
-    ...(body ? { duplex: "half" } : {}),
-  } as RequestInit);
-}
-
-async function writeResponse(
-  res: ServerResponse,
-  response: Response,
-): Promise<void> {
-  res.statusCode = response.status;
-  response.headers.forEach((value, key) => res.setHeader(key, value));
-  if (!response.body) {
-    res.end();
-    return;
-  }
-  // Stream rather than buffer: a connector-served route may return a large
-  // proxied file body, and materializing it would hold the whole thing in
-  // memory before the first byte reaches the client.
-  await pipeline(
-    Readable.fromWeb(response.body as Parameters<typeof Readable.fromWeb>[0]),
-    res,
-  );
-}
-
-/**
- * Serve a Connecta over node:http. Thin adapter: IncomingMessage → Request,
- * Response → ServerResponse, plus the process-level concerns a long-running
- * container needs (body cap, response streaming, graceful shutdown). No
- * dependencies beyond node core.
- */
-export function listen(
-  connecta: Connecta,
-  portOrOptions: number | ListenOptions,
-): Server {
-  const opts: ListenOptions =
-    typeof portOrOptions === "number" ? { port: portOrOptions } : portOrOptions;
-  const maxBodyBytes = opts.maxBodyBytes ?? DEFAULT_MAX_BODY_BYTES;
-
-  // Node has no ExecutionContext, so deferred work (activity sinks) would
-  // otherwise be an untracked floating promise. Track it here and drain it on
-  // shutdown so both runtimes behave the same.
-  const pending = new Set<Promise<unknown>>();
-  const ctx = {
-    waitUntil(promise: Promise<unknown>): void {
-      pending.add(promise);
-      void promise.finally(() => pending.delete(promise));
-    },
-  };
-
-  const server = createServer((req, res) => {
-    void (async () => {
-      const controller = new AbortController();
-      const abortRequest = () => {
-        if (!controller.signal.aborted) {
-          controller.abort(new Error("HTTP client disconnected."));
-        }
-      };
-      const abortIncompleteRequest = () => {
-        if (!req.complete) abortRequest();
-      };
-      const abortIncompleteResponse = () => {
-        if (!res.writableFinished) abortRequest();
-      };
-      req.once("aborted", abortRequest);
-      req.once("close", abortIncompleteRequest);
-      res.once("close", abortIncompleteResponse);
-      try {
-        const request = await toRequest(
-          req,
-          maxBodyBytes,
-          controller.signal,
-        );
-        if (request === BODY_TOO_LARGE) {
-          res.statusCode = 413;
-          // The request stream was abandoned mid-body, so this connection
-          // cannot be reused — say so rather than leaving the client to
-          // discover it as a reset.
-          res.setHeader("Connection", "close");
-          res.end("Payload Too Large");
-          return;
-        }
-        const response = await connecta.fetch(request, undefined, ctx);
-        await writeResponse(res, response);
-      } catch (error) {
-        // A client that deliberately went away can make either the request
-        // handler or response pipeline reject. The request's abort signal is
-        // the authoritative classification: there is no caller left to answer,
-        // and logging an expected disconnect would turn cancellation into an
-        // error-log spam vector.
-        if (controller.signal.aborted) return;
-        // A headless deployment has nothing else to go on; never swallow this.
-        console.error("[connecta] request failed", error);
-        if (res.headersSent) {
-          // Mid-stream failure: appending an error string here would corrupt
-          // the partial body the client has already begun reading. Cutting
-          // the connection is the only honest signal left.
-          res.destroy();
-          return;
-        }
-        res.statusCode = 500;
-        res.end("Internal Server Error");
-      } finally {
-        req.removeListener("aborted", abortRequest);
-        req.removeListener("close", abortIncompleteRequest);
-        res.removeListener("close", abortIncompleteResponse);
-      }
-    })();
-  });
-
-  if (opts.gracefulShutdown !== false) {
-    const timeoutMs = opts.shutdownTimeoutMs ?? 10_000;
-    let shuttingDown = false;
-    const shutdown = (signal: string): void => {
-      if (shuttingDown) return;
-      shuttingDown = true;
-      console.info(`[connecta] ${signal} received, draining`);
-      const forced = setTimeout(() => {
-        console.warn("[connecta] shutdown timed out, exiting");
-        process.exit(1);
-      }, timeoutMs);
-      forced.unref?.();
-      // Stop queued/running sandbox work now, not after server.close has
-      // waited for the very requests those children are holding open.
-      const executorClose = connecta.close();
-      // close() alone waits on idle keep-alive sockets, so a single browser
-      // tab would stall every shutdown until the force-exit deadline.
-      server.closeIdleConnections();
-      server.close(() => {
-        void Promise.allSettled([...pending, executorClose]).then(() => {
-          clearTimeout(forced);
-          process.exit(0);
-        });
-      });
-    };
-    process.on("SIGTERM", () => shutdown("SIGTERM"));
-    process.on("SIGINT", () => shutdown("SIGINT"));
-  }
-
-  if (opts.host) server.listen(opts.port, opts.host);
-  else server.listen(opts.port);
-  return server;
-}

package/src/operator-ui/browser.css

@@ -1,423 +0,0 @@
-  :root {
-    color-scheme: light;
-    --ink: #000;
-    --paper: #fff;
-    --rule: #ccc;
-    --muted: #666;
-    --trace: #f5f5f5;
-    --shell: 70rem;
-    --pad: 1rem;
-    --gap: 1.5rem;
-    --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
-    --mono: ui-monospace, "SF Mono", Menlo, Monaco, "Cascadia Code", Consolas,
-      monospace;
-  }
-  * { border-radius: 0; box-sizing: border-box; }
-  html {
-    background: var(--paper);
-    color: var(--ink);
-    font-family: var(--sans);
-    font-size: 16px;
-    line-height: 1.5;
-    -webkit-font-smoothing: antialiased;
-    text-rendering: optimizeLegibility;
-  }
-  body { margin: 0; min-height: 100vh; }
-  ::selection { background: var(--ink); color: var(--paper); }
-  :is(h1, h2, h3, p, ul, ol) { margin: 0; padding: 0; }
-  :is(h1, h2, h3) { font-size: inherit; font-weight: 400; }
-  :is(ul, ol) { list-style: none; }
-  a { color: inherit; }
-  button, input { font: inherit; }
-  button {
-    background: none;
-    border: 0;
-    color: inherit;
-    cursor: pointer;
-    margin: 0;
-    padding: 0;
-    text-align: left;
-  }
-  button:disabled { cursor: wait; opacity: .5; }
-  input {
-    background: var(--paper);
-    border: 1px solid var(--rule);
-    color: var(--ink);
-    min-height: 2rem;
-    padding: .2rem .5rem;
-  }
-  input:focus-visible { outline-offset: -1px; }
-  :is(a, button, input, summary):focus-visible {
-    outline: 1px solid var(--ink);
-  }
-  :is(a, button, summary):focus-visible { outline-offset: 2px; }
-  .skip-link {
-    background: var(--paper);
-    left: var(--pad);
-    padding: .5rem;
-    position: fixed;
-    top: -4rem;
-    z-index: 10;
-  }
-  .skip-link:focus { top: var(--pad); }
-
-  .shell {
-    margin: 0 auto;
-    max-width: var(--shell);
-    padding-left: var(--pad);
-    padding-right: var(--pad);
-  }
-  .pgrid {
-    column-gap: var(--gap);
-    display: grid;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-    row-gap: 1rem;
-  }
-  .pcap { grid-column: 1; }
-  .pbody { grid-column: 2 / -1; min-width: 0; }
-  .cap, .meta { color: var(--muted); font-size: .9em; }
-  .mono { font-family: var(--mono); font-size: .78rem; }
-  .hidden { display: none !important; }
-  .visually-hidden {
-    clip: rect(0 0 0 0);
-    clip-path: inset(50%);
-    height: 1px;
-    overflow: hidden;
-    position: absolute;
-    white-space: nowrap;
-    width: 1px;
-  }
-
-  .masthead {
-    align-items: start;
-    padding-bottom: var(--pad);
-    padding-top: var(--pad);
-  }
-  .brand {
-    font-weight: 500;
-    grid-column: 1;
-    text-decoration: none;
-  }
-  .mast-nav {
-    display: flex;
-    gap: var(--gap);
-    grid-column: 2 / -1;
-    justify-content: space-between;
-    min-width: 0;
-  }
-  .mast-actions {
-    display: flex;
-    gap: var(--gap);
-    justify-content: flex-end;
-    min-width: 0;
-  }
-  .page-nav,
-  .session-actions {
-    display: flex;
-    flex-wrap: wrap;
-    gap: .5rem var(--gap);
-  }
-  .mast-actions :is(a, button) {
-    align-items: center;
-    display: inline-flex;
-    min-height: 2rem;
-  }
-  .navlink,
-  .linklike {
-    text-decoration: underline;
-    text-decoration-thickness: 1.5px;
-    text-underline-offset: .22em;
-  }
-  .navlink { text-decoration-color: transparent; }
-  .navlink:hover,
-  .navlink:focus-visible,
-  .navlink[aria-current="page"] { text-decoration-color: currentColor; }
-  .linklike { text-decoration-color: currentColor; }
-  .linklike:hover,
-  .linklike:focus-visible { text-decoration-color: transparent; }
-
-  .page { padding-bottom: 5rem; }
-  .lead { margin-top: 6rem; }
-  .section,
-  .section + .section { margin-top: 3rem; }
-  .lead-copy,
-  .body-copy { max-width: 34em; }
-  .lead-copy > * + *,
-  .body-copy > * + * { margin-top: 1.5rem; }
-  .row,
-  .actions {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--gap);
-  }
-  .row input { flex: 1; min-width: 12rem; }
-
-  .gate-actions { margin-top: 1.5rem; }
-  #err { margin-top: 1.5rem; text-decoration: underline; }
-
-  .endpoint { border-bottom: 1px solid var(--rule); border-top: 1px solid var(--rule); }
-  .endpoint-row {
-    align-items: baseline;
-    display: flex;
-    gap: var(--gap);
-    min-width: 0;
-    padding: .75rem 0;
-  }
-  .endpoint-row code {
-    flex: 1;
-    min-width: 0;
-    overflow-x: auto;
-    white-space: nowrap;
-  }
-  .endpoint-row button { flex: none; }
-
-  .connector-tools { border-bottom: 1px solid var(--rule); }
-  .toolbar { margin-bottom: 1.5rem; }
-  .toolbar input { flex-basis: 18rem; }
-  #notice { margin-bottom: .75rem; }
-  #notice:empty { display: none; }
-  #notice:not(:empty) { text-decoration: underline; }
-  #oauthNotice { margin-bottom: .75rem; }
-  #oauthNotice:empty { display: none; }
-  .error-notice, .msg { text-decoration: underline; }
-  .card,
-  .credential-card,
-  .activity-item {
-    padding-left: 1.25rem;
-    position: relative;
-  }
-  .card::before,
-  .credential-card::before,
-  .activity-item::before {
-    background: var(--rule);
-    bottom: 0;
-    content: "";
-    left: .25rem;
-    position: absolute;
-    top: 0;
-    width: 1px;
-  }
-  .card { border-top: 1px solid var(--rule); padding-bottom: .75rem; padding-top: .75rem; }
-  .connector-head {
-    display: grid;
-    gap: var(--gap);
-    grid-template-columns: minmax(0, 2fr) minmax(10rem, 1fr);
-  }
-  .connector-title {
-    align-items: baseline;
-    display: flex;
-    gap: .5rem;
-  }
-  .connector-title .dot,
-  .activity-stamp .dot {
-    margin-left: -1.25rem;
-  }
-  .activity-stamp {
-    align-items: baseline;
-    display: flex;
-    gap: .75rem;
-  }
-  .card h2 { overflow-wrap: anywhere; }
-  .connector-state { text-align: right; }
-  .dot {
-    background: var(--paper);
-    border: 1px solid var(--ink);
-    display: inline-block;
-    flex: none;
-    height: .5rem;
-    width: .5rem;
-    z-index: 1;
-  }
-  .dot.ok { background: var(--ink); }
-  .dot.auth_required {
-    background: linear-gradient(90deg, var(--ink) 50%, var(--paper) 50%);
-  }
-  .connector-description { margin-top: .25rem; max-width: 40rem; }
-  .connector-message,
-  .connector-auth { margin-top: .75rem; }
-  .credential-ledger { border-bottom: 1px solid var(--rule); }
-  .credential-card { border-top: 1px solid var(--rule); padding-bottom: .75rem; padding-top: .75rem; }
-  .credential-head {
-    align-items: baseline;
-    display: flex;
-    flex-wrap: wrap;
-    gap: .25rem var(--gap);
-    justify-content: space-between;
-  }
-  .credential-copy { margin-top: .25rem; max-width: 40rem; }
-  .credential-field-summary {
-    border-top: 1px solid var(--rule);
-    margin-top: .75rem;
-  }
-  .credential-field-summary > div {
-    border-bottom: 1px solid var(--rule);
-    display: flex;
-    flex-wrap: wrap;
-    gap: .25rem var(--gap);
-    justify-content: space-between;
-    padding: .5rem 0;
-  }
-  .credential-actions { display: flex; flex-wrap: wrap; gap: var(--gap); margin-top: .75rem; }
-  .credential-actions button,
-  .credential-form button,
-  .activity-controls button,
-  .activity-more {
-    align-items: center;
-    display: inline-flex;
-    min-height: 2.75rem;
-  }
-  .credential-form {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    gap: .75rem var(--gap);
-    margin-top: .75rem;
-  }
-  .credential-form > input { flex: 1 1 18rem; }
-  .credential-fields { display: grid; flex: 1 1 100%; gap: .75rem; }
-  .credential-field {
-    align-items: center;
-    display: grid;
-    gap: var(--gap);
-    grid-template-columns: minmax(9rem, 12rem) 1fr;
-  }
-  .credential-field input { min-width: 0; width: 100%; }
-  .danger { text-decoration-style: double; }
-
-  .token-create {
-    border-bottom: 1px solid var(--rule);
-    border-top: 1px solid var(--rule);
-    padding: .75rem 0;
-  }
-  .token-create > label {
-    display: block;
-    margin-bottom: .5rem;
-  }
-  .token-create input { flex: 1 1 18rem; }
-  .token-create button,
-  .token-card button,
-  .token-reveal button {
-    align-items: center;
-    display: inline-flex;
-    min-height: 2.75rem;
-  }
-  .token-reveal {
-    background: var(--ink);
-    color: var(--paper);
-    margin-top: 1.5rem;
-    padding: 1rem 1.25rem;
-  }
-  .token-reveal .meta,
-  .token-reveal .cap { color: #bbb; }
-  .token-reveal-head,
-  .token-card-head {
-    align-items: baseline;
-    display: flex;
-    flex-wrap: wrap;
-    gap: .25rem var(--gap);
-    justify-content: space-between;
-  }
-  .token-secret {
-    border-bottom: 1px solid #555;
-    border-top: 1px solid #555;
-    margin-top: .75rem;
-  }
-  .token-secret code {
-    color: var(--paper);
-    user-select: all;
-  }
-  .token-ledger {
-    border-bottom: 1px solid var(--rule);
-    margin-top: 1.5rem;
-  }
-  .token-card {
-    border-top: 1px solid var(--rule);
-    padding: .75rem 0 .75rem 1.25rem;
-    position: relative;
-  }
-  .token-card::before {
-    background: var(--ink);
-    bottom: 0;
-    content: "";
-    left: .25rem;
-    position: absolute;
-    top: 0;
-    width: 1px;
-  }
-  .token-card.revoked { color: var(--muted); }
-  .token-card.revoked::before { background: var(--rule); }
-
-  details { margin-top: .75rem; }
-  summary { cursor: pointer; list-style: none; width: max-content; }
-  summary::-webkit-details-marker { display: none; }
-  .tool-list { border-bottom: 1px solid var(--rule); margin-top: .5rem; }
-  .tool {
-    border-top: 1px solid var(--rule);
-    display: grid;
-    gap: .25rem var(--gap);
-    grid-template-columns: minmax(12rem, 1fr) minmax(0, 2fr);
-    padding: .5rem 0;
-  }
-  .tool code { font-family: var(--mono); font-size: .78rem; overflow-wrap: anywhere; }
-  .tool .td { color: var(--muted); font-size: .9em; }
-  .empty { border-top: 1px solid var(--rule); padding: .75rem 0; }
-
-  .activity-copy { margin-bottom: 1.5rem; }
-  .activity-controls { margin-bottom: 1.5rem; }
-  .activity-controls input { flex: 1 1 18rem; }
-  #activityNotice { margin-bottom: .75rem; }
-  .activity-ledger { border-bottom: 1px solid var(--rule); }
-  .activity-item {
-    border-top: 1px solid var(--rule);
-    display: grid;
-    gap: .25rem var(--gap);
-    grid-template-columns: minmax(9rem, .85fr) minmax(12rem, 1.4fr) minmax(8rem, .9fr);
-    padding-bottom: .75rem;
-    padding-top: .75rem;
-  }
-  .activity-time,
-  .activity-actor,
-  .activity-detail { color: var(--muted); font-size: .82rem; }
-  .activity-actor-id { color: var(--muted); margin-top: .1rem; }
-  .activity-address { font-family: var(--mono); font-size: .78rem; overflow-wrap: anywhere; }
-  .activity-outcome { font-size: .9em; }
-  .activity-item.error .activity-outcome,
-  .activity-item.timeout .activity-outcome,
-  .activity-item.cancelled .activity-outcome { text-decoration: underline; }
-  .activity-empty { border-top: 1px solid var(--rule); padding: .75rem 0; }
-  .activity-more { margin-top: .75rem; }
-  .unavailable {
-    background: var(--trace);
-    border-bottom: 1px solid var(--rule);
-    border-top: 1px solid var(--rule);
-    padding: .75rem;
-  }
-
-  @media (prefers-reduced-motion: reduce) {
-    html:focus-within { scroll-behavior: auto; }
-  }
-
-  @media (max-width: 36.99rem) {
-    .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-    .pcap,
-    .pbody { grid-column: 1 / -1; }
-    .masthead .brand { grid-column: 1; }
-    .mast-nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
-    .product { display: none; }
-    .mast-actions {
-      align-items: flex-start;
-      flex-direction: column;
-      font-size: .875rem;
-      gap: .25rem;
-    }
-    .lead { margin-top: 4rem; }
-    .section,
-    .section + .section { margin-top: 2.5rem; }
-    .connector-head,
-    .tool,
-    .activity-item { grid-template-columns: 1fr; }
-    .connector-state { text-align: left; }
-    .credential-field { align-items: start; grid-template-columns: 1fr; gap: .25rem; }
-    input { min-height: 2.75rem; }
-  }