@contractspec/example.agent-console 0.0.0-canary-20260113170453

package/dist/ui/views/RunListView.js

@@ -0,0 +1,165 @@
+'use client';
+
+import { useRunList } from "../hooks/useRunList.js";
+import { EmptyState, ErrorState, LoaderBlock, StatCard, StatCardGroup, StatusChip } from "@contractspec/lib.design-system";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/ui/views/RunListView.tsx
+/**
+* Run List View - Shows agent execution runs with stats
+*/
+function getStatusTone(status) {
+	switch (status) {
+		case "COMPLETED": return "success";
+		case "RUNNING": return "warning";
+		case "QUEUED": return "neutral";
+		case "FAILED":
+		case "CANCELLED": return "danger";
+		default: return "neutral";
+	}
+}
+function formatDuration(ms) {
+	if (!ms) return "-";
+	if (ms < 1e3) return `${ms}ms`;
+	if (ms < 6e4) return `${(ms / 1e3).toFixed(1)}s`;
+	return `${(ms / 6e4).toFixed(1)}m`;
+}
+function formatTokens(tokens) {
+	if (tokens < 1e3) return tokens.toString();
+	if (tokens < 1e6) return `${(tokens / 1e3).toFixed(1)}K`;
+	return `${(tokens / 1e6).toFixed(2)}M`;
+}
+function formatCost(cost) {
+	if (!cost) return "-";
+	return `$${cost.toFixed(4)}`;
+}
+function RunListView({ agentId, onRunClick }) {
+	const { data, metrics, loading, error, refetch } = useRunList({ agentId });
+	if (loading && !data) return /* @__PURE__ */ jsx(LoaderBlock, { label: "Loading runs..." });
+	if (error) return /* @__PURE__ */ jsx(ErrorState, {
+		title: "Failed to load runs",
+		description: error.message,
+		onRetry: refetch,
+		retryLabel: "Retry"
+	});
+	if (!data?.items.length) return /* @__PURE__ */ jsx(EmptyState, {
+		title: "No runs yet",
+		description: "Execute an agent to see run history here."
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-6",
+		children: [
+			metrics && /* @__PURE__ */ jsxs(StatCardGroup, { children: [
+				/* @__PURE__ */ jsx(StatCard, {
+					label: "Total Runs",
+					value: metrics.totalRuns
+				}),
+				/* @__PURE__ */ jsx(StatCard, {
+					label: "Success Rate",
+					value: `${(metrics.successRate * 100).toFixed(1)}%`
+				}),
+				/* @__PURE__ */ jsx(StatCard, {
+					label: "Total Tokens",
+					value: formatTokens(metrics.totalTokens)
+				}),
+				/* @__PURE__ */ jsx(StatCard, {
+					label: "Total Cost",
+					value: `$${metrics.totalCostUsd.toFixed(2)}`
+				})
+			] }),
+			/* @__PURE__ */ jsx("div", {
+				className: "border-border rounded-lg border",
+				children: /* @__PURE__ */ jsxs("table", {
+					className: "w-full",
+					children: [/* @__PURE__ */ jsx("thead", {
+						className: "border-border bg-muted/30 border-b",
+						children: /* @__PURE__ */ jsxs("tr", { children: [
+							/* @__PURE__ */ jsx("th", {
+								className: "text-muted-foreground px-4 py-3 text-left text-sm font-medium",
+								children: "Run"
+							}),
+							/* @__PURE__ */ jsx("th", {
+								className: "text-muted-foreground px-4 py-3 text-left text-sm font-medium",
+								children: "Agent"
+							}),
+							/* @__PURE__ */ jsx("th", {
+								className: "text-muted-foreground px-4 py-3 text-left text-sm font-medium",
+								children: "Status"
+							}),
+							/* @__PURE__ */ jsx("th", {
+								className: "text-muted-foreground px-4 py-3 text-right text-sm font-medium",
+								children: "Tokens"
+							}),
+							/* @__PURE__ */ jsx("th", {
+								className: "text-muted-foreground px-4 py-3 text-right text-sm font-medium",
+								children: "Duration"
+							}),
+							/* @__PURE__ */ jsx("th", {
+								className: "text-muted-foreground px-4 py-3 text-right text-sm font-medium",
+								children: "Cost"
+							})
+						] })
+					}), /* @__PURE__ */ jsx("tbody", {
+						className: "divide-border divide-y",
+						children: data.items.map((run) => /* @__PURE__ */ jsxs("tr", {
+							className: "hover:bg-muted/50 cursor-pointer transition-colors",
+							onClick: () => onRunClick?.(run.id),
+							children: [
+								/* @__PURE__ */ jsxs("td", {
+									className: "px-4 py-3",
+									children: [/* @__PURE__ */ jsx("div", {
+										className: "font-mono text-sm",
+										children: run.id.slice(-8)
+									}), /* @__PURE__ */ jsx("div", {
+										className: "text-muted-foreground text-xs",
+										children: run.queuedAt.toLocaleString()
+									})]
+								}),
+								/* @__PURE__ */ jsx("td", {
+									className: "px-4 py-3",
+									children: /* @__PURE__ */ jsx("span", {
+										className: "font-medium",
+										children: run.agentName
+									})
+								}),
+								/* @__PURE__ */ jsx("td", {
+									className: "px-4 py-3",
+									children: /* @__PURE__ */ jsx(StatusChip, {
+										tone: getStatusTone(run.status),
+										label: run.status
+									})
+								}),
+								/* @__PURE__ */ jsx("td", {
+									className: "px-4 py-3 text-right font-mono text-sm",
+									children: formatTokens(run.totalTokens)
+								}),
+								/* @__PURE__ */ jsx("td", {
+									className: "px-4 py-3 text-right font-mono text-sm",
+									children: formatDuration(run.durationMs)
+								}),
+								/* @__PURE__ */ jsx("td", {
+									className: "px-4 py-3 text-right font-mono text-sm",
+									children: formatCost(run.estimatedCostUsd)
+								})
+							]
+						}, run.id))
+					})]
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "text-muted-foreground text-center text-sm",
+				children: [
+					"Showing ",
+					data.items.length,
+					" of ",
+					data.total,
+					" runs"
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { RunListView };
+//# sourceMappingURL=RunListView.js.map

package/dist/ui/views/RunListView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RunListView.js","names":[],"sources":["../../../src/ui/views/RunListView.tsx"],"sourcesContent":["'use client';\n\n/**\n * Run List View - Shows agent execution runs with stats\n */\nimport {\n  StatCard,\n  StatCardGroup,\n  StatusChip,\n  EmptyState,\n  LoaderBlock,\n  ErrorState,\n} from '@contractspec/lib.design-system';\nimport { useRunList, type Run } from '../hooks/useRunList';\n\ninterface RunListViewProps {\n  agentId?: string;\n  onRunClick?: (runId: string) => void;\n}\n\nfunction getStatusTone(\n  status: Run['status']\n): 'success' | 'warning' | 'neutral' | 'danger' {\n  switch (status) {\n    case 'COMPLETED':\n      return 'success';\n    case 'RUNNING':\n      return 'warning';\n    case 'QUEUED':\n      return 'neutral';\n    case 'FAILED':\n    case 'CANCELLED':\n      return 'danger';\n    default:\n      return 'neutral';\n  }\n}\n\nfunction formatDuration(ms?: number): string {\n  if (!ms) return '-';\n  if (ms < 1000) return `${ms}ms`;\n  if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;\n  return `${(ms / 60000).toFixed(1)}m`;\n}\n\nfunction formatTokens(tokens: number): string {\n  if (tokens < 1000) return tokens.toString();\n  if (tokens < 1000000) return `${(tokens / 1000).toFixed(1)}K`;\n  return `${(tokens / 1000000).toFixed(2)}M`;\n}\n\nfunction formatCost(cost?: number): string {\n  if (!cost) return '-';\n  return `$${cost.toFixed(4)}`;\n}\n\nexport function RunListView({ agentId, onRunClick }: RunListViewProps) {\n  const { data, metrics, loading, error, refetch } = useRunList({ agentId });\n\n  if (loading && !data) {\n    return <LoaderBlock label=\"Loading runs...\" />;\n  }\n\n  if (error) {\n    return (\n      <ErrorState\n        title=\"Failed to load runs\"\n        description={error.message}\n        onRetry={refetch}\n        retryLabel=\"Retry\"\n      />\n    );\n  }\n\n  if (!data?.items.length) {\n    return (\n      <EmptyState\n        title=\"No runs yet\"\n        description=\"Execute an agent to see run history here.\"\n      />\n    );\n  }\n\n  return (\n    <div className=\"space-y-6\">\n      {/* Metrics Stats */}\n      {metrics && (\n        <StatCardGroup>\n          <StatCard label=\"Total Runs\" value={metrics.totalRuns} />\n          <StatCard\n            label=\"Success Rate\"\n            value={`${(metrics.successRate * 100).toFixed(1)}%`}\n          />\n          <StatCard\n            label=\"Total Tokens\"\n            value={formatTokens(metrics.totalTokens)}\n          />\n          <StatCard\n            label=\"Total Cost\"\n            value={`$${metrics.totalCostUsd.toFixed(2)}`}\n          />\n        </StatCardGroup>\n      )}\n\n      {/* Run List */}\n      <div className=\"border-border rounded-lg border\">\n        <table className=\"w-full\">\n          <thead className=\"border-border bg-muted/30 border-b\">\n            <tr>\n              <th className=\"text-muted-foreground px-4 py-3 text-left text-sm font-medium\">\n                Run\n              </th>\n              <th className=\"text-muted-foreground px-4 py-3 text-left text-sm font-medium\">\n                Agent\n              </th>\n              <th className=\"text-muted-foreground px-4 py-3 text-left text-sm font-medium\">\n                Status\n              </th>\n              <th className=\"text-muted-foreground px-4 py-3 text-right text-sm font-medium\">\n                Tokens\n              </th>\n              <th className=\"text-muted-foreground px-4 py-3 text-right text-sm font-medium\">\n                Duration\n              </th>\n              <th className=\"text-muted-foreground px-4 py-3 text-right text-sm font-medium\">\n                Cost\n              </th>\n            </tr>\n          </thead>\n          <tbody className=\"divide-border divide-y\">\n            {data.items.map((run: Run) => (\n              <tr\n                key={run.id}\n                className=\"hover:bg-muted/50 cursor-pointer transition-colors\"\n                onClick={() => onRunClick?.(run.id)}\n              >\n                <td className=\"px-4 py-3\">\n                  <div className=\"font-mono text-sm\">{run.id.slice(-8)}</div>\n                  <div className=\"text-muted-foreground text-xs\">\n                    {run.queuedAt.toLocaleString()}\n                  </div>\n                </td>\n                <td className=\"px-4 py-3\">\n                  <span className=\"font-medium\">{run.agentName}</span>\n                </td>\n                <td className=\"px-4 py-3\">\n                  <StatusChip\n                    tone={getStatusTone(run.status)}\n                    label={run.status}\n                  />\n                </td>\n                <td className=\"px-4 py-3 text-right font-mono text-sm\">\n                  {formatTokens(run.totalTokens)}\n                </td>\n                <td className=\"px-4 py-3 text-right font-mono text-sm\">\n                  {formatDuration(run.durationMs)}\n                </td>\n                <td className=\"px-4 py-3 text-right font-mono text-sm\">\n                  {formatCost(run.estimatedCostUsd)}\n                </td>\n              </tr>\n            ))}\n          </tbody>\n        </table>\n      </div>\n\n      {/* Pagination */}\n      <div className=\"text-muted-foreground text-center text-sm\">\n        Showing {data.items.length} of {data.total} runs\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/ui/views/ToolRegistryView.d.ts

@@ -0,0 +1,14 @@
+import * as react_jsx_runtime4 from "react/jsx-runtime";
+
+//#region src/ui/views/ToolRegistryView.d.ts
+interface ToolRegistryViewProps {
+  onToolClick?: (toolId: string) => void;
+  onCreateTool?: () => void;
+}
+declare function ToolRegistryView({
+  onToolClick,
+  onCreateTool
+}: ToolRegistryViewProps): react_jsx_runtime4.JSX.Element;
+//#endregion
+export { ToolRegistryView };
+//# sourceMappingURL=ToolRegistryView.d.ts.map

package/dist/ui/views/ToolRegistryView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolRegistryView.d.ts","names":[],"sources":["../../../src/ui/views/ToolRegistryView.tsx"],"sourcesContent":[],"mappings":";;;UAiBU,qBAAA;;;AAkCc;AAHR,iBAAA,gBAAA,CAAgB;EAAA,WAAA;EAAA;AAAA,CAAA,EAG7B,qBAH6B,CAAA,EAGR,kBAAA,CAAA,GAAA,CAAA,OAHQ"}

package/dist/ui/views/ToolRegistryView.js

@@ -0,0 +1,97 @@
+'use client';
+
+import { useToolList } from "../hooks/useToolList.js";
+import { Button, EmptyState, EntityCard, ErrorState, LoaderBlock, StatCard, StatCardGroup, StatusChip } from "@contractspec/lib.design-system";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/ui/views/ToolRegistryView.tsx
+/**
+* Tool Registry View - Shows available tools organized by category
+*/
+const categoryIcons = {
+	RETRIEVAL: "🔍",
+	COMPUTATION: "🧮",
+	COMMUNICATION: "📧",
+	INTEGRATION: "🔗",
+	UTILITY: "🛠️",
+	CUSTOM: "⚙️"
+};
+function getStatusTone(status) {
+	switch (status) {
+		case "ACTIVE": return "success";
+		case "DRAFT": return "neutral";
+		case "DEPRECATED": return "warning";
+		case "DISABLED": return "danger";
+		default: return "neutral";
+	}
+}
+function ToolRegistryView({ onToolClick, onCreateTool }) {
+	const { data, loading, error, groupedByCategory, categoryStats, refetch } = useToolList();
+	if (loading && !data) return /* @__PURE__ */ jsx(LoaderBlock, { label: "Loading tools..." });
+	if (error) return /* @__PURE__ */ jsx(ErrorState, {
+		title: "Failed to load tools",
+		description: error.message,
+		onRetry: refetch,
+		retryLabel: "Retry"
+	});
+	if (!data?.items.length) return /* @__PURE__ */ jsx(EmptyState, {
+		title: "No tools registered",
+		description: "Create your first tool to extend agent capabilities.",
+		primaryAction: onCreateTool ? /* @__PURE__ */ jsx(Button, {
+			onPress: onCreateTool,
+			children: "Create Tool"
+		}) : void 0
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-8",
+		children: [/* @__PURE__ */ jsxs(StatCardGroup, { children: [/* @__PURE__ */ jsx(StatCard, {
+			label: "Total Tools",
+			value: data.total
+		}), categoryStats.slice(0, 3).map(({ category, count }) => /* @__PURE__ */ jsx(StatCard, {
+			label: `${categoryIcons[category] ?? ""} ${category}`,
+			value: count
+		}, category))] }), Object.entries(groupedByCategory).map(([category, tools]) => /* @__PURE__ */ jsxs("section", {
+			className: "space-y-4",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "text-2xl",
+						children: categoryIcons[category]
+					}),
+					/* @__PURE__ */ jsx("h3", {
+						className: "text-lg font-semibold",
+						children: category
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "bg-muted text-muted-foreground rounded-full px-2 py-0.5 text-xs",
+						children: tools.length
+					})
+				]
+			}), /* @__PURE__ */ jsx("div", {
+				className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
+				children: tools.map((tool) => /* @__PURE__ */ jsx(EntityCard, {
+					cardTitle: tool.name,
+					cardSubtitle: `v${tool.version}`,
+					meta: /* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: tool.description
+					}),
+					chips: /* @__PURE__ */ jsx(StatusChip, {
+						tone: getStatusTone(tool.status),
+						label: tool.status
+					}),
+					footer: /* @__PURE__ */ jsx("code", {
+						className: "text-muted-foreground text-xs",
+						children: tool.name
+					}),
+					onClick: onToolClick ? () => onToolClick(tool.id) : void 0
+				}, tool.id))
+			})]
+		}, category))]
+	});
+}
+
+//#endregion
+export { ToolRegistryView };
+//# sourceMappingURL=ToolRegistryView.js.map

package/dist/ui/views/ToolRegistryView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolRegistryView.js","names":[],"sources":["../../../src/ui/views/ToolRegistryView.tsx"],"sourcesContent":["'use client';\n\n/**\n * Tool Registry View - Shows available tools organized by category\n */\nimport {\n  StatCard,\n  StatCardGroup,\n  StatusChip,\n  EntityCard,\n  EmptyState,\n  LoaderBlock,\n  ErrorState,\n  Button,\n} from '@contractspec/lib.design-system';\nimport { useToolList, type Tool } from '../hooks/useToolList';\n\ninterface ToolRegistryViewProps {\n  onToolClick?: (toolId: string) => void;\n  onCreateTool?: () => void;\n}\n\nconst categoryIcons: Record<string, string> = {\n  RETRIEVAL: '🔍',\n  COMPUTATION: '🧮',\n  COMMUNICATION: '📧',\n  INTEGRATION: '🔗',\n  UTILITY: '🛠️',\n  CUSTOM: '⚙️',\n};\n\nfunction getStatusTone(\n  status: Tool['status']\n): 'success' | 'warning' | 'neutral' | 'danger' {\n  switch (status) {\n    case 'ACTIVE':\n      return 'success';\n    case 'DRAFT':\n      return 'neutral';\n    case 'DEPRECATED':\n      return 'warning';\n    case 'DISABLED':\n      return 'danger';\n    default:\n      return 'neutral';\n  }\n}\n\nexport function ToolRegistryView({\n  onToolClick,\n  onCreateTool,\n}: ToolRegistryViewProps) {\n  const { data, loading, error, groupedByCategory, categoryStats, refetch } =\n    useToolList();\n\n  if (loading && !data) {\n    return <LoaderBlock label=\"Loading tools...\" />;\n  }\n\n  if (error) {\n    return (\n      <ErrorState\n        title=\"Failed to load tools\"\n        description={error.message}\n        onRetry={refetch}\n        retryLabel=\"Retry\"\n      />\n    );\n  }\n\n  if (!data?.items.length) {\n    return (\n      <EmptyState\n        title=\"No tools registered\"\n        description=\"Create your first tool to extend agent capabilities.\"\n        primaryAction={\n          onCreateTool ? (\n            <Button onPress={onCreateTool}>Create Tool</Button>\n          ) : undefined\n        }\n      />\n    );\n  }\n\n  return (\n    <div className=\"space-y-8\">\n      {/* Category Stats */}\n      <StatCardGroup>\n        <StatCard label=\"Total Tools\" value={data.total} />\n        {categoryStats.slice(0, 3).map(({ category, count }) => (\n          <StatCard\n            key={category}\n            label={`${categoryIcons[category] ?? ''} ${category}`}\n            value={count}\n          />\n        ))}\n      </StatCardGroup>\n\n      {/* Tools by Category */}\n      {Object.entries(groupedByCategory).map(([category, tools]) => (\n        <section key={category} className=\"space-y-4\">\n          <div className=\"flex items-center gap-2\">\n            <span className=\"text-2xl\">{categoryIcons[category]}</span>\n            <h3 className=\"text-lg font-semibold\">{category}</h3>\n            <span className=\"bg-muted text-muted-foreground rounded-full px-2 py-0.5 text-xs\">\n              {(tools as Tool[]).length}\n            </span>\n          </div>\n\n          <div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-3\">\n            {(tools as Tool[]).map((tool) => (\n              <EntityCard\n                key={tool.id}\n                cardTitle={tool.name}\n                cardSubtitle={`v${tool.version}`}\n                meta={\n                  <p className=\"text-muted-foreground text-sm\">\n                    {tool.description}\n                  </p>\n                }\n                chips={\n                  <StatusChip\n                    tone={getStatusTone(tool.status)}\n                    label={tool.status}\n                  />\n                }\n                footer={\n                  <code className=\"text-muted-foreground text-xs\">\n                    {tool.name}\n                  </code>\n                }\n                onClick={onToolClick ? () => onToolClick(tool.id) : undefined}\n              />\n            ))}\n          </div>\n        </section>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,gBAAwC;CAC5C,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,SAAS;CACT,QAAQ;CACT;AAED,SAAS,cACP,QAC8C;AAC9C,SAAQ,QAAR;EACE,KAAK,SACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,QACE,QAAO;;;AAIb,SAAgB,iBAAiB,EAC/B,aACA,gBACwB;CACxB,MAAM,EAAE,MAAM,SAAS,OAAO,mBAAmB,eAAe,YAC9D,aAAa;AAEf,KAAI,WAAW,CAAC,KACd,QAAO,oBAAC,eAAY,OAAM,qBAAqB;AAGjD,KAAI,MACF,QACE,oBAAC;EACC,OAAM;EACN,aAAa,MAAM;EACnB,SAAS;EACT,YAAW;GACX;AAIN,KAAI,CAAC,MAAM,MAAM,OACf,QACE,oBAAC;EACC,OAAM;EACN,aAAY;EACZ,eACE,eACE,oBAAC;GAAO,SAAS;aAAc;IAAoB,GACjD;GAEN;AAIN,QACE,qBAAC;EAAI,WAAU;aAEb,qBAAC,4BACC,oBAAC;GAAS,OAAM;GAAc,OAAO,KAAK;IAAS,EAClD,cAAc,MAAM,GAAG,EAAE,CAAC,KAAK,EAAE,UAAU,YAC1C,oBAAC;GAEC,OAAO,GAAG,cAAc,aAAa,GAAG,GAAG;GAC3C,OAAO;KAFF,SAGL,CACF,IACY,EAGf,OAAO,QAAQ,kBAAkB,CAAC,KAAK,CAAC,UAAU,WACjD,qBAAC;GAAuB,WAAU;cAChC,qBAAC;IAAI,WAAU;;KACb,oBAAC;MAAK,WAAU;gBAAY,cAAc;OAAiB;KAC3D,oBAAC;MAAG,WAAU;gBAAyB;OAAc;KACrD,oBAAC;MAAK,WAAU;gBACZ,MAAiB;OACd;;KACH,EAEN,oBAAC;IAAI,WAAU;cACX,MAAiB,KAAK,SACtB,oBAAC;KAEC,WAAW,KAAK;KAChB,cAAc,IAAI,KAAK;KACvB,MACE,oBAAC;MAAE,WAAU;gBACV,KAAK;OACJ;KAEN,OACE,oBAAC;MACC,MAAM,cAAc,KAAK,OAAO;MAChC,OAAO,KAAK;OACZ;KAEJ,QACE,oBAAC;MAAK,WAAU;gBACb,KAAK;OACD;KAET,SAAS,oBAAoB,YAAY,KAAK,GAAG,GAAG;OAnB/C,KAAK,GAoBV,CACF;KACE;KAlCM,SAmCJ,CACV;GACE"}

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

@@ -0,0 +1,4 @@
+import { RunListView } from "./RunListView.js";
+import { ToolRegistryView } from "./ToolRegistryView.js";
+import { AgentListView } from "./AgentListView.js";
+export { AgentListView, RunListView, ToolRegistryView };

package/dist/ui/views/index.js

@@ -0,0 +1,5 @@
+import { RunListView } from "./RunListView.js";
+import { ToolRegistryView } from "./ToolRegistryView.js";
+import { AgentListView } from "./AgentListView.js";
+
+export { AgentListView, RunListView, ToolRegistryView };

package/example.ts

@@ -0,0 +1 @@
+export { default } from './src/example';

package/package.json

@@ -0,0 +1,155 @@
+{
+  "name": "@contractspec/example.agent-console",
+  "version": "0.0.0-canary-20260113170453",
+  "description": "Agent Console example - AI agent orchestration with tools, runs, and logs",
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": "./dist/index.js",
+    "./agent": "./dist/agent/index.js",
+    "./agent.capability": "./dist/agent.capability.js",
+    "./agent.feature": "./dist/agent.feature.js",
+    "./agent/agent.entity": "./dist/agent/agent.entity.js",
+    "./agent/agent.enum": "./dist/agent/agent.enum.js",
+    "./agent/agent.event": "./dist/agent/agent.event.js",
+    "./agent/agent.handler": "./dist/agent/agent.handler.js",
+    "./agent/agent.operation": "./dist/agent/agent.operation.js",
+    "./agent/agent.presentation": "./dist/agent/agent.presentation.js",
+    "./agent/agent.schema": "./dist/agent/agent.schema.js",
+    "./agent/agent.test-spec": "./dist/agent/agent.test-spec.js",
+    "./docs": "./dist/docs/index.js",
+    "./docs/agent-console.docblock": "./dist/docs/agent-console.docblock.js",
+    "./example": "./dist/example.js",
+    "./handlers": "./dist/handlers/index.js",
+    "./handlers/agent.handlers": "./dist/handlers/agent.handlers.js",
+    "./presentations": "./dist/presentations/index.js",
+    "./run": "./dist/run/index.js",
+    "./run/run.entity": "./dist/run/run.entity.js",
+    "./run/run.enum": "./dist/run/run.enum.js",
+    "./run/run.event": "./dist/run/run.event.js",
+    "./run/run.handler": "./dist/run/run.handler.js",
+    "./run/run.operation": "./dist/run/run.operation.js",
+    "./run/run.presentation": "./dist/run/run.presentation.js",
+    "./run/run.schema": "./dist/run/run.schema.js",
+    "./run/run.test-spec": "./dist/run/run.test-spec.js",
+    "./seeders": "./dist/seeders/index.js",
+    "./shared": "./dist/shared/index.js",
+    "./shared/mock-agents": "./dist/shared/mock-agents.js",
+    "./shared/mock-runs": "./dist/shared/mock-runs.js",
+    "./shared/mock-tools": "./dist/shared/mock-tools.js",
+    "./shared/overlay-types": "./dist/shared/overlay-types.js",
+    "./tool": "./dist/tool/index.js",
+    "./tool/tool.entity": "./dist/tool/tool.entity.js",
+    "./tool/tool.enum": "./dist/tool/tool.enum.js",
+    "./tool/tool.event": "./dist/tool/tool.event.js",
+    "./tool/tool.handler": "./dist/tool/tool.handler.js",
+    "./tool/tool.operation": "./dist/tool/tool.operation.js",
+    "./tool/tool.presentation": "./dist/tool/tool.presentation.js",
+    "./tool/tool.schema": "./dist/tool/tool.schema.js",
+    "./tool/tool.test-spec": "./dist/tool/tool.test-spec.js",
+    "./ui": "./dist/ui/index.js",
+    "./ui/AgentDashboard": "./dist/ui/AgentDashboard.js",
+    "./ui/AgentRunList": "./dist/ui/AgentRunList.js",
+    "./ui/AgentToolRegistry": "./dist/ui/AgentToolRegistry.js",
+    "./ui/hooks": "./dist/ui/hooks/index.js",
+    "./ui/hooks/useAgentList": "./dist/ui/hooks/useAgentList.js",
+    "./ui/hooks/useAgentMutations": "./dist/ui/hooks/useAgentMutations.js",
+    "./ui/hooks/useRunList": "./dist/ui/hooks/useRunList.js",
+    "./ui/hooks/useToolList": "./dist/ui/hooks/useToolList.js",
+    "./ui/modals": "./dist/ui/modals/index.js",
+    "./ui/modals/AgentActionsModal": "./dist/ui/modals/AgentActionsModal.js",
+    "./ui/modals/CreateAgentModal": "./dist/ui/modals/CreateAgentModal.js",
+    "./ui/overlays": "./dist/ui/overlays/index.js",
+    "./ui/overlays/demo-overlays": "./dist/ui/overlays/demo-overlays.js",
+    "./ui/renderers": "./dist/ui/renderers/index.js",
+    "./ui/renderers/agent-list.markdown": "./dist/ui/renderers/agent-list.markdown.js",
+    "./ui/renderers/agent-list.renderer": "./dist/ui/renderers/agent-list.renderer.js",
+    "./ui/renderers/dashboard.markdown": "./dist/ui/renderers/dashboard.markdown.js",
+    "./ui/renderers/run-list.markdown": "./dist/ui/renderers/run-list.markdown.js",
+    "./ui/renderers/tool-registry.markdown": "./dist/ui/renderers/tool-registry.markdown.js",
+    "./ui/views": "./dist/ui/views/index.js",
+    "./ui/views/AgentListView": "./dist/ui/views/AgentListView.js",
+    "./ui/views/RunListView": "./dist/ui/views/RunListView.js",
+    "./ui/views/ToolRegistryView": "./dist/ui/views/ToolRegistryView.js",
+    "./*": "./*"
+  },
+  "scripts": {
+    "publish:pkg": "bun publish --tolerate-republish --ignore-scripts --verbose",
+    "publish:pkg:canary": "bun publish:pkg --tag canary",
+    "build": "bun build:types && bun build:bundle",
+    "build:bundle": "tsdown",
+    "build:types": "tsc --noEmit",
+    "dev": "bun build:bundle --watch",
+    "clean": "rimraf dist .turbo",
+    "lint": "bun lint:fix",
+    "lint:fix": "eslint src --fix",
+    "lint:check": "eslint src",
+    "test": "bun test"
+  },
+  "dependencies": {
+    "@contractspec/lib.schema": "0.0.0-canary-20260113170453",
+    "@contractspec/lib.contracts": "0.0.0-canary-20260113170453",
+    "@contractspec/lib.example-shared-ui": "0.0.0-canary-20260113170453",
+    "@contractspec/lib.design-system": "0.0.0-canary-20260113170453",
+    "@contractspec/lib.runtime-sandbox": "0.0.0-canary-20260113170453",
+    "react": "19.2.3",
+    "react-dom": "19.2.3"
+  },
+  "devDependencies": {
+    "@contractspec/tool.tsdown": "0.0.0-canary-20260113170453",
+    "@contractspec/tool.typescript": "0.0.0-canary-20260113170453",
+    "tsdown": "^0.19.0",
+    "typescript": "^5.9.3",
+    "@types/react": "^19.2.8",
+    "@types/react-dom": "^19.2.2"
+  },
+  "publishConfig": {
+    "exports": {
+      ".": "./dist/index.js",
+      "./agent": "./dist/agent/index.js",
+      "./agent.feature": "./dist/agent.feature.js",
+      "./agent/agent.contracts": "./dist/agent/agent.operations.js",
+      "./agent/agent.entity": "./dist/agent/agent.entity.js",
+      "./agent/agent.enum": "./dist/agent/agent.enum.js",
+      "./agent/agent.event": "./dist/agent/agent.event.js",
+      "./agent/agent.handler": "./dist/agent/agent.handler.js",
+      "./agent/agent.presentation": "./dist/agent/agent.presentation.js",
+      "./agent/agent.schema": "./dist/agent/agent.schema.js",
+      "./docs": "./dist/docs/index.js",
+      "./docs/agent-console.docblock": "./dist/docs/agent-console.docblock.js",
+      "./example": "./dist/example.js",
+      "./handlers": "./dist/handlers/index.js",
+      "./presentations": "./dist/presentations/index.js",
+      "./run": "./dist/run/index.js",
+      "./run/run.contracts": "./dist/run/run.operations.js",
+      "./run/run.entity": "./dist/run/run.entity.js",
+      "./run/run.enum": "./dist/run/run.enum.js",
+      "./run/run.event": "./dist/run/run.event.js",
+      "./run/run.handler": "./dist/run/run.handler.js",
+      "./run/run.presentation": "./dist/run/run.presentation.js",
+      "./run/run.schema": "./dist/run/run.schema.js",
+      "./shared": "./dist/shared/index.js",
+      "./shared/mock-agents": "./dist/shared/mock-agents.js",
+      "./shared/mock-runs": "./dist/shared/mock-runs.js",
+      "./shared/mock-tools": "./dist/shared/mock-tools.js",
+      "./tool": "./dist/tool/index.js",
+      "./tool/tool.contracts": "./dist/tool/tool.operations.js",
+      "./tool/tool.entity": "./dist/tool/tool.entity.js",
+      "./tool/tool.enum": "./dist/tool/tool.enum.js",
+      "./tool/tool.event": "./dist/tool/tool.event.js",
+      "./tool/tool.handler": "./dist/tool/tool.handler.js",
+      "./tool/tool.presentation": "./dist/tool/tool.presentation.js",
+      "./tool/tool.schema": "./dist/tool/tool.schema.js",
+      "./*": "./*"
+    },
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lssm-tech/contractspec.git",
+    "directory": "packages/examples/agent-console"
+  },
+  "homepage": "https://contractspec.io"
+}

package/src/agent/agent.entity.ts

@@ -0,0 +1,137 @@
+import {
+  defineEntity,
+  defineEntityEnum,
+  field,
+  index,
+} from '@contractspec/lib.schema';
+
+/**
+ * Agent status for lifecycle management.
+ */
+export const AgentStatusEntityEnum = defineEntityEnum({
+  name: 'AgentStatus',
+  values: ['DRAFT', 'ACTIVE', 'PAUSED', 'ARCHIVED'],
+  description: 'Lifecycle status of the agent',
+});
+
+/**
+ * Agent model provider.
+ */
+export const ModelProviderEntityEnum = defineEntityEnum({
+  name: 'ModelProvider',
+  values: ['OPENAI', 'ANTHROPIC', 'GOOGLE', 'MISTRAL', 'CUSTOM'],
+  description: 'AI model provider',
+});
+
+/**
+ * Agent entity - Represents an AI agent configuration.
+ */
+export const AgentEntity = defineEntity({
+  name: 'Agent',
+  schema: 'agent_console',
+  description:
+    'Represents an AI agent configuration with assigned tools and parameters.',
+  fields: {
+    id: field.id(),
+    organizationId: field.string({
+      description: 'Organization that owns this agent',
+    }),
+    name: field.string({ description: 'Agent name (1-100 chars)' }),
+    slug: field.string({
+      description: 'URL-safe identifier (lowercase, numbers, hyphens)',
+    }),
+    description: field.string({
+      isOptional: true,
+      description: 'Agent description (max 1000 chars)',
+    }),
+    status: field.enum('AgentStatus', { default: 'DRAFT' }),
+    modelProvider: field.enum('ModelProvider', { default: 'OPENAI' }),
+    modelName: field.string({
+      description: "Model identifier: 'gpt-4', 'claude-3-opus', etc.",
+    }),
+    modelConfig: field.json({
+      isOptional: true,
+      description: 'Model parameters: temperature, max_tokens, etc.',
+    }),
+    systemPrompt: field.string({ description: 'System prompt for the agent' }),
+    userPromptTemplate: field.string({
+      isOptional: true,
+      description: 'Template for user prompts',
+    }),
+    toolIds: field.string({
+      isArray: true,
+      isOptional: true,
+      description: 'IDs of assigned tools',
+    }),
+    toolChoice: field.string({
+      default: 'auto',
+      description: "Tool selection mode: 'auto', 'required', 'none'",
+    }),
+    maxIterations: field.int({
+      default: 10,
+      description: 'Maximum iterations per run',
+    }),
+    maxTokensPerRun: field.int({
+      isOptional: true,
+      description: 'Maximum tokens per run',
+    }),
+    timeoutMs: field.int({
+      default: 120000,
+      description: 'Execution timeout in milliseconds',
+    }),
+    version: field.string({ default: '1.0.0', description: 'Agent version' }),
+    tags: field.string({
+      isArray: true,
+      isOptional: true,
+      description: 'Tags for categorization',
+    }),
+    createdAt: field.createdAt(),
+    updatedAt: field.updatedAt(),
+    createdById: field.string({
+      isOptional: true,
+      description: 'User who created this agent',
+    }),
+    tools: field.hasMany('Tool', {
+      description: 'Tools assigned to this agent',
+    }),
+  },
+  indexes: [
+    index.unique(['organizationId', 'slug']),
+    index.on(['organizationId', 'status']),
+    index.on(['modelProvider', 'modelName']),
+  ],
+  enums: [AgentStatusEntityEnum, ModelProviderEntityEnum],
+});
+
+/**
+ * AgentTool join entity - Links agents to their assigned tools.
+ */
+export const AgentToolEntity = defineEntity({
+  name: 'AgentTool',
+  schema: 'agent_console',
+  description: 'Links an agent to its assigned tools with configuration.',
+  fields: {
+    id: field.id(),
+    agentId: field.foreignKey({ description: 'Agent ID' }),
+    toolId: field.foreignKey({ description: 'Tool ID' }),
+    config: field.json({
+      isOptional: true,
+      description: 'Tool-specific configuration for this agent',
+    }),
+    order: field.int({
+      default: 0,
+      description: 'Order of tool in agent tool list',
+    }),
+    isEnabled: field.boolean({
+      default: true,
+      description: 'Whether tool is enabled for this agent',
+    }),
+    createdAt: field.createdAt(),
+    agent: field.belongsTo('Agent', ['agentId'], ['id']),
+    tool: field.belongsTo('Tool', ['toolId'], ['id']),
+  },
+  indexes: [
+    index.unique(['agentId', 'toolId']),
+    index.on(['agentId', 'order']),
+  ],
+});

package/src/agent/agent.enum.ts

@@ -0,0 +1,31 @@
+import { defineEnum } from '@contractspec/lib.schema';
+
+/**
+ * Agent status enum.
+ */
+export const AgentStatusEnum = defineEnum('AgentStatus', [
+  'DRAFT',
+  'ACTIVE',
+  'PAUSED',
+  'ARCHIVED',
+]);
+
+/**
+ * Model provider enum.
+ */
+export const ModelProviderEnum = defineEnum('ModelProvider', [
+  'OPENAI',
+  'ANTHROPIC',
+  'GOOGLE',
+  'MISTRAL',
+  'CUSTOM',
+]);
+
+/**
+ * Tool choice mode enum.
+ */
+export const ToolChoiceEnum = defineEnum('ToolChoice', [
+  'auto',
+  'required',
+  'none',
+]);