@tangle-network/ui 11.10.0 → 11.11.0

package/dist/primitives.js

@@ -1,212 +1,9 @@
-import {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogOverlay,
-  DialogPortal,
-  DialogTitle,
-  DialogTrigger,
-  DropZone,
-  EmptyState,
-  FilterField,
-  Input,
-  Label,
-  Logo,
-  Metric,
-  MetricStrip,
-  PageHeader,
-  Progress,
-  SegmentedControl,
-  Select,
-  SelectContent,
-  SelectGroup,
-  SelectItem,
-  SelectLabel,
-  SelectScrollDownButton,
-  SelectScrollUpButton,
-  SelectSeparator,
-  SelectTrigger,
-  SelectValue,
-  SidebarDropZone,
-  Skeleton,
-  SkeletonCard,
-  SkeletonTable,
-  StatCard,
-  StatusPill,
-  Switch,
-  TangleKnot,
-  TerminalCursor,
-  TerminalDisplay,
-  TerminalInput,
-  TerminalLine,
-  Textarea,
-  ThemeToggle,
-  ToastContainer,
-  ToastProvider,
-  Toolbar,
-  UploadProgress,
-  useTheme,
-  useToast
-} from "./chunk-55WHV7SS.js";
-import {
-  Avatar,
-  AvatarFallback,
-  AvatarImage,
-  DropdownMenu,
-  DropdownMenuCheckboxItem,
-  DropdownMenuContent,
-  DropdownMenuGroup,
-  DropdownMenuItem,
-  DropdownMenuLabel,
-  DropdownMenuPortal,
-  DropdownMenuRadioGroup,
-  DropdownMenuRadioItem,
-  DropdownMenuSeparator,
-  DropdownMenuShortcut,
-  DropdownMenuSub,
-  DropdownMenuSubContent,
-  DropdownMenuSubTrigger,
-  DropdownMenuTrigger
-} from "./chunk-34A66VBG.js";
-import {
-  TextShimmer
-} from "./chunk-L57WRIND.js";
-import {
-  Badge,
-  Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-  InlineCode,
-  Table,
-  TableBody,
-  TableCaption,
-  TableCell,
-  TableFooter,
-  TableHead,
-  TableHeader,
-  TableRow,
-  badgeVariants
-} from "./chunk-M3QZK62R.js";
-import {
-  Button,
-  buttonVariants
-} from "./chunk-42PAH5D2.js";
-import {
-  Tabs,
-  TabsContent,
-  TabsList,
-  TabsTrigger
-} from "./chunk-R7SUY4E3.js";
-import {
-  ArtifactPane
-} from "./chunk-LTEKI7YJ.js";
-import {
-  CodeBlock,
-  CopyButton
-} from "./chunk-3XXBZL53.js";
-import "./chunk-WKWBTL2V.js";
-import "./chunk-RQHJBTEU.js";
-export {
-  ArtifactPane,
-  Avatar,
-  AvatarFallback,
-  AvatarImage,
-  Badge,
-  Button,
-  Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-  CodeBlock,
-  CopyButton,
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogOverlay,
-  DialogPortal,
-  DialogTitle,
-  DialogTrigger,
-  DropZone,
-  DropdownMenu,
-  DropdownMenuCheckboxItem,
-  DropdownMenuContent,
-  DropdownMenuGroup,
-  DropdownMenuItem,
-  DropdownMenuLabel,
-  DropdownMenuPortal,
-  DropdownMenuRadioGroup,
-  DropdownMenuRadioItem,
-  DropdownMenuSeparator,
-  DropdownMenuShortcut,
-  DropdownMenuSub,
-  DropdownMenuSubContent,
-  DropdownMenuSubTrigger,
-  DropdownMenuTrigger,
-  EmptyState,
-  FilterField,
-  InlineCode,
-  Input,
-  Label,
-  Logo,
-  Metric,
-  MetricStrip,
-  PageHeader,
-  Progress,
-  SegmentedControl,
-  Select,
-  SelectContent,
-  SelectGroup,
-  SelectItem,
-  SelectLabel,
-  SelectScrollDownButton,
-  SelectScrollUpButton,
-  SelectSeparator,
-  SelectTrigger,
-  SelectValue,
-  SidebarDropZone,
-  Skeleton,
-  SkeletonCard,
-  SkeletonTable,
-  StatCard,
-  StatusPill,
-  Switch,
-  Table,
-  TableBody,
-  TableCaption,
-  TableCell,
-  TableFooter,
-  TableHead,
-  TableHeader,
-  TableRow,
-  Tabs,
-  TabsContent,
-  TabsList,
-  TabsTrigger,
-  TangleKnot,
-  TerminalCursor,
-  TerminalDisplay,
-  TerminalInput,
-  TerminalLine,
-  TextShimmer,
-  Textarea,
-  ThemeToggle,
-  ToastContainer,
-  ToastProvider,
-  Toolbar,
-  UploadProgress,
-  badgeVariants,
-  buttonVariants,
-  useTheme,
-  useToast
-};
+import { n as buttonVariants, t as Button } from "./button-uhNnwdsD.js";
+import { a as TableFooter, c as TableRow, d as Card, f as CardContent, g as CardTitle, h as CardHeader, i as TableCell, l as Badge, m as CardFooter, n as TableBody, o as TableHead, p as CardDescription, r as TableCaption, s as TableHeader, t as Table, u as badgeVariants } from "./table-DHyqDPbU.js";
+import { A as SegmentedControl, B as SelectValue, C as ToastProvider, D as SkeletonTable, E as SkeletonCard, F as SelectLabel, G as DialogContent, H as Textarea, I as SelectScrollDownButton, J as DialogHeader, K as DialogDescription, L as SelectScrollUpButton, M as SelectContent, N as SelectGroup, O as Switch, P as SelectItem, Q as DialogTrigger, R as SelectSeparator, S as ToastContainer, T as Skeleton, U as Dialog, V as Input, W as DialogClose, X as DialogPortal, Y as DialogOverlay, Z as DialogTitle, _ as TerminalInput, a as Metric, b as EmptyState, c as PageHeader, d as InlineCode, f as SidebarDropZone, g as TerminalDisplay, h as TerminalCursor, i as Toolbar, j as Select, k as Progress, l as ThemeToggle, m as DropZone, n as TangleKnot, o as MetricStrip, p as UploadProgress, q as DialogFooter, r as FilterField, s as StatusPill, t as Logo, u as useTheme, v as TerminalLine, w as useToast, x as Label, y as StatCard, z as SelectTrigger } from "./primitives-DE-blUz-.js";
+import { _ as AvatarFallback, a as DropdownMenuItem, c as DropdownMenuRadioGroup, d as DropdownMenuShortcut, f as DropdownMenuSub, g as Avatar, h as DropdownMenuTrigger, i as DropdownMenuGroup, l as DropdownMenuRadioItem, m as DropdownMenuSubTrigger, n as DropdownMenuCheckboxItem, o as DropdownMenuLabel, p as DropdownMenuSubContent, r as DropdownMenuContent, s as DropdownMenuPortal, t as DropdownMenu, u as DropdownMenuSeparator, v as AvatarImage } from "./dropdown-menu-BpcLa5vF.js";
+import { i as TabsTrigger, n as TabsContent, r as TabsList, t as Tabs } from "./tabs-ujuqAdtb.js";
+import { t as TextShimmer } from "./text-shimmer-BUUo6I-g.js";
+import { t as ArtifactPane } from "./artifact-pane-DMXT9a8U.js";
+import { n as CopyButton, t as CodeBlock } from "./code-block-CngSn37j.js";
+export { ArtifactPane, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CodeBlock, CopyButton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropZone, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FilterField, InlineCode, Input, Label, Logo, Metric, MetricStrip, PageHeader, Progress, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SidebarDropZone, Skeleton, SkeletonCard, SkeletonTable, StatCard, StatusPill, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TangleKnot, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, TextShimmer, Textarea, ThemeToggle, ToastContainer, ToastProvider, Toolbar, UploadProgress, badgeVariants, buttonVariants, useTheme, useToast };

package/dist/redaction-CGGB2ENG.js

@@ -0,0 +1,74 @@
+import { t as cn } from "./utils-C_uf36nf.js";
+import { useCallback, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Eye, EyeOff, Loader2, ShieldAlert } from "lucide-react";
+//#region src/redaction/redacted-document.tsx
+const defaultLabel = (kind) => kind.replace(/[-_]/g, " ").toUpperCase();
+function RedactedChip({ kind, label, onReveal }) {
+	const [state, setState] = useState({ status: "masked" });
+	const reveal = useCallback(async () => {
+		setState({ status: "loading" });
+		try {
+			const r = await onReveal();
+			setState(r.ok && r.value !== void 0 ? {
+				status: "revealed",
+				value: r.value
+			} : {
+				status: "denied",
+				reason: r.reason
+			});
+		} catch {
+			setState({
+				status: "denied",
+				reason: "error"
+			});
+		}
+	}, [onReveal]);
+	if (state.status === "revealed") return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		onClick: () => setState({ status: "masked" }),
+		title: "Revealed — click to hide",
+		"aria-label": `${label}: revealed, click to hide`,
+		className: cn("inline-flex items-center gap-1 rounded-[var(--radius-sm)] px-1 font-medium", "bg-[color-mix(in_oklch,var(--color-warning,orange)_18%,transparent)] text-foreground ring-1 ring-warning/40"),
+		children: [state.value, /* @__PURE__ */ jsx(EyeOff, { className: "size-3 opacity-60" })]
+	});
+	if (state.status === "denied") return /* @__PURE__ */ jsxs("span", {
+		title: `Restricted${state.reason ? ` (${state.reason})` : ""}`,
+		"aria-label": `${label}: restricted`,
+		className: "inline-flex items-center gap-1 rounded-[var(--radius-sm)] bg-muted px-1 text-muted-foreground",
+		children: [
+			/* @__PURE__ */ jsx(ShieldAlert, { className: "size-3" }),
+			" ",
+			label
+		]
+	});
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		disabled: state.status === "loading",
+		onClick: reveal,
+		title: `${label} — click to reveal`,
+		"aria-label": `${label} redacted, click to reveal`,
+		className: cn("inline-flex items-center gap-1 rounded-[var(--radius-sm)] px-1 font-medium tracking-wide", "bg-muted text-muted-foreground hover:bg-muted/80 hover:text-foreground transition-colors", "cursor-pointer select-none"),
+		children: [
+			state.status === "loading" ? /* @__PURE__ */ jsx(Loader2, { className: "size-3 animate-spin" }) : /* @__PURE__ */ jsx(Eye, { className: "size-3 opacity-60" }),
+			/* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				children: "███"
+			}),
+			" ",
+			label
+		]
+	});
+}
+function RedactedDocument({ document, onReveal, labelForKind = defaultLabel, className }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("whitespace-pre-wrap break-words leading-relaxed", className),
+		children: document.segments.map((seg, i) => seg.type === "text" ? /* @__PURE__ */ jsx("span", { children: seg.text }, i) : /* @__PURE__ */ jsx(RedactedChip, {
+			kind: seg.kind,
+			label: labelForKind(seg.kind),
+			onReveal: () => onReveal(seg.id)
+		}, seg.id))
+	});
+}
+//#endregion
+export { RedactedDocument as t };

package/dist/redaction.d.ts

@@ -1,42 +1,2 @@
-import { ReactNode } from 'react';
-
-/**
- * Viewer for a server-produced redacted document. Renders text inline and each
- * redacted span as a masked chip; clicking a chip asks the server to reveal that
- * one span. The original plaintext is NEVER in the document the client holds —
- * the chip carries only an id + kind; `onReveal` round-trips to the server, where
- * `@tangle-network/agent-app/redact`'s `revealSpan` runs the authorization check
- * and writes the audit trail. So authz + audit are server-truth; this is display.
- *
- * Structural types (no `@tangle-network/agent-app` dependency) — the viewer needs
- * only `{ id, kind }` per span; the cipher stays server-side.
- */
-type RedactedDocSegment = {
-    type: "text";
-    text: string;
-} | {
-    type: "redacted";
-    id: string;
-    kind: string;
-};
-interface RedactedDocumentData {
-    segments: RedactedDocSegment[];
-}
-interface RevealResult {
-    ok: boolean;
-    value?: string;
-    /** e.g. `forbidden` | `not_found` when `ok` is false. */
-    reason?: string;
-}
-interface RedactedDocumentProps {
-    document: RedactedDocumentData;
-    /** Reveal one span by id. Wire to a server route that calls agent-app's
-     *  `revealSpan` (authz + audit happen there). Resolves with the original. */
-    onReveal: (spanId: string) => Promise<RevealResult>;
-    /** Display label for a redaction kind (default: the kind, upper-cased). */
-    labelForKind?: (kind: string) => string;
-    className?: string;
-}
-declare function RedactedDocument({ document, onReveal, labelForKind, className, }: RedactedDocumentProps): ReactNode;
-
-export { type RedactedDocSegment, RedactedDocument, type RedactedDocumentData, type RedactedDocumentProps, type RevealResult };
+import { a as RevealResult, i as RedactedDocumentProps, n as RedactedDocument, r as RedactedDocumentData, t as RedactedDocSegment } from "./index-COgqsFAQ.js";
+export { type RedactedDocSegment, RedactedDocument, type RedactedDocumentData, type RedactedDocumentProps, type RevealResult };

package/dist/redaction.js

@@ -1,7 +1,2 @@
-import {
-  RedactedDocument
-} from "./chunk-HGML45QH.js";
-import "./chunk-RQHJBTEU.js";
-export {
-  RedactedDocument
-};
+import { t as RedactedDocument } from "./redaction-CGGB2ENG.js";
+export { RedactedDocument };

package/dist/run-OyWmIDqu.d.ts

@@ -0,0 +1,41 @@
+import { t as SessionMessage } from "./message-vhUI0c5G.js";
+//#region src/types/run.d.ts
+/** Broad category of a tool invocation, used for display grouping. */
+type ToolCategory = "command" | "write" | "read" | "search" | "edit" | "task" | "web" | "todo" | "other";
+interface RunStats {
+  toolCount: number;
+  messageCount: number;
+  thinkingDurationMs: number;
+  textPartCount: number;
+  toolCategories: Set<ToolCategory>;
+}
+interface FinalTextPart {
+  messageId: string;
+  partIndex: number;
+  text: string;
+}
+/**
+ * A Run is a consecutive group of assistant messages that form one
+ * logical "turn" of the agent. Runs are collapsible in the UI and
+ * show a summary header when collapsed.
+ */
+interface Run {
+  id: string;
+  messages: SessionMessage[];
+  isComplete: boolean;
+  isStreaming: boolean;
+  stats: RunStats;
+  summaryText: string | null;
+  finalTextPart: FinalTextPart | null;
+}
+interface MessageRun {
+  type: "run";
+  run: Run;
+}
+interface MessageUser {
+  type: "user";
+  message: SessionMessage;
+}
+type GroupedMessage = MessageRun | MessageUser;
+//#endregion
+export { Run as a, MessageUser as i, GroupedMessage as n, RunStats as o, MessageRun as r, ToolCategory as s, FinalTextPart as t };

package/dist/run-ZsIKPA6J.js

@@ -0,0 +1,17 @@
+import { n as formatDuration } from "./format-DfcLWqMa.js";
+import { useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/run/run-item-primitives.tsx
+function LiveDuration({ startTime }) {
+	const [elapsed, setElapsed] = useState(Date.now() - startTime);
+	useEffect(() => {
+		const id = setInterval(() => setElapsed(Date.now() - startTime), 100);
+		return () => clearInterval(id);
+	}, [startTime]);
+	return /* @__PURE__ */ jsx("span", {
+		className: "text-xs font-mono text-neutral-400 dark:text-neutral-500 tabular-nums",
+		children: formatDuration(elapsed)
+	});
+}
+//#endregion
+export { LiveDuration as t };