api_binding_ui 2.0.2 → 3.0.0

package/dist/index.js

@@ -1,27 +1,22 @@
 import {
   catalogFromOpenApi2,
-  localStorageAdapter2,
-  memoryAdapter2,
-  toManifest2,
+  CatalogLoadError2,
+  catalogFromText2,
+  loadCatalog2,
+  ID2,
+  parseBindingsFile2,
+  screenOf2,
+  fromFile2,
+  toFile2,
+  memoryStore2,
+  httpStore2,
+  flat,
   createEngine2,
   validateRegistry2,
-  validateBindings2,
-  useBindingRuntime,
-  BindingProvider2
-} from "./index-3q1vx729.js";
+  validateBindings2
+} from "./index-jj8twdw9.js";
 // src/framework/expr.ts
-var PIPE = /^([A-Za-z_][\w-]*)\((.*)\)$/;
 var cache = new Map;
-function parseArg(raw) {
-  const t = raw.trim();
-  if (!t)
-    return;
-  try {
-    return JSON.parse(t);
-  } catch {
-    return t;
-  }
-}
 function segments(path) {
   return path.replace(/\[(\*|\d+)\]/g, ".$1").split(".").filter(Boolean);
 }
@@ -29,320 +24,488 @@ function parse(expr) {
   const hit = cache.get(expr);
   if (hit)
     return hit;
-  const [main, ...rest] = expr.split("|");
-  const segs = segments(main.trim());
-  if (!segs.length)
-    throw new Error(`Empty expression: "${expr}"`);
-  const width = segs[0] === "$item" || segs[0].startsWith("$") && !["$context", "$steps"].includes(segs[0]) ? 1 : 2;
-  const pipes = rest.map((p) => {
-    const m = PIPE.exec(p.trim());
-    if (!m)
-      throw new Error(`Bad transform "${p.trim()}" in "${expr}"`);
-    return { name: m[1], args: m[2] ? m[2].split(",").map(parseArg) : [] };
-  });
-  const parsed = { head: segs.slice(0, width), path: segs.slice(width), pipes };
+  const e = expr.trim();
+  let parsed;
+  if (e.startsWith("$")) {
+    const segs = segments(e);
+    const [h, id] = segs;
+    if (h === "$item")
+      parsed = { head: { type: "item" }, path: segs.slice(1) };
+    else if ((h === "$context" || h === "$steps") && id)
+      parsed = { head: { type: h === "$context" ? "context" : "steps", id }, path: segs.slice(2) };
+    else
+      throw new Error(`Unknown source "${h}" in "${expr}".`);
+  } else {
+    const colon = e.indexOf(":");
+    if (colon < 1)
+      throw new Error(`"${expr}" must read "<componentId>:<slot>".`);
+    const [slot, ...path] = segments(e.slice(colon + 1));
+    if (!slot)
+      throw new Error(`"${expr}" names no slot.`);
+    parsed = { head: { type: "slot", component: e.slice(0, colon), slot }, path };
+  }
   cache.set(expr, parsed);
   return parsed;
 }
-function walk(value, path) {
-  let v = value;
-  for (let i = 0;i < path.length; i++) {
-    if (v == null)
-      return;
-    if (path[i] === "*") {
-      if (!Array.isArray(v))
-        return;
-      const rest = path.slice(i + 1);
-      return v.map((x) => walk(x, rest));
-    }
+// src/codegen/helpers.ts
+var HELPERS = `import { useMutation, useQuery } from "@tanstack/react-query";
+
+/** Data for a slot. \`bound\` is false when no API feeds it; keep the UI's own value then. */
+export interface Data<T> { bound: boolean; data: T | undefined; loading: boolean; error: unknown }
+/** An action. \`run\` rejects when a call fails; it resolves at once when no API is connected. */
+export interface Action { bound: boolean; run: (payload?: any) => Promise<void>; running: boolean; error: unknown }
+/** A per-item value, such as a cell in a row. */
+export interface Cell<T> { bound: boolean; read: (item: any) => T | undefined }
+
+export const UNBOUND_DATA: Data<never> = { bound: false, data: undefined, loading: false, error: undefined };
+export const UNBOUND_ACTION: Action = { bound: false, run: async () => {}, running: false, error: undefined };
+export const UNBOUND_CELL: Cell<never> = { bound: false, read: () => undefined };
+
+export class ApiError extends Error {
+  constructor(readonly status: number, readonly data: unknown) { super(\`API call failed (\${status})\`); this.name = "ApiError"; }
+}
+
+/** Reads a path; "*" maps the rest of the path over a list. */
+export function at(value: unknown, path: readonly string[]): any {
+  let v: any = value;
+  for (let i = 0; i < path.length; i++) {
+    if (v == null) return undefined;
+    if (path[i] === "*") return Array.isArray(v) ? v.map(x => at(x, path.slice(i + 1))) : undefined;
     v = v[path[i]];
   }
   return v;
 }
-function evaluate(expr, scope) {
-  const { head, path, pipes } = parse(expr);
-  let root;
-  if (head[0] === "$item")
-    root = scope.item;
-  else if (head[0] === "$context")
-    root = scope.context?.[head[1]];
-  else if (head[0] === "$steps")
-    root = scope.steps?.[head[1]];
-  else if (head[0].startsWith("$"))
-    root = scope.providers?.[head[0].slice(1)];
-  else
-    root = scope.slot(head[0], head[1]);
-  let value = walk(root, path);
-  for (const p of pipes) {
-    const fn = scope.transforms?.[p.name];
-    if (!fn)
-      throw new Error(`Unknown transform "${p.name}" in "${expr}"`);
-    value = fn(value, ...p.args);
-  }
-  return value;
-}
-// src/framework/runner.ts
-class BindingError extends Error {
-  detail;
-  constructor(message, detail) {
-    super(message);
-    this.detail = detail;
-    this.name = "BindingError";
+
+/** The body of a client response; throws on a non-2xx status. Passes through clients that return the body. */
+export function ok(res: any): any {
+  if (res && typeof res === "object" && typeof res.status === "number" && "data" in res && "headers" in res) {
+    if (res.status < 200 || res.status >= 300) throw new ApiError(res.status, res.data);
+    return res.data;
   }
+  return res;
 }
-function setPointer(target, keys, value) {
-  let node = target;
-  keys.slice(0, -1).forEach((k) => {
-    node = node[k] ??= {};
-  });
-  node[keys[keys.length - 1]] = value;
+
+/** True when every required input has a value. */
+export const has = (inputs: Record<string, unknown>) => Object.values(inputs).every(v => v !== undefined);
+
+/** Throws when a required input has no value. */
+export function need(operation: string, inputs: Record<string, unknown>) {
+  const missing = Object.keys(inputs).filter(k => inputs[k] === undefined);
+  if (missing.length) throw new Error(\`\${operation}: missing \${missing.join(", ")}\`);
 }
-var decode = (k) => k.replace(/~1/g, "/").replace(/~0/g, "~");
-function buildRequest(op, request, scope) {
-  const out = { method: op.method, path: op.path, query: {}, headers: {} };
-  let body;
-  for (const [pointer, expr] of Object.entries(request)) {
-    const value = evaluate(expr, scope);
-    if (value === undefined)
-      continue;
-    const [, where, ...rest] = pointer.split("/");
-    const keys = rest.map(decode);
-    if (where === "path")
-      out.path = out.path.replace(`{${keys[0]}}`, encodeURIComponent(String(value)));
-    else if (where === "query")
-      out.query[keys[0]] = String(value);
-    else if (where === "header")
-      out.headers[keys[0]] = String(value);
-    else if (where === "body") {
-      if (!keys.length)
-        out.body = value;
-      else
-        setPointer(body ??= {}, keys, value);
-    }
+
+/** Drops undefined values. */
+export const defined = (o: Record<string, unknown>): any => Object.fromEntries(Object.entries(o).filter(([, v]) => v !== undefined));
+
+export const path = (v: unknown): any => (v === undefined ? undefined : encodeURIComponent(String(v)));
+
+/** A body from a base value and [keys, value] entries; undefined values are skipped. */
+export function assemble(base: unknown, entries: Array<[string[], unknown]>): any {
+  const out: any = base && typeof base === "object" ? { ...base } : {};
+  for (const [keys, value] of entries) {
+    if (value === undefined) continue;
+    let node = out;
+    keys.slice(0, -1).forEach(k => { node = node[k] = node[k] && typeof node[k] === "object" ? { ...node[k] } : {}; });
+    node[keys[keys.length - 1]] = value;
   }
-  if (body)
-    out.body = { ...out.body, ...body };
-  const missing = op.parameters.filter((p) => p.required && !((p.pointer in request) && evaluate(request[p.pointer], scope) !== undefined));
-  if (missing.length)
-    throw new BindingError(`Missing required input: ${missing.map((p) => p.name).join(", ")}.`);
   return out;
 }
-var requestKey = (r) => JSON.stringify([r.method, r.path, r.query, r.body ?? null]);
-function select(response, selector) {
-  const path = selector.replace(/^\$\.?/, "").replace(/\[\*\]$/, "").split(".").filter(Boolean);
-  return path.reduce((v, k) => v == null ? undefined : v[k], response);
-}
-function mapItems(data, binding, scope) {
-  if (!binding.map || !Object.keys(binding.map).length)
-    return data;
-  const one = (item) => ({
-    ...item && typeof item === "object" ? item : {},
-    ...Object.fromEntries(Object.entries(binding.map).map(([k, e]) => [k, evaluate(e, { ...scope, item })]))
-  });
+
+/** Adds mapped fields to each item, keeping the fields the API returned. */
+export function mapItems(data: any, map: (item: any) => Record<string, unknown>): any {
+  const one = (item: any) => ({ ...(item && typeof item === "object" ? item : {}), ...map(item) });
   return Array.isArray(data) ? data.map(one) : data == null ? data : one(data);
 }
-async function runConsume(binding, op, scope, fetcher) {
-  const response = await fetcher(buildRequest(op, binding.request, scope), op);
-  return mapItems(select(response, binding.select), binding, scope);
+
+export const list = (v: unknown): unknown[] => (Array.isArray(v) ? v : v === undefined ? [] : [v]);
+
+export function finish(failed: unknown[]) {
+  if (failed.length === 1) throw failed[0];
+  if (failed.length) throw new AggregateError(failed, \`\${failed.length} API calls failed\`);
 }
-async function runSteps(steps, operations, scope, fetcher) {
-  const outcomes = [];
-  const results = { ...scope.steps };
-  for (const step of steps) {
-    const op = operations.get(step.operation);
-    if (!op)
-      throw new BindingError(`Operation "${step.operation}" is not in the catalog.`);
-    const items = step.forEach ? evaluate(step.forEach, scope) : [scope.item];
-    const list = Array.isArray(items) ? items : [items];
-    const responses = [];
-    let failed = false;
-    for (const item of list) {
-      try {
-        responses.push(await fetcher(buildRequest(op, step.request, { ...scope, item, steps: results }), op));
-      } catch (error) {
-        failed = true;
-        outcomes.push({ step: step.id, ok: false, error });
-        if (step.onError === "stop")
-          return outcomes;
-      }
-    }
-    const response = step.forEach ? responses : responses[0];
-    results[step.id] = { response };
-    if (!failed)
-      outcomes.push({ step: step.id, ok: true, response });
-  }
-  return outcomes;
+
+export function useData<T>(key: readonly unknown[], fetch: () => Promise<unknown>, select: (data: any) => T, options: { enabled: boolean; everySeconds?: number }): Data<T> {
+  const q = useQuery({ queryKey: key, queryFn: fetch, select, enabled: options.enabled, refetchInterval: options.everySeconds ? options.everySeconds * 1000 : false });
+  return { bound: true, data: q.data, loading: q.isLoading, error: q.error ?? undefined };
 }
-// src/runtime/BindingScreen.tsx
-import * as React from "react";
 
-// src/runtime/screenStore.ts
-function createScreenStore() {
-  const values = new Map;
-  const listeners = new Set;
-  return {
-    get: (b, s) => values.get(`${b}.${s}`),
-    set(b, s, value) {
-      const k = `${b}.${s}`;
-      if (Object.is(values.get(k), value))
-        return;
-      values.set(k, value);
-      listeners.forEach((l) => l());
-    },
-    subscribe(l) {
-      listeners.add(l);
-      return () => {
-        listeners.delete(l);
-      };
-    }
-  };
+export function useAction(run: (payload?: any) => Promise<void>): Action {
+  const m = useMutation({ mutationFn: run });
+  return { bound: true, run: payload => m.mutateAsync(payload), running: m.isPending, error: m.error ?? undefined };
 }
+`;
 
-// src/runtime/BindingScreen.tsx
-import { jsx } from "react/jsx-runtime";
-var ScreenContext = React.createContext(null);
-var ShownContext = React.createContext(true);
-function useScreen() {
-  const s = React.useContext(ScreenContext);
-  if (!s)
-    throw new Error("Use binding hooks inside <BindingScreen id=…>.");
-  return s;
+// src/codegen/generate.ts
+var GENERATED_MARK = "@generated";
+var HEADER = `// ${GENERATED_MARK} Do not edit: change the bindings and regenerate.
+`;
+var words = (s) => s.split(/[.\-_]+/).filter(Boolean);
+var pascal = (s) => words(s).map((w) => w[0].toUpperCase() + w.slice(1)).join("");
+var camel = (s) => {
+  const p = pascal(s);
+  return p[0].toLowerCase() + p.slice(1);
+};
+var str = (v) => JSON.stringify(v);
+var IDENT = /^[A-Za-z_$][\w$]*$/;
+var prop = (k) => IDENT.test(k) ? k : str(k);
+var orvalName = (id) => IDENT.test(id) ? id[0].toLowerCase() + id.slice(1) : camel(id);
+function tsType(schema, many = false, depth = 0) {
+  const one = () => {
+    if (!schema || typeof schema !== "object" || depth > 3)
+      return "any";
+    const s = schema;
+    if (Array.isArray(s.enum) && s.enum.length && s.enum.every((v) => typeof v === "string"))
+      return s.enum.map(str).join(" | ");
+    switch (s.type) {
+      case "string":
+        return "string";
+      case "integer":
+      case "number":
+        return "number";
+      case "boolean":
+        return "boolean";
+      case "array":
+        return `Array<${tsType(s.items, false, depth + 1)}>`;
+      case "object": {
+        const props = Object.entries(s.properties ?? {});
+        if (!props.length)
+          return "Record<string, any>";
+        return `{ ${props.map(([k, v]) => `${prop(k)}?: ${tsType(v, false, depth + 1)}`).join("; ")}; [key: string]: any }`;
+      }
+      default:
+        return "any";
+    }
+  };
+  return many ? `Array<${one()}>` : one();
 }
-function BindingActive({ value, children }) {
-  const parent = React.useContext(ShownContext);
-  return /* @__PURE__ */ jsx(ShownContext.Provider, {
-    value: parent && value,
-    children
-  });
+function compileExpr(expr, cx, scope, at) {
+  let p;
+  try {
+    p = parse(expr);
+  } catch (e) {
+    cx.issue("expr.invalid", e.message, at);
+    return "undefined";
+  }
+  const path = p.path.map(str);
+  const h = p.head;
+  const read = (root, keys) => {
+    cx.use.add("at");
+    return `at(${root}, [${keys.join(", ")}])`;
+  };
+  if (h.type === "item") {
+    if (!scope.item) {
+      cx.issue("expr.no-item", `"${expr}" reads $item, which this slot does not have.`, at);
+      return "undefined";
+    }
+    return path.length ? read("item", path) : "item";
+  }
+  if (h.type === "context") {
+    if (!cx.screen.context.some((c) => c.id === h.id)) {
+      cx.issue("expr.unknown-context", `"${expr}": ${cx.screen.id} declares no context "${h.id}".`, at);
+      return "undefined";
+    }
+    return read("state.context", [str(h.id), ...path]);
+  }
+  if (h.type === "steps") {
+    if (!scope.steps?.has(h.id)) {
+      cx.issue("expr.unknown-step", `"${expr}" reads step "${h.id}", which does not run before it.`, at);
+      return "undefined";
+    }
+    return read("steps", [str(h.id), ...path]);
+  }
+  if (!cx.produces.get(h.component)?.has(h.slot)) {
+    cx.issue("expr.unknown-slot", `"${expr}" reads a value that is not produced on ${cx.screen.id}.`, at);
+    return "undefined";
+  }
+  return read("state", [str(cx.keys.get(h.component)), str(h.slot), ...path]);
 }
-var NO_CONTEXT = {};
-function BindingScreen({ id, context = NO_CONTEXT, children }) {
-  const [store] = React.useState(createScreenStore);
-  const shown = React.useContext(ShownContext);
-  const { loadSaved, mountScreen } = useBindingRuntime();
-  React.useEffect(() => {
-    loadSaved(id);
-  }, [loadSaved, id]);
-  React.useEffect(() => mountScreen(id, shown), [mountScreen, id, shown]);
-  const scope = React.useMemo(() => ({ id, store, context }), [id, store, context]);
-  return /* @__PURE__ */ jsx(ScreenContext.Provider, {
-    value: scope,
-    children
+var decode = (k) => k.replace(/~1/g, "/").replace(/~0/g, "~");
+function compileCall(op, request, cx, scope, at) {
+  const e = (x) => compileExpr(x, cx, scope, at);
+  const known = new Set(op.parameters.map((p) => p.pointer));
+  const body = [];
+  let whole;
+  const query = [];
+  const headers = [];
+  for (const [pointer, x] of Object.entries(request)) {
+    const [, where, ...rest] = pointer.split("/");
+    const keys = rest.map(decode);
+    if (where === "body") {
+      if (!op.body) {
+        cx.issue("request.no-body", `${op.id} takes no body, but "${pointer}" is set.`, at);
+        continue;
+      }
+      if (!keys.length)
+        whole = e(x);
+      else
+        body.push(`[[${keys.map(str).join(", ")}], ${e(x)}]`);
+    } else if (!known.has(pointer))
+      cx.issue("request.unknown-input", `${op.id} has no input "${pointer}".`, at);
+    else if (where === "query")
+      query.push(`${prop(keys[0])}: ${e(x)}`);
+    else if (where === "header")
+      headers.push(`${str(keys[0])}: ${e(x)}`);
+  }
+  const args = [...op.path.matchAll(/\{([^}]+)\}/g)].map((m) => {
+    const x = request[`/path/${m[1]}`];
+    if (x === undefined) {
+      cx.issue("request.missing-path", `${op.id} needs "${m[1]}" in its path; it is not connected.`, at);
+      return "undefined";
+    }
+    cx.use.add("path");
+    return `path(${e(x)})`;
   });
+  if (op.body) {
+    const set = new Set(Object.keys(request).filter((k) => k.startsWith("/body/")).map((k) => decode(k.split("/")[2])));
+    const gaps = whole ? [] : (flat(op.body.schema).required ?? []).filter((f) => !set.has(f));
+    if (gaps.length)
+      cx.warn("request.required-body", `${op.id} requires ${gaps.join(", ")} in its body; not connected.`, at);
+    cx.use.add("assemble");
+    args.push(`assemble(${whole ?? "undefined"}, [${body.join(", ")}])`);
+  }
+  if (op.parameters.some((p) => p.pointer.startsWith("/query/"))) {
+    cx.use.add("defined");
+    args.push(`defined({ ${query.join(", ")} })`);
+  }
+  const key = `[${[str(op.id), ...args].join(", ")}]`;
+  if (headers.length) {
+    cx.use.add("defined");
+    args.push(`{ headers: defined({ ${headers.join(", ")} }) }`);
+  }
+  const required = op.parameters.filter((p) => p.required).map((p) => `${prop(p.name)}: ${request[p.pointer] === undefined ? "undefined" : e(request[p.pointer])}`);
+  return { fn: orvalName(op.id), call: `${orvalName(op.id)}(${args.join(", ")})`, key, required: required.length ? `{ ${required.join(", ")} }` : "" };
 }
-// src/runtime/hooks.ts
-import * as React2 from "react";
-function scopeOf(runtime, screen, item) {
-  return { slot: screen.store.get, context: screen.context, providers: runtime.providers(), transforms: runtime.transforms, item };
-}
-function useProduce(bindId, slot, value) {
-  const { store } = useScreen();
-  React2.useEffect(() => {
-    store.set(bindId, slot, value);
-  }, [store, bindId, slot, value]);
-}
-var WAIT = "\x00wait:";
-function useSlot(bindId, slot) {
-  const runtime = useBindingRuntime();
-  const screen = useScreen();
-  const binding = runtime.binding(screen.id, bindId, slot);
-  const [nonce, setNonce] = React2.useState(0);
-  const [state, setState] = React2.useState({ key: "", status: "loading" });
-  const snapshot = React2.useCallback(() => {
-    if (!binding)
-      return "";
-    try {
-      const scope = scopeOf(runtime, screen);
-      if (binding.type === "expression")
-        return JSON.stringify(evaluate(binding.value, scope) ?? null);
-      if (binding.type !== "operation")
-        return "";
-      const op = runtime.operations.get(binding.operation);
-      return op ? requestKey(buildRequest(op, binding.request, scope)) : WAIT + "operation missing";
-    } catch (e) {
-      return WAIT + (e instanceof Error ? e.message : String(e));
+var selectPath = (selector) => segments(selector.replace(/^\$\.?/, "").replace(/\[\*\]$/, ""));
+function compileSteps(steps, cx, at, ops, imports) {
+  const done = new Set;
+  const blocks = [];
+  let usesPayload = false;
+  cx.use.add("ok");
+  cx.use.add("finish");
+  for (const st of steps) {
+    const op = ops.get(st.operation);
+    if (!op) {
+      cx.issue("catalog.operation-missing", `${st.operation} is not in the API docs.`, at);
+      continue;
     }
-  }, [binding, runtime, screen]);
-  const key = React2.useSyncExternalStore(screen.store.subscribe, snapshot, snapshot);
-  React2.useEffect(() => {
-    if (!binding || binding.type !== "operation" || !key || key.startsWith(WAIT))
-      return;
-    const op = runtime.operations.get(binding.operation);
-    const scope = scopeOf(runtime, screen);
-    const request = buildRequest(op, binding.request, scope);
-    const k = requestKey(request);
-    let live = true;
-    setState((s) => ({ key, status: "loading", data: s.data }));
-    let p = nonce ? undefined : runtime.inflight.get(k);
-    if (!p) {
-      p = runtime.fetcher(request, op).finally(() => runtime.inflight.delete(k));
-      runtime.inflight.set(k, p);
+    const scope = { item: true, steps: done };
+    const call = compileCall(op, st.request, cx, scope, at);
+    imports.add(call.fn);
+    const each = st.forEach ? compileExpr(st.forEach, cx, scope, at) : undefined;
+    if (each)
+      cx.use.add("list");
+    else
+      usesPayload = true;
+    if (call.required)
+      cx.use.add("need");
+    const readsItem = /\bitem\b/.test(call.call + call.required);
+    blocks.push([
+      `    {`,
+      `      const responses: unknown[] = [];`,
+      `      for (const item of ${each ? `list(${each})` : "[payload]"}) {`,
+      readsItem ? "" : `        void item;`,
+      `        try {`,
+      call.required ? `          need(${str(op.id)}, ${call.required});` : "",
+      `          responses.push(ok(await ${call.call}));`,
+      `        } catch (error) {`,
+      st.onError === "stop" ? `          throw error;` : `          failed.push(error);`,
+      `        }`,
+      `      }`,
+      `      steps[${str(st.id)}] = { response: ${each ? "responses" : "responses[0]"} };`,
+      `    }`
+    ].filter(Boolean).join(`
+`));
+    done.add(st.id);
+  }
+  return [
+    `async (${usesPayload ? "payload" : "_payload"}?: any) => {`,
+    `    const steps: Record<string, unknown> = {};`,
+    `    const failed: unknown[] = [];`,
+    ...blocks,
+    `    finish(failed);`,
+    `  }`
+  ].join(`
+`);
+}
+function generate(file, catalog) {
+  const issues = [];
+  const { fw, index, issues: fileIssues } = fromFile2(file, catalog);
+  const valid = validateRegistry2(fw);
+  issues.push(...fileIssues, ...valid.issues);
+  const ops = new Map(catalog.operations.map((o) => [o.id, o]));
+  const DESC = new Map(fw.descriptors.map((d) => [d.kind, d]));
+  const client = file.output?.client;
+  if (!client)
+    issues.push({ severity: "error", screen: "", code: "output.missing", message: `Set "output": { "dir", "client" } in the bindings file.` });
+  const files = [{ path: "screen-helpers.ts", content: HEADER + HELPERS }];
+  const exports = [];
+  for (const screen of valid.registry.screens) {
+    const name = pascal(screen.id);
+    const keys = new Map;
+    const taken = new Map;
+    for (const c of screen.components) {
+      const k = camel(c.bindId.slice(screen.id.length + 1));
+      if (taken.has(k))
+        issues.push({ severity: "error", screen: screen.id, component: c.bindId, code: "codegen.name-clash", message: `"${c.bindId}" and "${taken.get(k)}" both become "${k}".` });
+      taken.set(k, c.bindId);
+      keys.set(c.bindId, k);
     }
-    p.then((res) => {
-      if (live)
-        setState({ key, status: "ready", data: mapItems(select(res, binding.select), binding, scope) });
-    }, (error) => {
-      if (live)
-        setState({ key, status: "error", error });
-    });
-    return () => {
-      live = false;
+    const cx = {
+      screen,
+      keys,
+      use: new Set,
+      produces: new Map(screen.components.map((c) => [c.bindId, new Set(DESC.get(c.kind).slots.filter((s) => s.role === "produce").map((s) => s.id))])),
+      issue: (code, message, at) => issues.push({ severity: "error", screen: screen.id, code, message, ...at }),
+      warn: (code, message, at) => issues.push({ severity: "warning", screen: screen.id, code, message, ...at })
     };
-  }, [binding, key, nonce, runtime, screen]);
-  const reload = React2.useCallback(() => setNonce((n) => n + 1), []);
-  if (!binding || binding.type === "steps" || binding.type === "none")
-    return { status: "unbound", data: undefined, error: undefined, reload };
-  if (binding.type === "expression")
-    return { status: "ready", data: key ? JSON.parse(key) : undefined, error: undefined, reload };
-  if (key.startsWith(WAIT))
-    return { status: "waiting", data: undefined, error: new BindingError(key.slice(WAIT.length)), reload };
-  return { status: state.key === key ? state.status : "loading", data: state.data, error: state.error, reload };
-}
-function useCell(bindId, slot) {
-  const runtime = useBindingRuntime();
-  const screen = useScreen();
-  const binding = runtime.binding(screen.id, bindId, slot);
-  return React2.useCallback((item) => binding?.type === "expression" ? evaluate(binding.value, scopeOf(runtime, screen, item)) : undefined, [binding, runtime, screen]);
-}
-function useTrigger(bindId, slot) {
-  const runtime = useBindingRuntime();
-  const screen = useScreen();
-  const binding = runtime.binding(screen.id, bindId, slot);
-  const [running, setRunning] = React2.useState(false);
-  const run = React2.useCallback(async (item) => {
-    if (binding?.type !== "steps")
-      return [];
-    setRunning(true);
-    try {
-      return await runSteps(binding.steps, runtime.operations, scopeOf(runtime, screen, item), runtime.fetcher);
-    } finally {
-      setRunning(false);
+    const bindings = new Map;
+    for (const b of index[screen.id] ?? []) {
+      if (!keys.has(b.component)) {
+        cx.issue("binding.unknown-component", `A binding names "${b.component}", which is not registered.`, b);
+        continue;
+      }
+      if (b.state !== "confirmed") {
+        issues.push({ severity: "warning", screen: screen.id, component: b.component, slot: b.slot, code: "binding.draft", message: `${b.component} · ${b.slot} is a draft; it is not generated.` });
+        continue;
+      }
+      bindings.set(`${b.component}|${b.slot}`, b);
     }
-  }, [binding, runtime, screen]);
-  return { bound: binding?.type === "steps" || binding?.type === "none", running, run };
+    const imports = new Set;
+    const types = new Set;
+    const body = [];
+    const ret = [];
+    const apiType = [];
+    const stateType = [];
+    for (const c of screen.components) {
+      const d = DESC.get(c.kind);
+      const k = keys.get(c.bindId);
+      const produce = d.slots.filter((s) => s.role === "produce");
+      if (produce.length)
+        stateType.push(`  ${prop(k)}?: { ${produce.map((s) => `${prop(s.id)}?: ${tsType(s.schema, s.many)}`).join("; ")} };`);
+      const out = [];
+      const outT = [];
+      const unbound = (slot, v) => {
+        cx.use.add(v);
+        out.push(`${prop(slot)}: ${v}`);
+      };
+      for (const s of d.slots.filter((x) => x.role !== "produce")) {
+        const b = bindings.get(`${c.bindId}|${s.id}`);
+        const at = { component: c.bindId, slot: s.id };
+        const v = `${k}${pascal(s.id)}`;
+        if (s.role === "trigger") {
+          types.add("Action");
+          outT.push(`${prop(s.id)}: Action`);
+          if (b?.type !== "steps") {
+            unbound(s.id, "UNBOUND_ACTION");
+            continue;
+          }
+          cx.use.add("useAction");
+          body.push(`  const ${v} = useAction(${compileSteps(b.steps, cx, at, ops, imports)});`);
+          out.push(`${prop(s.id)}: ${v}`);
+          continue;
+        }
+        const T = tsType(s.schema, s.many);
+        if (s.scope) {
+          types.add("Cell");
+          outT.push(`${prop(s.id)}: Cell<${T}>`);
+          if (b?.type !== "expression") {
+            unbound(s.id, "UNBOUND_CELL");
+            continue;
+          }
+          out.push(`${prop(s.id)}: { bound: true, read: (item: any) => ${compileExpr(b.value, cx, { item: true }, at)} }`);
+          continue;
+        }
+        types.add("Data");
+        outT.push(`${prop(s.id)}: Data<${T}>`);
+        if (b?.type === "expression") {
+          out.push(`${prop(s.id)}: { bound: true, data: ${compileExpr(b.value, cx, { item: false }, at)}, loading: false, error: undefined }`);
+          continue;
+        }
+        const op = b?.type === "operation" ? ops.get(b.operation) : undefined;
+        if (b?.type === "operation" && !op)
+          cx.issue("catalog.operation-missing", `${b.operation} is not in the API docs.`, at);
+        if (b?.type !== "operation" || !op) {
+          unbound(s.id, "UNBOUND_DATA");
+          continue;
+        }
+        const call = compileCall(op, b.request, cx, { item: false }, at);
+        imports.add(call.fn);
+        ["useData", "ok"].forEach((h) => cx.use.add(h));
+        if (call.required)
+          cx.use.add("has");
+        const sel = selectPath(b.select).map(str);
+        if (sel.length)
+          cx.use.add("at");
+        const picked = sel.length ? `at(data, [${sel.join(", ")}])` : "data";
+        const map = Object.entries(b.map ?? {});
+        if (map.length)
+          cx.use.add("mapItems");
+        const select = map.length ? `mapItems(${picked}, (item: any) => ({ ${map.map(([f, x]) => `${prop(f)}: ${compileExpr(x, cx, { item: true }, at)}`).join(", ")} }))` : picked;
+        const every = typeof b.load === "object" ? `, everySeconds: ${b.load.everySeconds}` : "";
+        body.push(`  const ${v} = useData<${T}>(${call.key}, async () => ok(await ${call.call}), (data: any) => ${select}, { enabled: ${call.required ? `has(${call.required})` : "true"}${every} });`);
+        out.push(`${prop(s.id)}: ${v}`);
+      }
+      if (out.length) {
+        ret.push(`    ${prop(k)}: { ${out.join(", ")} },`);
+        apiType.push(`  ${prop(k)}: { ${outT.join("; ")} };`);
+      }
+    }
+    if (screen.context.length)
+      stateType.push(`  context?: { ${screen.context.map((c) => `${prop(c.id)}?: ${"schema" in c.shape ? tsType(c.shape.schema, c.many) : c.many ? "Array<any>" : "any"}`).join("; ")} };`);
+    const usesState = [...body, ...ret].some((l) => /\bstate\b/.test(l));
+    const lines = [
+      HEADER.trimEnd(),
+      imports.size ? `import { ${[...imports].sort().join(", ")} } from ${str(client ?? "")};` : null,
+      cx.use.size ? `import { ${[...cx.use].sort().join(", ")} } from "./screen-helpers";` : null,
+      types.size ? `import type { ${[...types].sort().join(", ")} } from "./screen-helpers";` : null,
+      "",
+      `/** ${screen.label}: values its components produce, and what it was opened with. */`,
+      stateType.length ? `export interface ${name}State {
+${stateType.join(`
+`)}
+}` : `export type ${name}State = Record<string, never>;`,
+      "",
+      `export interface ${name}Api {
+${apiType.join(`
+`)}
+}`,
+      "",
+      `/** API data and actions for ${screen.label} (${screen.id}). */`,
+      `export function use${name}Api(${usesState ? "state" : "_state"}: ${name}State = {}): ${name}Api {`,
+      ...body,
+      `  return {`,
+      ...ret,
+      `  };`,
+      `}`,
+      ""
+    ].filter((l) => l !== null);
+    files.push({ path: `${screen.id}.ts`, content: lines.join(`
+`) });
+    exports.push(`export * from "./${screen.id}";`);
+  }
+  files.push({ path: "index.ts", content: HEADER + exports.join(`
+`) + `
+` });
+  return { files, issues };
 }
 export {
-  BindingActive,
-  BindingError,
-  BindingProvider2 as BindingProvider,
-  BindingScreen,
-  buildRequest,
+  CatalogLoadError2 as CatalogLoadError,
+  ID2 as ID,
   catalogFromOpenApi2 as catalogFromOpenApi,
+  catalogFromText2 as catalogFromText,
   createEngine2 as createEngine,
-  evaluate,
-  localStorageAdapter2 as localStorageAdapter,
-  memoryAdapter2 as memoryAdapter,
-  runConsume,
-  runSteps,
-  select,
-  toManifest2 as toManifest,
-  useCell,
-  useProduce,
-  useSlot,
-  useTrigger,
+  fromFile2 as fromFile,
+  generate,
+  httpStore2 as httpStore,
+  loadCatalog2 as loadCatalog,
+  memoryStore2 as memoryStore,
+  parseBindingsFile2 as parseBindingsFile,
+  parse as parseExpression,
+  screenOf2 as screenOf,
+  toFile2 as toFile,
   validateBindings2 as validateBindings,
   validateRegistry2 as validateRegistry
 };
 
-//# debugId=64D1E40B946F01F764756E2164756E21
+//# debugId=BEA7AA51ED34223764756E2164756E21
 //# sourceMappingURL=index.js.map