@ggui-ai/ui-gen 0.19.0 → 0.20.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ggui-ai/ui-gen",
-  "version": "0.19.0",
+  "version": "0.20.0",
   "description": "UI generation harness for ggui — the LLM system prompt, multi-turn coding loop, and evaluation engine that turn a DataContract into a React component. Implements the UiGenerator contract from @ggui-ai/mcp-server-core; consumed by @ggui-ai/mcp-server.",
   "license": "Apache-2.0",
   "keywords": [
@@ -188,9 +188,9 @@
     "puppeteer-core": "^24.40.0 || ^25.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
-    "@ggui-ai/mcp-server-core": "0.19.0",
-    "@ggui-ai/project-config": "0.19.0",
-    "@ggui-ai/protocol": "0.19.0"
+    "@ggui-ai/project-config": "0.20.0",
+    "@ggui-ai/mcp-server-core": "0.20.0",
+    "@ggui-ai/protocol": "0.20.0"
   },
   "peerDependenciesMeta": {
     "@google/adk": {
@@ -229,11 +229,11 @@
     "openai": "^7.9.0",
     "typescript": "^5.0.0",
     "zod": "^4.3.6",
-    "@ggui-ai/design": "0.19.0",
-    "@ggui-ai/gadgets": "0.19.0",
-    "@ggui-ai/sandbox": "0.19.0",
-    "@ggui-ai/wire": "0.19.0",
-    "@ggui-ai/ui-visual-tester": "0.19.0"
+    "@ggui-ai/gadgets": "0.20.0",
+    "@ggui-ai/design": "0.20.0",
+    "@ggui-ai/sandbox": "0.20.0",
+    "@ggui-ai/ui-visual-tester": "0.20.0",
+    "@ggui-ai/wire": "0.20.0"
   },
   "devDependencies": {
     "@google/adk": "^2.0.0",
@@ -248,9 +248,9 @@
     "react-dom": "^19.0.0",
     "tsup": "^8.5.0",
     "vitest": "^3.2.6",
-    "@ggui-ai/mcp-server-core": "0.19.0",
-    "@ggui-ai/project-config": "0.19.0",
-    "@ggui-ai/protocol": "0.19.0"
+    "@ggui-ai/project-config": "0.20.0",
+    "@ggui-ai/protocol": "0.20.0",
+    "@ggui-ai/mcp-server-core": "0.20.0"
   },
   "engines": {
     "node": ">=22.0.0"

package/src/adapters/openai/raw.ts

@@ -10,6 +10,7 @@ import { GeneratorAdapter, hasCredentials } from '../base';
 import type { AdapterConfig, GenerateParams } from '../base';
 import type { AdapterResult, ToolDefinition, ProviderName, AdapterMode } from '../types';
 import { zodToJsonSchema } from '../tool-bridge';
+import { splitOpenAiUsage } from './tokens';
 import {
   createCapture,
   captureSourceCode,
@@ -54,6 +55,9 @@ export class OpenAiRawAdapter extends GeneratorAdapter {
     const capture = createCapture();
     let totalInputTokens = 0;
     let totalOutputTokens = 0;
+    // OpenAI's input token count INCLUDES cached tokens; track the cached
+    // subset so tokens.input reports NON-cached input (ggui#1186).
+    let totalCachedInputTokens = 0;
     let turnsUsed = 0;
     let allTextOutput = '';
 
@@ -74,6 +78,8 @@ export class OpenAiRawAdapter extends GeneratorAdapter {
       if (response.usage) {
         totalInputTokens += response.usage.input_tokens ?? 0;
         totalOutputTokens += response.usage.output_tokens ?? 0;
+        totalCachedInputTokens +=
+          response.usage.input_tokens_details?.cached_tokens ?? 0;
       }
 
       // Process output items
@@ -156,11 +162,11 @@ export class OpenAiRawAdapter extends GeneratorAdapter {
       sourceCode: capture.sourceCode,
       stream: capture.stream,
       generatorMeta: capture.generatorMeta,
-      tokens: {
-        input: totalInputTokens,
-        output: totalOutputTokens,
-        total: totalInputTokens + totalOutputTokens,
-      },
+      ...splitOpenAiUsage(
+        totalInputTokens,
+        totalOutputTokens,
+        totalCachedInputTokens,
+      ),
       generationTimeMs: Date.now() - startTime,
       turnsUsed,
     };

package/src/adapters/openai/sdk.ts

@@ -6,6 +6,7 @@
 import { GeneratorAdapter, hasCredentials } from '../base';
 import type { AdapterConfig, GenerateParams } from '../base';
 import type { AdapterResult, ProviderName, AdapterMode } from '../types';
+import { splitOpenAiUsage } from './tokens';
 import {
   createCapture,
   captureSourceCode,
@@ -87,17 +88,19 @@ export class OpenAiSdkAdapter extends GeneratorAdapter {
     const usage = result.state.usage;
     const inputTokens = usage.inputTokens;
     const outputTokens = usage.outputTokens;
+    // OpenAI's input token count INCLUDES cached tokens; sum the cached
+    // subset across per-request details (ggui#1186).
+    const cachedInputTokens = (usage.inputTokensDetails ?? []).reduce(
+      (sum, details) => sum + (details.cached_tokens ?? 0),
+      0,
+    );
 
     return {
       compiledCode: capture.compiledCode,
       sourceCode: capture.sourceCode,
       stream: capture.stream,
       generatorMeta: capture.generatorMeta,
-      tokens: {
-        input: inputTokens,
-        output: outputTokens,
-        total: inputTokens + outputTokens,
-      },
+      ...splitOpenAiUsage(inputTokens, outputTokens, cachedInputTokens),
       generationTimeMs: Date.now() - startTime,
       turnsUsed: result.rawResponses?.length ?? 0,
     };

package/src/adapters/openai/tokens.ts

@@ -0,0 +1,49 @@
+import type { AdapterResult } from '../types';
+
+/**
+ * Split an OpenAI usage report into the shared cross-adapter token
+ * convention (ggui#1186).
+ *
+ * OpenAI reports the cached prompt tokens as a SUBSET already counted
+ * inside its input token total (`usage.input_tokens` on the Responses
+ * API, `usage.inputTokens` on the Agents SDK, both INCLUDING cached
+ * tokens). Anthropic (and OpenRouter's Anthropic passthrough) instead
+ * report `input_tokens` EXCLUDING cache reads, with cache reads as a
+ * separate field.
+ *
+ * The whole fleet reads one convention: **`tokens.input` is the
+ * NON-cached input; `cacheReadTokens` is the cache-hit subset.** Cost
+ * and observability consumers price/aggregate `input` at the full input
+ * rate and `cacheReadTokens` at the cache-read rate, so the cached
+ * portion must appear in exactly one of the two — never both. Reporting
+ * OpenAI's cache-inclusive `input_tokens` as `tokens.input` while also
+ * populating `cacheReadTokens` would double-count the cached tokens (it
+ * inflates `$/gen` and breaks `render_cache_metric`'s `cacheReadPct`
+ * denominator). So the OpenAI adapters subtract the cached subset here.
+ *
+ * `total` is the full processed footprint (non-cached input + cache
+ * reads + output = `inputTokensInclCached + outputTokens`), matching the
+ * Claude adapter's `total` (input + cacheCreation + cacheRead + output);
+ * OpenAI has no explicit cache-creation step, so there is no
+ * `cacheCreationTokens` term.
+ */
+export function splitOpenAiUsage(
+  inputTokensInclCached: number,
+  outputTokens: number,
+  cachedTokens: number,
+): { tokens: AdapterResult['tokens']; cacheReadTokens: number } {
+  // Never let a malformed usage report drive input negative.
+  const cacheRead = Math.min(
+    Math.max(cachedTokens, 0),
+    Math.max(inputTokensInclCached, 0),
+  );
+  const nonCachedInput = Math.max(inputTokensInclCached, 0) - cacheRead;
+  return {
+    tokens: {
+      input: nonCachedInput,
+      output: outputTokens,
+      total: nonCachedInput + cacheRead + outputTokens,
+    },
+    cacheReadTokens: cacheRead,
+  };
+}

package/src/adapters/types.ts

@@ -88,7 +88,7 @@ export interface AdapterResult {
   subagentsUsed?: string[];
   /** Tokens written to prompt cache (Claude-specific) */
   cacheCreationTokens?: number;
-  /** Tokens read from prompt cache (Claude-specific) */
+  /** Tokens read from prompt cache (Claude / OpenRouter / OpenAI). */
   cacheReadTokens?: number;
   /** SDK session ID for evaluation loop resume (Claude SDK-specific) */
   sdkSessionId?: string;

package/src/evaluation/axis-checks/checks/universal.ts

@@ -8,6 +8,7 @@ import { LUCIDE_ICON_NAMES, maxWidth as CONTAINER_MAX_WIDTH } from "@ggui-ai/des
 import { CANVAS_VIEWPORTS, type CanvasClass } from "../../../design-mode.js";
 import type { EvalIssue } from "../../types-public.js";
 import type { AxisCheck, AxisCheckInput } from "../types.js";
+import type { DataContract } from "@ggui-ai/protocol";
 import {
   getRequiredPropNames,
   mkIssue,
@@ -499,6 +500,91 @@ function runRootWidthCap(input: AxisCheckInput): EvalIssue[] {
   ];
 }
 
+// ── universal.action_label_dropped (ggui#1190 — the transcription-drop guard) ─
+// The GUARD half of #1190: the model transcribes an actionSpec label onto a
+// control but DROPS a special character ("Confirm & Schedule" → "Confirm
+// Schedule"), because the verbatim label is not at the write-site. This check
+// NAMES that class on the bench and guards regression; the fix (carry the
+// verbatim label / render it from data) lands separately, so #1190 stays open.
+// WARN-class, deterministic, and tuned to flag ONLY the high-confidence drop.
+
+const LABEL_SPECIAL_CHAR = /[^a-z0-9\s]/i;
+const normText = (s: string): string => s.toLowerCase().replace(/\s+/g, " ").trim();
+const alnumText = (s: string): string => s.toLowerCase().replace(/[^a-z0-9]/g, "");
+
+/**
+ * Extract the VISIBLE rendered text of a component — JSX text nodes (with `{…}`
+ * expression containers stripped, nesting-aware) plus visible string
+ * attributes (aria-label / placeholder / title / alt). Deliberately excludes
+ * identifiers and call args: `useAction('confirmSchedule')` and the `const
+ * confirmSchedule` binding must NOT count as the label "Confirm & Schedule"
+ * appearing, or every action would false-match its own camelCase name.
+ */
+function visibleText(sourceCode: string): string {
+  // JSX text nodes: `>text<`. Excluding `>` from the run (`[^<>]`) skips the
+  // `=>` arrow-body conflation — an arrow's `>` is followed by code then a
+  // `>`, never text then a `<`, so only true tag-close→text→tag runs match,
+  // and identifiers (`const confirmSchedule`, `useAction('confirmSchedule')`)
+  // are never between `>` and `<`. `{…}` expression children are stripped so an
+  // expression's identifiers don't count as visible text.
+  const jsx = (sourceCode.match(/>([^<>]*)</g) ?? [])
+    .map((m) => m.slice(1, -1).replace(/\{[^}]*\}/g, " "))
+    .join(" ");
+  let attrs = "";
+  const attrRx = /\b(?:aria-label|placeholder|title|alt)\s*=\s*(?:"([^"]*)"|'([^']*)')/gi;
+  let m: RegExpExecArray | null;
+  while ((m = attrRx.exec(sourceCode)) !== null) attrs += " " + (m[1] ?? m[2] ?? "");
+  return jsx + " " + attrs;
+}
+
+/**
+ * Find actionSpec labels whose special-character content was dropped from the
+ * generated source. FALSE-POSITIVE-SAFE by construction — flags ONLY when the
+ * label's alphanumeric words appear CONTIGUOUSLY in the source but the full
+ * label (with its "&", "/", "+" …) does not, i.e. a clean transcription drop.
+ * Every ambiguous shape is exempt: labels rendered from data (`.label`
+ * anywhere), labels with no special char (nothing to drop), labels present
+ * verbatim, entity-encoded `&` (`&amp;` — the words stop being contiguous, so
+ * no flag), and very short labels. Presence-ANYWHERE, not wiring-scoped, on
+ * purpose: if the label's text appears anywhere we never flag.
+ */
+export function findDroppedActionLabels(
+  sourceCode: string,
+  contract: DataContract | undefined,
+): Array<{ readonly name: string; readonly label: string }> {
+  const actionSpec = contract?.actionSpec;
+  if (actionSpec === undefined) return [];
+  // Component renders any label from data → it does not transcribe → exempt all.
+  if (/\.label\b/.test(sourceCode)) return [];
+  const vis = visibleText(sourceCode);
+  const normVis = normText(vis);
+  const alnumVis = alnumText(vis);
+  const out: Array<{ name: string; label: string }> = [];
+  for (const [name, entry] of Object.entries(actionSpec)) {
+    const label = entry.label;
+    if (typeof label !== "string" || label.length === 0 || label === name) continue;
+    if (!LABEL_SPECIAL_CHAR.test(label)) continue; // no special char → nothing to drop
+    if (alnumText(label).length < 3) continue; // too short to match confidently
+    if (normVis.includes(normText(label))) continue; // present verbatim in visible text → correct
+    // The label's words appear contiguously in the VISIBLE text but the full
+    // label (with its punctuation) does not → a character was dropped.
+    if (alnumVis.includes(alnumText(label))) out.push({ name, label });
+  }
+  return out;
+}
+
+function runActionLabelDropped(input: AxisCheckInput): EvalIssue[] {
+  if (input.compiledCode === null) return [];
+  return findDroppedActionLabels(input.sourceCode, input.contract).map(({ name, label }) =>
+    mkIssue(
+      "universal.action_label_dropped",
+      `The action "${name}" declares label "${label}", but the rendered control appears to drop its "${label.replace(/[a-z0-9\s]/gi, "").trim()}": the label's words are in the generated source, the full label is not — a transcription drop (ggui#1190).`,
+      `Render the label EXACTLY as the contract states it — button text should be the verbatim \`actionSpec.${name}.label\`, or render it from data (\`{x.label}\`), never a re-typed copy that drops "&", "/", "+", etc.`,
+      "warn",
+    ),
+  );
+}
+
 export const UNIVERSAL_CHECKS: readonly AxisCheck[] = [
   {
     id: "universal.icon_name_known",
@@ -524,6 +610,12 @@ export const UNIVERSAL_CHECKS: readonly AxisCheck[] = [
     values: ALL_RENDER_VALUES,
     run: runRootWidthCap,
   },
+  {
+    id: "universal.action_label_dropped",
+    axis: "render",
+    values: ALL_RENDER_VALUES,
+    run: runActionLabelDropped,
+  },
   {
     id: "universal.terminal_action_unguarded",
     axis: "render",

package/src/harness/check/runtime-render/render-check.ts

@@ -45,6 +45,7 @@ import {
   type ParentLink,
 } from "./host-boundary.js";
 import { hostGlobals, openRecord } from "../../../internal/open-record.js";
+import { primeInputs } from "@ggui-ai/ui-visual-tester/prime-inputs";
 
 /**
  * Module-namespace-shaped value injected into `loadComponent`'s
@@ -504,6 +505,20 @@ export async function runRenderCheckInProcess(
     let streamsChecked = 0;
 
     try {
+      // ggui#1187: prime form inputs before the action-wiring probe. A wired
+      // Send/Submit gated on a non-empty input (the chat-interface shape) is a
+      // no-op on empty, so an un-primed synthetic click never dispatches and
+      // the probe false-warns "did not dispatch it". Shared with the visual
+      // tester's primeInputs (#1021/#1040) so both prime identically. Priming
+      // sets input VALUES (not textContent) and fires input/change before the
+      // per-candidate fire-log window is opened, so it neither perturbs the
+      // prop-sensitivity text baseline nor false-positives the wiring probe.
+      // Best-effort: a priming failure must never abort the check.
+      try {
+        primeInputs(renderResult.container);
+      } catch {
+        // Un-primeable DOM falls back to the prior (un-primed) behavior.
+      }
       // ── Check 2: Action wiring (BLOCK / unverified-as-warn) ───────────
       if (input.contract?.actionSpec) {
         const actionSpec = input.contract.actionSpec;