avantgate 2.0.0 → 2.1.0

package/README.md

@@ -1,7 +1,7 @@
 # 🛡️ AvantGate (`avantgate`)
 
-> **The Zero-Infrastructure, In-Process AI Application Firewall (AI-WAF), Deterministic Workflow Engine & Privacy Guard for TypeScript.**  
-> Real-time prompt guardrails, zero-egress PII redaction, deterministic Saga workflows, anti-IDOR tool boundary, and pre-flight token defense **without hosting Docker, proxies, PostgreSQL, ClickHouse, or Redis.**
+> **The Zero-Infrastructure, In-Process AI Application Firewall (AI-WAF), Deterministic Workflow Engine, Privacy Guard & Headless UI Canvas for TypeScript.**  
+> Real-time prompt guardrails, zero-egress PII redaction, deterministic Saga workflows, canonical tool envelopes, anti-IDOR tool boundary, and pre-flight token defense **without hosting Docker, proxies, PostgreSQL, ClickHouse, or Redis.**
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
 [![TypeScript](https://img.shields.io/badge/TypeScript-Strict-blue?logo=typescript)](https://www.typescriptlang.org/)
@@ -73,7 +73,7 @@ bun run dev   # or npm run dev
 | **🛡️ Loop Shield (Anti-Cycle Guard)** | Early visual detection of recursive agent loops and aberrant repetitive tool execution cycles. |
 | **💾 Zero-External-DB SQLite Storage** | Zero setup overhead: persistent storage uses embedded SQLite (`gatewall/data/gatewall.db`) without requiring PostgreSQL, Redis, or ClickHouse. |
 
-> 💡 **Agent Integration Recipes:** See [Connecting an Agent to GateWall Cockpit](docs/examples.md#12-connecting-an-agent-to-gatewall-cockpit-gatewall) in `docs/examples.md` for complete code recipes using `HttpTelemetryExporter` (`avantgate/agent`), direct HTTP ingestion, and React front-end streaming (`avantgate/client`).
+> 💡 **Agent Integration Recipes:** See [GateWall Telemetry Recipe](examples/observability/10-gatewall-telemetry.ts) and [Integration Cookbook](examples/README.md) for complete code recipes using `HttpTelemetryExporter` (`avantgate/agent`), direct HTTP ingestion, and React front-end streaming (`avantgate/client`).
 
 ---
 
@@ -92,6 +92,7 @@ Contact our team at [contact@gatewall.fr](mailto:contact@gatewall.fr) for privat
 | 🛑 **Agent Isolation & Anti-IDOR** | • **Dual-Channel DTOs**: Streams full records to UI while injecting sanitized summaries into LLM.<br/>• **Anti-IDOR Boundary**: Compile-time tenant scoping (`createTenantTool`) & runtime ownership checks.<br/>• **Server Idempotency Guard**: Zero-infra in-process guard (`withServerIdempotency`) with memory or storage adapters.<br/>• **Infinite Loop Shield**: Detects and breaks recursive agent tool execution loops. |
 | 💰 **FinOps & Resilience** | • **Denial-of-Wallet**: Enforces hard token & USD budgets *before* external inference spend.<br/>• **Multi-Model Failover**: Instant client-side routing to fallback models or local Ollama on 429/500.<br/>• **FinOps Batch Deduplication**: Prevents double-counting of tokens & costs during network retries on GateWall.<br/>• **Live Cost Ledger**: Token burn calculation & pricing adapters with zero external DB. |
 | ⚡ **Sagas, Replay & Telemetry** | • **Deterministic Sagas (`avantgate/workflow`)**: In-process FSM with automatic reverse compensation ($k-1 \to 0$).<br/>• **In-Context Replay (`avantgate/client`)**: React hook (`useTask`) with causal parent linkage (`parentRunId`) & `Idempotency-Key`.<br/>• **Human-in-the-Loop (HITL)**: Non-blocking suspension, approval queues & fail-closed 24h SLA timeout (TTL).<br/>• **Lightweight Telemetry**: < 1.7 KB client SDK & async audit bridge to GateWall. |
+| 🎨 **Presentation Plane (`avantgate/ui`)** | • **Canonical Tool Envelopes**: Typed format carrying merge strategies (`REPLACE`, `APPEND_UNIQUE`, `UPDATE_ENTITY`) & `UIIntent`.<br/>• **Deterministic Concurrency Reducer**: Algebraic $O(N)$ Set-based convergence solving parallel tool calling races.<br/>• **React View Registry (`avantgate/ui/react`)**: Polymorphic $O(1)$ dynamic dispatch linking tools to your design system (shadcn/ui).<br/>• **Native Anti-XSS Guard**: Zero-dependency WHATWG `URL` scanner neutralizing `javascript:` & protocol-relative (`//evil.com`) vectors. |
 
 ---
 
@@ -99,14 +100,15 @@ Contact our team at [contact@gatewall.fr](mailto:contact@gatewall.fr) for privat
 
 | Category | In-Depth Guides |
 |---|---|
-| 🚀 **Quickstart** | [Getting Started](docs/getting-started.md) • [Integration Cookbook](docs/examples.md) |
+| 🚀 **Quickstart** | [Getting Started](docs/getting-started.md) • [Integration Cookbook](examples/README.md) |
 | 🛡️ **Security & AI-WAF** | [Prompt Guardrails](docs/security/prompt-guardrails.md) • [PII Redaction](docs/security/pii-redaction.md) • [Anti-IDOR Defense](docs/security/anti-idor.md) • [End-to-End Security](docs/security/end-to-end-security.md) |
 | 💰 **FinOps & Cost** | [Pre-Flight Budget Guards](docs/finops/budget-guards.md) • [Pricing Adapters & SQLite](docs/finops/pricing-adapters.md) |
 | 🤖 **Agents & Tools** | [Isolated Tools & DTOs](docs/agents/isolated-tools.md) • [Agent Runtime Manual](docs/agents/agent-runtime.md) • [Inter-Tool Chaining](docs/agents/inter-tool-chaining.md) |
 | 🔄 **Deterministic Sagas** | [Durable Workflows Engine](docs/workflows/durable-workflows.md) |
 | 📊 **Observability & Cockpit** | [GateWall Cockpit Console](docs/observability/gatewall-cockpit.md) • [Telemetry & Browser SDK](docs/observability/telemetry-and-browser-sdk.md) • [GateWall vs. Temporal](docs/observability/temporal-and-gatewall.md) |
 | 💶 **Accounting** | [Financial Normalizer](docs/finance/normalizer.md) |
-| 🚀 **Release Notes** | [v2.0.0 Release Notes](docs/release/release-2.0.0.md) • [v1.9.0 Release Notes](docs/release/release-1.9.0.md) |
+| 🎨 **Presentation Plane** | [Headless UI Canvas & React Bindings](docs/ui/headless-canvas.md) |
+| 🚀 **Release Notes** | [v2.1.0 Release Notes](docs/release/release-2.1.0.md) • [v2.0.0 Release Notes](docs/release/release-2.0.0.md) • [v1.9.0 Release Notes](docs/release/release-1.9.0.md) |
 
 ---
 
@@ -125,6 +127,7 @@ Contact our team at [contact@gatewall.fr](mailto:contact@gatewall.fr) for privat
 | **Multi-Model Failover** | ❌ App crashes | ⚠️ Proxy-dependent | ✅ **Built-in Fallback Router & Exponential Retry** |
 | **Zod Schema Auto-Repair** | ❌ No | ❌ No | ✅ **Built-in JSON Heuristic Repair** |
 | **Hierarchical Session Replay** | ❌ None | ⚠️ Flat span waterfall | ✅ **Causality Tree + In-Context Replay (`useTask`)** |
+| **Headless UI Canvas State** | ❌ Manual parsing | ❌ Not supported | ✅ **Canonical Envelopes + Parallel Reducer (`avantgate/ui`)** |
 
 ---
 
@@ -140,13 +143,17 @@ yarn add avantgate zod
 
 ### 🧩 Subpath Exports
 
-| Import Path | Description |
-|---|---|
-| `avantgate` | Core control plane: token budgets, cost ledger, prompt guards, multi-model failover & Zod repair. |
-| `avantgate/finance` | Financial data normalizer (accounting parentheses, EU/US/UK/CH currencies & magnitudes). |
-| `avantgate/agent` | Durable step runner, Human-in-the-Loop, dual-channel PII tool isolation, server idempotency (`withServerIdempotency`), & storage adapters. |
-| `avantgate/workflow` | Deterministic sequential state machine, automatic reverse Saga rollback, durable HITL checkpoints & agent tool conversion. |
-| `avantgate/client` | Front-end SDK (< 1.7 KB) with in-context task replay (`useTask`, `createTaskRunner`), causal idempotency helpers (`getIdempotencyHeaders`), & GateWall telemetry adapter. |
+| Import Path | Description | Documentation |
+|---|---|---|
+| `avantgate` | Core control plane: token budgets, cost ledger, prompt guards, multi-model failover & Zod repair. | [Getting Started](docs/getting-started.md) |
+| `avantgate/finance` | Financial data normalizer (accounting parentheses, EU/US/UK/CH currencies & magnitudes). | [Financial Normalizer](docs/finance/normalizer.md) |
+| `avantgate/agent` | Durable step runner, Human-in-the-Loop, dual-channel PII tool isolation, server idempotency (`withServerIdempotency`), & storage adapters. | [Isolated Tools & DTOs](docs/agents/isolated-tools.md) |
+| `avantgate/workflow` | Deterministic sequential state machine, automatic reverse Saga rollback, durable HITL checkpoints & agent tool conversion. | [Durable Workflows](docs/workflows/durable-workflows.md) |
+| `avantgate/client` | Front-end SDK (< 1.7 KB) with in-context task replay (`useTask`, `createTaskRunner`), causal idempotency helpers (`getIdempotencyHeaders`), & GateWall telemetry adapter. | [Telemetry & Browser SDK](docs/observability/telemetry-and-browser-sdk.md) |
+| `avantgate/ui` | Headless UI canvas core (< 2.5 KB): canonical tool envelopes, deterministic $O(N)$ parallel reducer, `defineCanvas` factory. | [Headless UI Canvas](docs/ui/headless-canvas.md) |
+| `avantgate/ui/react` | React presentation plane: polymorphic $O(1)$ view registry (`createViewRegistry`), `CanvasRenderer`, & anti-XSS URL sanitizer (`isValidSafeUrl`). | [Headless UI Canvas](docs/ui/headless-canvas.md) |
+
+> 💡 **UI Canvas Cookbook:** See [Headless UI Canvas & React Bindings](docs/ui/headless-canvas.md) for complete step-by-step recipes connecting agent tools with typed envelopes and custom React views (shadcn/ui, Tailwind).
 
 ---
 

package/dist/ui/define-canvas.d.ts

@@ -0,0 +1,6 @@
+import { type ToolExecutionEnvelope } from "./envelope";
+export declare const defineCanvas: <TContentMap extends Record<string, unknown>>() => {
+    createEnvelope: <K extends Extract<keyof TContentMap, string>>(options: Omit<ToolExecutionEnvelope<TContentMap[K], K>, "version">) => ToolExecutionEnvelope<TContentMap[K], K>;
+    canvasReducer: (currentState: import("./reducer").CanvasState<TContentMap> | null | undefined, envelope: ToolExecutionEnvelope<unknown, Extract<keyof TContentMap, string>>) => import("./reducer").CanvasState<TContentMap>;
+};
+//# sourceMappingURL=define-canvas.d.ts.map

package/dist/ui/define-canvas.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"define-canvas.d.ts","sourceRoot":"","sources":["../../src/ui/define-canvas.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAG5E,eAAO,MAAM,YAAY,GAAI,WAAW,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;qBAEnD,CAAC,SAAS,OAAO,CAAC,MAAM,WAAW,EAAE,MAAM,CAAC,WAClD,IAAI,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,KACjE,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;;CAM9C,CAAC"}

package/dist/ui/envelope.d.ts

@@ -0,0 +1,19 @@
+export type ToolMergeStrategy = "REPLACE" | "APPEND_UNIQUE" | "UPDATE_ENTITY";
+export type UIIntentAction = "HIGHLIGHT" | "SELECT" | "OPEN_MODAL" | "NAVIGATE";
+export interface UIIntent {
+    action: UIIntentAction;
+    targetId: string;
+    targetType: "prospect" | "company" | "task" | "event" | string;
+    metadata?: Record<string, unknown>;
+}
+export interface ToolExecutionEnvelope<TPayload = unknown, TKind extends string = string> {
+    readonly version: 1;
+    readonly toolId: string;
+    readonly kind: TKind;
+    readonly mergeStrategy: ToolMergeStrategy;
+    readonly dedupeKey?: string;
+    readonly uiIntent?: UIIntent;
+    readonly data: TPayload;
+}
+export declare const createToolEnvelope: <TKind extends string, TPayload>(options: Omit<ToolExecutionEnvelope<TPayload, TKind>, "version">) => ToolExecutionEnvelope<TPayload, TKind>;
+//# sourceMappingURL=envelope.d.ts.map

package/dist/ui/envelope.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"envelope.d.ts","sourceRoot":"","sources":["../../src/ui/envelope.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,eAAe,GAAG,eAAe,CAAC;AAE9E,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAC;AAEhF,MAAM,WAAW,QAAQ;IACvB,MAAM,EAAE,cAAc,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,UAAU,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACpC;AAED,MAAM,WAAW,qBAAqB,CAAC,QAAQ,GAAG,OAAO,EAAE,KAAK,SAAS,MAAM,GAAG,MAAM;IACtF,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC;IACpB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,IAAI,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,aAAa,EAAE,iBAAiB,CAAC;IAC1C,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAC7B,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC;CACzB;AAED,eAAO,MAAM,kBAAkB,GAAI,KAAK,SAAS,MAAM,EAAE,QAAQ,EAC/D,SAAS,IAAI,CAAC,qBAAqB,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,SAAS,CAAC,KAC/D,qBAAqB,CAAC,QAAQ,EAAE,KAAK,CAKvC,CAAC"}

package/dist/ui/index.d.ts

@@ -0,0 +1,4 @@
+export { createToolEnvelope, type ToolExecutionEnvelope, type ToolMergeStrategy, type UIIntent, type UIIntentAction, } from "./envelope";
+export { createCanvasReducer, isSafeKey, mergeUniqueEntities, updateEntityInPlace, type CanvasContentState, type CanvasState, } from "./reducer";
+export { defineCanvas } from "./define-canvas";
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,EACtB,KAAK,QAAQ,EACb,KAAK,cAAc,GACpB,MAAM,YAAY,CAAC;AAEpB,OAAO,EACL,mBAAmB,EACnB,SAAS,EACT,mBAAmB,EACnB,mBAAmB,EACnB,KAAK,kBAAkB,EACvB,KAAK,WAAW,GACjB,MAAM,WAAW,CAAC;AAEnB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/ui/index.js

@@ -0,0 +1,170 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/ui/index.ts
+var ui_exports = {};
+__export(ui_exports, {
+  createCanvasReducer: () => createCanvasReducer,
+  createToolEnvelope: () => createToolEnvelope,
+  defineCanvas: () => defineCanvas,
+  isSafeKey: () => isSafeKey,
+  mergeUniqueEntities: () => mergeUniqueEntities,
+  updateEntityInPlace: () => updateEntityInPlace
+});
+module.exports = __toCommonJS(ui_exports);
+
+// src/ui/envelope.ts
+var createToolEnvelope = (options) => {
+  return Object.freeze({
+    version: 1,
+    ...options
+  });
+};
+
+// src/ui/reducer.ts
+var isSafeKey = (key) => {
+  return key !== "__proto__" && key !== "constructor" && key !== "prototype";
+};
+var filterSafeKeys = (source) => {
+  const result = {};
+  for (const key of Object.keys(source)) {
+    if (isSafeKey(key)) {
+      result[key] = source[key];
+    }
+  }
+  return result;
+};
+var mergeEntityArrays = (prevItems, incomingItems, dedupeKey) => {
+  const seenKeys = new Set(
+    prevItems.filter((item) => item && typeof item === "object" && dedupeKey in item).map((item) => String(item[dedupeKey]))
+  );
+  const uniqueIncoming = incomingItems.filter((item) => {
+    const keyVal = item && typeof item === "object" ? String(item[dedupeKey]) : null;
+    if (!keyVal || seenKeys.has(keyVal)) {
+      return false;
+    }
+    seenKeys.add(keyVal);
+    return true;
+  });
+  return [...prevItems, ...uniqueIncoming];
+};
+var mergeUniqueEntities = (prevContent, data, dedupeKey) => {
+  if (Array.isArray(data) && Array.isArray(prevContent)) {
+    return mergeEntityArrays(prevContent, data, dedupeKey);
+  }
+  if (!data || typeof data !== "object") {
+    return { ...prevContent };
+  }
+  const result = filterSafeKeys(prevContent);
+  const safeData = filterSafeKeys(data);
+  for (const key of Object.keys(safeData)) {
+    const incoming = safeData[key];
+    const prev = result[key];
+    result[key] = Array.isArray(incoming) && Array.isArray(prev) ? mergeEntityArrays(prev, incoming, dedupeKey) : incoming;
+  }
+  return result;
+};
+var updateEntityInArray = (items, data, dedupeKey) => {
+  let updated = false;
+  const targetId = String(data[dedupeKey]);
+  const newItems = items.map((item) => {
+    if (item && typeof item === "object" && String(item[dedupeKey]) === targetId) {
+      updated = true;
+      return { ...item, ...filterSafeKeys(data) };
+    }
+    return item;
+  });
+  return { updated, items: newItems };
+};
+var updateInternalArray = (target, safeData, dedupeKey) => {
+  for (const key of Object.keys(target)) {
+    if (!Array.isArray(target[key])) {
+      continue;
+    }
+    const { updated, items } = updateEntityInArray(target[key], safeData, dedupeKey);
+    if (updated) {
+      target[key] = items;
+      return true;
+    }
+  }
+  return false;
+};
+var updateEntityInPlace = (prevContent, data, dedupeKey) => {
+  if (!data || typeof data !== "object") {
+    return { ...prevContent };
+  }
+  const safeData = filterSafeKeys(data);
+  if (Array.isArray(prevContent)) {
+    return updateEntityInArray(prevContent, safeData, dedupeKey).items;
+  }
+  const result = filterSafeKeys(prevContent);
+  const targetId = safeData[dedupeKey] !== void 0 ? String(safeData[dedupeKey]) : null;
+  if (targetId && String(result[dedupeKey]) === targetId) {
+    return { ...result, ...safeData };
+  }
+  updateInternalArray(result, safeData, dedupeKey);
+  return result;
+};
+var createCanvasReducer = () => {
+  return (currentState, envelope) => {
+    const { kind, mergeStrategy, dedupeKey = "id", data, uiIntent } = envelope;
+    const prevContent = currentState?.content;
+    if (!prevContent || prevContent.kind !== kind || mergeStrategy === "REPLACE") {
+      return {
+        content: { kind, ...filterSafeKeys(data || {}) },
+        activeIntent: uiIntent
+      };
+    }
+    if (mergeStrategy === "APPEND_UNIQUE") {
+      return {
+        content: { kind, ...mergeUniqueEntities(prevContent, data, dedupeKey) },
+        activeIntent: uiIntent
+      };
+    }
+    if (mergeStrategy === "UPDATE_ENTITY") {
+      return {
+        content: { kind, ...updateEntityInPlace(prevContent, data, dedupeKey) },
+        activeIntent: uiIntent
+      };
+    }
+    return {
+      content: prevContent,
+      activeIntent: uiIntent ?? currentState?.activeIntent
+    };
+  };
+};
+
+// src/ui/define-canvas.ts
+var defineCanvas = () => {
+  return {
+    createEnvelope: (options) => {
+      return createToolEnvelope(options);
+    },
+    canvasReducer: createCanvasReducer()
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createCanvasReducer,
+  createToolEnvelope,
+  defineCanvas,
+  isSafeKey,
+  mergeUniqueEntities,
+  updateEntityInPlace
+});

package/dist/ui/index.mjs

@@ -0,0 +1,140 @@
+import "../chunk-Y6FXYEAI.mjs";
+
+// src/ui/envelope.ts
+var createToolEnvelope = (options) => {
+  return Object.freeze({
+    version: 1,
+    ...options
+  });
+};
+
+// src/ui/reducer.ts
+var isSafeKey = (key) => {
+  return key !== "__proto__" && key !== "constructor" && key !== "prototype";
+};
+var filterSafeKeys = (source) => {
+  const result = {};
+  for (const key of Object.keys(source)) {
+    if (isSafeKey(key)) {
+      result[key] = source[key];
+    }
+  }
+  return result;
+};
+var mergeEntityArrays = (prevItems, incomingItems, dedupeKey) => {
+  const seenKeys = new Set(
+    prevItems.filter((item) => item && typeof item === "object" && dedupeKey in item).map((item) => String(item[dedupeKey]))
+  );
+  const uniqueIncoming = incomingItems.filter((item) => {
+    const keyVal = item && typeof item === "object" ? String(item[dedupeKey]) : null;
+    if (!keyVal || seenKeys.has(keyVal)) {
+      return false;
+    }
+    seenKeys.add(keyVal);
+    return true;
+  });
+  return [...prevItems, ...uniqueIncoming];
+};
+var mergeUniqueEntities = (prevContent, data, dedupeKey) => {
+  if (Array.isArray(data) && Array.isArray(prevContent)) {
+    return mergeEntityArrays(prevContent, data, dedupeKey);
+  }
+  if (!data || typeof data !== "object") {
+    return { ...prevContent };
+  }
+  const result = filterSafeKeys(prevContent);
+  const safeData = filterSafeKeys(data);
+  for (const key of Object.keys(safeData)) {
+    const incoming = safeData[key];
+    const prev = result[key];
+    result[key] = Array.isArray(incoming) && Array.isArray(prev) ? mergeEntityArrays(prev, incoming, dedupeKey) : incoming;
+  }
+  return result;
+};
+var updateEntityInArray = (items, data, dedupeKey) => {
+  let updated = false;
+  const targetId = String(data[dedupeKey]);
+  const newItems = items.map((item) => {
+    if (item && typeof item === "object" && String(item[dedupeKey]) === targetId) {
+      updated = true;
+      return { ...item, ...filterSafeKeys(data) };
+    }
+    return item;
+  });
+  return { updated, items: newItems };
+};
+var updateInternalArray = (target, safeData, dedupeKey) => {
+  for (const key of Object.keys(target)) {
+    if (!Array.isArray(target[key])) {
+      continue;
+    }
+    const { updated, items } = updateEntityInArray(target[key], safeData, dedupeKey);
+    if (updated) {
+      target[key] = items;
+      return true;
+    }
+  }
+  return false;
+};
+var updateEntityInPlace = (prevContent, data, dedupeKey) => {
+  if (!data || typeof data !== "object") {
+    return { ...prevContent };
+  }
+  const safeData = filterSafeKeys(data);
+  if (Array.isArray(prevContent)) {
+    return updateEntityInArray(prevContent, safeData, dedupeKey).items;
+  }
+  const result = filterSafeKeys(prevContent);
+  const targetId = safeData[dedupeKey] !== void 0 ? String(safeData[dedupeKey]) : null;
+  if (targetId && String(result[dedupeKey]) === targetId) {
+    return { ...result, ...safeData };
+  }
+  updateInternalArray(result, safeData, dedupeKey);
+  return result;
+};
+var createCanvasReducer = () => {
+  return (currentState, envelope) => {
+    const { kind, mergeStrategy, dedupeKey = "id", data, uiIntent } = envelope;
+    const prevContent = currentState?.content;
+    if (!prevContent || prevContent.kind !== kind || mergeStrategy === "REPLACE") {
+      return {
+        content: { kind, ...filterSafeKeys(data || {}) },
+        activeIntent: uiIntent
+      };
+    }
+    if (mergeStrategy === "APPEND_UNIQUE") {
+      return {
+        content: { kind, ...mergeUniqueEntities(prevContent, data, dedupeKey) },
+        activeIntent: uiIntent
+      };
+    }
+    if (mergeStrategy === "UPDATE_ENTITY") {
+      return {
+        content: { kind, ...updateEntityInPlace(prevContent, data, dedupeKey) },
+        activeIntent: uiIntent
+      };
+    }
+    return {
+      content: prevContent,
+      activeIntent: uiIntent ?? currentState?.activeIntent
+    };
+  };
+};
+
+// src/ui/define-canvas.ts
+var defineCanvas = () => {
+  return {
+    createEnvelope: (options) => {
+      return createToolEnvelope(options);
+    },
+    canvasReducer: createCanvasReducer()
+  };
+};
+export {
+  createCanvasReducer,
+  createToolEnvelope,
+  defineCanvas,
+  isSafeKey,
+  mergeUniqueEntities,
+  updateEntityInPlace
+};

package/dist/ui/react/create-view-registry.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import type { UIIntent } from "../envelope";
+import type { CanvasState } from "../reducer";
+export interface CanvasViewContext {
+    onSendMessage?: (prompt: string) => void;
+    onSelectEntity?: (id: string, type?: string) => void;
+    isAgentBusy?: boolean;
+}
+export type CanvasViewComponent<TData> = React.FC<{
+    data: TData;
+    context: CanvasViewContext;
+    activeIntent?: UIIntent;
+}>;
+export interface CanvasRendererProps<TContentMap extends Record<string, unknown>> {
+    state: CanvasState<TContentMap> | null | undefined;
+    context?: CanvasViewContext;
+}
+export declare const createViewRegistry: <TContentMap extends Record<string, unknown>>(registry: { [K in keyof TContentMap]: CanvasViewComponent<TContentMap[K]>; }) => {
+    registry: { [K in keyof TContentMap]: CanvasViewComponent<TContentMap[K]>; };
+    CanvasRenderer: React.FC<CanvasRendererProps<TContentMap>>;
+};
+//# sourceMappingURL=create-view-registry.d.ts.map

package/dist/ui/react/create-view-registry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-view-registry.d.ts","sourceRoot":"","sources":["../../../src/ui/react/create-view-registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C,MAAM,WAAW,iBAAiB;IAChC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,cAAc,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,mBAAmB,CAAC,KAAK,IAAI,KAAK,CAAC,EAAE,CAAC;IAChD,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,iBAAiB,CAAC;IAC3B,YAAY,CAAC,EAAE,QAAQ,CAAC;CACzB,CAAC,CAAC;AAEH,MAAM,WAAW,mBAAmB,CAAC,WAAW,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC9E,KAAK,EAAE,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACnD,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAED,eAAO,MAAM,kBAAkB,GAAI,WAAW,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC5E,UAAU,GAAG,CAAC,IAAI,MAAM,WAAW,GAAG,mBAAmB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,GAAE;iBAA9D,CAAC;;CA4Bf,CAAC"}

package/dist/ui/react/index.d.ts

@@ -0,0 +1,3 @@
+export { createViewRegistry, type CanvasRendererProps, type CanvasViewComponent, type CanvasViewContext, } from "./create-view-registry";
+export { isValidSafeUrl } from "./sanitize";
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/react/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/react/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,GACvB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC"}

package/dist/ui/react/index.js

@@ -0,0 +1,92 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/ui/react/index.ts
+var react_exports = {};
+__export(react_exports, {
+  createViewRegistry: () => createViewRegistry,
+  isValidSafeUrl: () => isValidSafeUrl
+});
+module.exports = __toCommonJS(react_exports);
+
+// src/ui/react/create-view-registry.ts
+var import_react = __toESM(require("react"));
+var createViewRegistry = (registry) => {
+  const CanvasRenderer = ({
+    state,
+    context = {}
+  }) => {
+    if (!state?.content) {
+      return null;
+    }
+    const kind = state.content.kind;
+    const Component = registry[kind];
+    if (!Component) {
+      return null;
+    }
+    return import_react.default.createElement(Component, {
+      data: state.content,
+      context,
+      activeIntent: state.activeIntent
+    });
+  };
+  return {
+    registry,
+    CanvasRenderer
+  };
+};
+
+// src/ui/react/sanitize.ts
+var ALLOWED_PROTOCOLS = /* @__PURE__ */ new Set(["http:", "https:"]);
+var isValidSafeUrl = (rawUrl) => {
+  if (!rawUrl || typeof rawUrl !== "string") {
+    return false;
+  }
+  const trimmed = rawUrl.trim();
+  if (!trimmed) {
+    return false;
+  }
+  if (trimmed.startsWith("#")) {
+    return true;
+  }
+  if (trimmed.startsWith("/") && !trimmed.startsWith("//")) {
+    return true;
+  }
+  try {
+    const parsed = new URL(trimmed);
+    return ALLOWED_PROTOCOLS.has(parsed.protocol);
+  } catch {
+    return false;
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createViewRegistry,
+  isValidSafeUrl
+});

package/dist/ui/react/index.mjs

@@ -0,0 +1,56 @@
+import "../../chunk-Y6FXYEAI.mjs";
+
+// src/ui/react/create-view-registry.ts
+import React from "react";
+var createViewRegistry = (registry) => {
+  const CanvasRenderer = ({
+    state,
+    context = {}
+  }) => {
+    if (!state?.content) {
+      return null;
+    }
+    const kind = state.content.kind;
+    const Component = registry[kind];
+    if (!Component) {
+      return null;
+    }
+    return React.createElement(Component, {
+      data: state.content,
+      context,
+      activeIntent: state.activeIntent
+    });
+  };
+  return {
+    registry,
+    CanvasRenderer
+  };
+};
+
+// src/ui/react/sanitize.ts
+var ALLOWED_PROTOCOLS = /* @__PURE__ */ new Set(["http:", "https:"]);
+var isValidSafeUrl = (rawUrl) => {
+  if (!rawUrl || typeof rawUrl !== "string") {
+    return false;
+  }
+  const trimmed = rawUrl.trim();
+  if (!trimmed) {
+    return false;
+  }
+  if (trimmed.startsWith("#")) {
+    return true;
+  }
+  if (trimmed.startsWith("/") && !trimmed.startsWith("//")) {
+    return true;
+  }
+  try {
+    const parsed = new URL(trimmed);
+    return ALLOWED_PROTOCOLS.has(parsed.protocol);
+  } catch {
+    return false;
+  }
+};
+export {
+  createViewRegistry,
+  isValidSafeUrl
+};

package/dist/ui/react/sanitize.d.ts

@@ -0,0 +1,2 @@
+export declare const isValidSafeUrl: (rawUrl: string | null | undefined) => boolean;
+//# sourceMappingURL=sanitize.d.ts.map

package/dist/ui/react/sanitize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sanitize.d.ts","sourceRoot":"","sources":["../../../src/ui/react/sanitize.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,GAAI,QAAQ,MAAM,GAAG,IAAI,GAAG,SAAS,KAAG,OAwBlE,CAAC"}

package/dist/ui/reducer.d.ts

@@ -0,0 +1,15 @@
+import type { ToolExecutionEnvelope, UIIntent } from "./envelope";
+export type CanvasContentState<TContentMap extends Record<string, unknown>> = {
+    [K in keyof TContentMap]: {
+        kind: K;
+    } & TContentMap[K];
+}[keyof TContentMap] | null;
+export interface CanvasState<TContentMap extends Record<string, unknown>> {
+    content: CanvasContentState<TContentMap>;
+    activeIntent?: UIIntent;
+}
+export declare const isSafeKey: (key: string) => boolean;
+export declare const mergeUniqueEntities: (prevContent: Record<string, any>, data: any, dedupeKey: string) => Record<string, any>;
+export declare const updateEntityInPlace: (prevContent: Record<string, any>, data: any, dedupeKey: string) => Record<string, any>;
+export declare const createCanvasReducer: <TContentMap extends Record<string, unknown>>() => (currentState: CanvasState<TContentMap> | null | undefined, envelope: ToolExecutionEnvelope<unknown, Extract<keyof TContentMap, string>>) => CanvasState<TContentMap>;
+//# sourceMappingURL=reducer.d.ts.map

package/dist/ui/reducer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reducer.d.ts","sourceRoot":"","sources":["../../src/ui/reducer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAElE,MAAM,MAAM,kBAAkB,CAAC,WAAW,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;KAC3E,CAAC,IAAI,MAAM,WAAW,GAAG;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,GAAG,WAAW,CAAC,CAAC,CAAC;CACvD,CAAC,MAAM,WAAW,CAAC,GAAG,IAAI,CAAC;AAE5B,MAAM,WAAW,WAAW,CAAC,WAAW,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACtE,OAAO,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IACzC,YAAY,CAAC,EAAE,QAAQ,CAAC;CACzB;AAED,eAAO,MAAM,SAAS,GAAI,KAAK,MAAM,KAAG,OAEvC,CAAC;AAmCF,eAAO,MAAM,mBAAmB,GAC9B,aAAa,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAChC,MAAM,GAAG,EACT,WAAW,MAAM,KAChB,MAAM,CAAC,MAAM,EAAE,GAAG,CAoBpB,CAAC;AAuCF,eAAO,MAAM,mBAAmB,GAC9B,aAAa,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAChC,MAAM,GAAG,EACT,WAAW,MAAM,KAChB,MAAM,CAAC,MAAM,EAAE,GAAG,CAmBpB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,WAAW,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,QAE3E,cAAc,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,SAAS,EACzD,UAAU,qBAAqB,CAAC,OAAO,EAAE,OAAO,CAAC,MAAM,WAAW,EAAE,MAAM,CAAC,CAAC,KAC3E,WAAW,CAAC,WAAW,CA8B3B,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "avantgate",
-  "version": "2.0.0",
-  "description": "Zero-infrastructure, in-process AI Application Firewall (AI-WAF) & privacy control plane for TypeScript: real-time prompt guardrails, zero-egress PII redaction, agent tool isolation, anti-IDOR defense, pre-flight token budgets, and multi-model failover.",
+  "version": "2.1.0",
+  "description": "Zero-infrastructure, in-process AI Application Firewall (AI-WAF), privacy control plane & headless UI canvas for TypeScript: real-time prompt guardrails, zero-egress PII redaction, deterministic tool envelopes, anti-IDOR defense, pre-flight token budgets, and multi-model failover.",
   "author": "Gatewall Team",
   "license": "MIT",
   "keywords": [
@@ -16,6 +16,10 @@
     "llm",
     "ai",
     "agent",
+    "canvas",
+    "headless-ui",
+    "tool-envelope",
+    "copilot-ui",
     "dual-channel",
     "tool-governance",
     "blast-radius",
@@ -65,6 +69,16 @@
       "import": "./dist/client/index.mjs",
       "require": "./dist/client/index.js"
     },
+    "./ui": {
+      "types": "./dist/ui/index.d.ts",
+      "import": "./dist/ui/index.mjs",
+      "require": "./dist/ui/index.js"
+    },
+    "./ui/react": {
+      "types": "./dist/ui/react/index.d.ts",
+      "import": "./dist/ui/react/index.mjs",
+      "require": "./dist/ui/react/index.js"
+    },
     "./package.json": "./package.json"
   },
   "peerDependencies": {
@@ -81,8 +95,9 @@
     "LICENSE"
   ],
   "scripts": {
-    "build": "tsup src/index.ts src/finance/index.ts src/agent/index.ts src/workflow/index.ts src/client/index.ts --format cjs --format esm --clean && tsc --emitDeclarationOnly --outDir dist",
-    "test": "tsx tests/avantgate.test.ts && tsx tests/preflight-budget.test.ts && tsx tests/sqlite-pricing-adapter.test.ts && tsx tests/financial-normalizer.test.ts && tsx tests/prompt-builder.test.ts && tsx tests/pii-extended.test.ts && tsx tests/output-dlp-secret-guard.test.ts && npm run test:agent && npm run test:workflow && npm run test:client",
+    "build": "tsup src/index.ts src/finance/index.ts src/agent/index.ts src/workflow/index.ts src/client/index.ts src/ui/index.ts src/ui/react/index.ts --format cjs --format esm --clean && tsc --emitDeclarationOnly --outDir dist",
+    "test": "tsx tests/avantgate.test.ts && tsx tests/preflight-budget.test.ts && tsx tests/sqlite-pricing-adapter.test.ts && tsx tests/financial-normalizer.test.ts && tsx tests/prompt-builder.test.ts && tsx tests/pii-extended.test.ts && tsx tests/output-dlp-secret-guard.test.ts && npm run test:agent && npm run test:workflow && npm run test:client && npm run test:ui",
+    "test:ui": "tsx tests/ui/envelope.test.ts && tsx tests/ui/reducer.test.ts && tsx tests/ui/sanitize.test.ts && tsx tests/ui/react-registry.test.tsx",
     "test:secrets": "tsx tests/output-dlp-secret-guard.test.ts",
     "test:pricing": "tsx tests/sqlite-pricing-adapter.test.ts",
     "test:finance": "tsx tests/financial-normalizer.test.ts",