@artooi/ag-ui-web-component 0.2.2 → 0.3.0

package/dist/tools/parse_tool_catalog.d.ts

@@ -0,0 +1,19 @@
+/**
+ * One entry in the server-tool catalog served by django-ag-ui's `tools/`
+ * endpoint and fetched via the `data-tools-url` attribute.
+ */
+export interface ToolCatalogEntry {
+    /** The tool's wire name (matches the name in `TOOL_CALL_START`). */
+    readonly name: string;
+    /** A friendly card label for the tool. */
+    readonly summary: string;
+    /** Optional longer blurb (e.g. for a future tooltip). */
+    readonly description?: string;
+}
+/**
+ * Parse a fetched tool catalog into a `name → summary` map, skipping any entry
+ * that isn't a `{ name: string, summary: string }` object. Tolerant by design:
+ * a malformed payload yields an empty map rather than throwing.
+ */
+export declare function parseToolCatalog(data: unknown): Record<string, string>;
+//# sourceMappingURL=parse_tool_catalog.d.ts.map

package/dist/tools/parse_tool_catalog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"parse_tool_catalog.d.ts","sourceRoot":"","sources":["../../src/tools/parse_tool_catalog.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC/B,oEAAoE;IACpE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,0CAA0C;IAC1C,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,yDAAyD;IACzD,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAiBtE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@artooi/ag-ui-web-component",
-  "version": "0.2.2",
+  "version": "0.3.0",
   "description": "Framework-free <ag-ui-chat> Web Component over the AG-UI protocol. Drop-in chat sidebar with a pluggable client-side tool registry, DOM driver primitives, animations, and destructive-action confirmation modal.",
   "type": "module",
   "main": "./dist/index.js",

package/src/core/ag_ui_chat.ts

@@ -15,6 +15,7 @@ import { type ClientTool, ClientToolRegistry } from "../tools/client_tool_regist
 import { isDestructive } from "../tools/is_destructive.js";
 import { isNavigates } from "../tools/is_navigates.js";
 import { createPageMapContext, type PageMap } from "../tools/page_map.js";
+import { parseToolCatalog } from "../tools/parse_tool_catalog.js";
 import { createRouteTools, type RouteMap } from "../tools/route_map.js";
 import { createStateHookTools, type StateHook } from "../tools/state_hook.js";
 import { type ConfirmationRequest, requestConfirmation } from "../ui/confirmation_card.js";
@@ -159,6 +160,13 @@ export class AgUiChat extends HTMLElement {
    */
   toolSummaries: Record<string, string> = {};
 
+  /**
+   * Card labels fetched from a server tool catalog (`data-tools-url`), keyed by
+   * tool name. The base layer behind {@link toolSummaries}: an explicit entry in
+   * `toolSummaries` wins, this fills the rest. Populated once on connect.
+   */
+  #toolCatalog: Record<string, string> = {};
+
   readonly #toolRegistry = new ClientToolRegistry();
   /** Tool-call cards awaiting execution, keyed by call id. */
   readonly #toolCards = new Map<string, ToolCallCard>();
@@ -312,10 +320,25 @@ export class AgUiChat extends HTMLElement {
       this.setAttribute("collapsed", "");
     }
     this.#initSkills();
+    void this.#fetchToolCatalog();
     this.#threadId = this.conversationStore.threadId();
     void this.#rehydrate();
   }
 
+  /** Fetch the server tool-label catalog from `data-tools-url`, if set. */
+  async #fetchToolCatalog(): Promise<void> {
+    const url = this.getAttribute("data-tools-url");
+    if (url === null) {
+      return;
+    }
+    try {
+      const response = await fetch(url, { headers: this.headers });
+      this.#toolCatalog = parseToolCatalog(await response.json());
+    } catch {
+      // Network/parse failure: cards fall back to toolSummaries / raw names.
+    }
+  }
+
   /**
    * Replace the host-supplied (client) skill catalog. Merged after the embedded
    * and fetched skills (so a client skill overrides a same-named server one).
@@ -871,10 +894,14 @@ export class AgUiChat extends HTMLElement {
     if (existing !== undefined) {
       return existing;
     }
-    // Prefer the tool's own `x-summary`; fall back to the `toolSummaries` map
-    // for server-side tools whose schema never reached the browser.
+    // Prefer the tool's own `x-summary`; then an explicit `toolSummaries`
+    // entry; then the fetched server catalog (`data-tools-url`). All cover
+    // server-side tools whose schema never reached the browser.
     const labelled = this.#resolveTool(call.name)?.parameters[X_SUMMARY_KEY];
-    const summary = typeof labelled === "string" ? labelled : this.toolSummaries[call.name];
+    const summary =
+      typeof labelled === "string"
+        ? labelled
+        : (this.toolSummaries[call.name] ?? this.#toolCatalog[call.name]);
     const card = new ToolCallCard(call.name, call.args, this.toolDisplay, summary);
     this.#toolCards.set(call.id, card);
     this.#messages.appendChild(card.element);

package/src/index.ts

@@ -71,6 +71,7 @@ export { type ClientTool, ClientToolRegistry } from "./tools/client_tool_registr
 export { isDestructive } from "./tools/is_destructive.js";
 export { isNavigates } from "./tools/is_navigates.js";
 export { createPageMapContext, type PageMap } from "./tools/page_map.js";
+export { parseToolCatalog, type ToolCatalogEntry } from "./tools/parse_tool_catalog.js";
 export {
   createRouteTools,
   type Route,

package/src/tools/parse_tool_catalog.ts

@@ -0,0 +1,36 @@
+/**
+ * One entry in the server-tool catalog served by django-ag-ui's `tools/`
+ * endpoint and fetched via the `data-tools-url` attribute.
+ */
+export interface ToolCatalogEntry {
+  /** The tool's wire name (matches the name in `TOOL_CALL_START`). */
+  readonly name: string;
+  /** A friendly card label for the tool. */
+  readonly summary: string;
+  /** Optional longer blurb (e.g. for a future tooltip). */
+  readonly description?: string;
+}
+
+/**
+ * Parse a fetched tool catalog into a `name → summary` map, skipping any entry
+ * that isn't a `{ name: string, summary: string }` object. Tolerant by design:
+ * a malformed payload yields an empty map rather than throwing.
+ */
+export function parseToolCatalog(data: unknown): Record<string, string> {
+  const out: Record<string, string> = {};
+  if (!Array.isArray(data)) {
+    return out;
+  }
+  for (const entry of data) {
+    if (entry === null || typeof entry !== "object") {
+      continue;
+    }
+    const record = entry as Record<string, unknown>;
+    const name = record["name"];
+    const summary = record["summary"];
+    if (typeof name === "string" && typeof summary === "string") {
+      out[name] = summary;
+    }
+  }
+  return out;
+}

package/src/version.ts

@@ -1 +1 @@
-export const VERSION: string = "0.2.2";
+export const VERSION: string = "0.3.0";