@surf-kit/agent 0.1.1

package/dist/index.js

@@ -0,0 +1,2284 @@
+// src/chat/AgentChat/AgentChat.tsx
+import { twMerge as twMerge8 } from "tailwind-merge";
+
+// src/hooks/useAgentChat.ts
+import { useReducer, useCallback, useRef } from "react";
+var initialState = {
+  messages: [],
+  conversationId: null,
+  isLoading: false,
+  error: null,
+  inputValue: "",
+  streamPhase: "idle",
+  streamingContent: ""
+};
+function reducer(state, action) {
+  switch (action.type) {
+    case "SET_INPUT":
+      return { ...state, inputValue: action.value };
+    case "SEND_START":
+      return {
+        ...state,
+        messages: [...state.messages, action.message],
+        isLoading: true,
+        error: null,
+        inputValue: "",
+        streamPhase: "thinking",
+        streamingContent: ""
+      };
+    case "STREAM_PHASE":
+      return { ...state, streamPhase: action.phase };
+    case "STREAM_CONTENT":
+      return { ...state, streamingContent: state.streamingContent + action.content };
+    case "SEND_SUCCESS":
+      return {
+        ...state,
+        messages: [...state.messages, action.message],
+        conversationId: action.conversationId ?? state.conversationId,
+        isLoading: false,
+        streamPhase: "idle",
+        streamingContent: ""
+      };
+    case "SEND_ERROR":
+      return {
+        ...state,
+        isLoading: false,
+        error: action.error,
+        streamPhase: "idle",
+        streamingContent: ""
+      };
+    case "LOAD_CONVERSATION":
+      return {
+        ...state,
+        conversationId: action.conversationId,
+        messages: action.messages,
+        error: null
+      };
+    case "RESET":
+      return { ...initialState };
+    case "CLEAR_ERROR":
+      return { ...state, error: null };
+    default:
+      return state;
+  }
+}
+var msgIdCounter = 0;
+function generateMessageId() {
+  return `msg-${Date.now()}-${++msgIdCounter}`;
+}
+function useAgentChat(config2) {
+  const [state, dispatch] = useReducer(reducer, initialState);
+  const configRef = useRef(config2);
+  configRef.current = config2;
+  const lastUserMessageRef = useRef(null);
+  const sendMessage = useCallback(
+    async (content) => {
+      const { apiUrl, streamPath = "/chat/stream", headers = {}, timeout = 3e4 } = configRef.current;
+      lastUserMessageRef.current = content;
+      const userMessage = {
+        id: generateMessageId(),
+        role: "user",
+        content,
+        timestamp: /* @__PURE__ */ new Date()
+      };
+      dispatch({ type: "SEND_START", message: userMessage });
+      const controller = new AbortController();
+      const timeoutId = setTimeout(() => controller.abort(), timeout);
+      try {
+        const response = await fetch(`${apiUrl}${streamPath}`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            Accept: "text/event-stream",
+            ...headers
+          },
+          body: JSON.stringify({
+            message: content,
+            conversation_id: state.conversationId
+          }),
+          signal: controller.signal
+        });
+        clearTimeout(timeoutId);
+        if (!response.ok) {
+          dispatch({
+            type: "SEND_ERROR",
+            error: {
+              code: "API_ERROR",
+              message: `HTTP ${response.status}: ${response.statusText}`,
+              retryable: response.status >= 500
+            }
+          });
+          return;
+        }
+        const reader = response.body?.getReader();
+        if (!reader) {
+          dispatch({
+            type: "SEND_ERROR",
+            error: { code: "STREAM_ERROR", message: "No response body", retryable: true }
+          });
+          return;
+        }
+        const decoder = new TextDecoder();
+        let buffer = "";
+        let accumulatedContent = "";
+        let agentResponse = null;
+        let capturedAgent = null;
+        let capturedConversationId = null;
+        while (true) {
+          const { done, value } = await reader.read();
+          if (done) break;
+          buffer += decoder.decode(value, { stream: true });
+          const lines = buffer.split("\n");
+          buffer = lines.pop() ?? "";
+          for (const line of lines) {
+            if (!line.startsWith("data: ")) continue;
+            const data = line.slice(6).trim();
+            if (data === "[DONE]") continue;
+            try {
+              const event = JSON.parse(data);
+              switch (event.type) {
+                case "agent":
+                  capturedAgent = event.agent;
+                  break;
+                case "phase":
+                  dispatch({ type: "STREAM_PHASE", phase: event.phase });
+                  break;
+                case "delta":
+                  accumulatedContent += event.content;
+                  dispatch({ type: "STREAM_CONTENT", content: event.content });
+                  break;
+                case "done":
+                  agentResponse = event.response;
+                  capturedConversationId = event.conversation_id ?? null;
+                  break;
+                case "error":
+                  dispatch({ type: "SEND_ERROR", error: event.error });
+                  return;
+              }
+            } catch {
+            }
+          }
+        }
+        const assistantMessage = {
+          id: generateMessageId(),
+          role: "assistant",
+          content: agentResponse?.message ?? accumulatedContent,
+          response: agentResponse ?? void 0,
+          agent: capturedAgent ?? void 0,
+          timestamp: /* @__PURE__ */ new Date()
+        };
+        dispatch({
+          type: "SEND_SUCCESS",
+          message: assistantMessage,
+          streamingContent: accumulatedContent,
+          conversationId: capturedConversationId
+        });
+      } catch (err) {
+        clearTimeout(timeoutId);
+        if (err.name === "AbortError") {
+          dispatch({
+            type: "SEND_ERROR",
+            error: { code: "TIMEOUT", message: "Request timed out", retryable: true }
+          });
+        } else {
+          dispatch({
+            type: "SEND_ERROR",
+            error: {
+              code: "NETWORK_ERROR",
+              message: err.message ?? "Network error",
+              retryable: true
+            }
+          });
+        }
+      }
+    },
+    [state.conversationId]
+  );
+  const setInputValue = useCallback((value) => {
+    dispatch({ type: "SET_INPUT", value });
+  }, []);
+  const loadConversation = useCallback((conversationId, messages) => {
+    dispatch({ type: "LOAD_CONVERSATION", conversationId, messages });
+  }, []);
+  const submitFeedback = useCallback(
+    async (messageId, rating, comment) => {
+      const { apiUrl, feedbackPath = "/feedback", headers = {} } = configRef.current;
+      await fetch(`${apiUrl}${feedbackPath}`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...headers },
+        body: JSON.stringify({ messageId, rating, comment })
+      });
+    },
+    []
+  );
+  const retry = useCallback(async () => {
+    if (lastUserMessageRef.current) {
+      await sendMessage(lastUserMessageRef.current);
+    }
+  }, [sendMessage]);
+  const reset = useCallback(() => {
+    dispatch({ type: "RESET" });
+    lastUserMessageRef.current = null;
+  }, []);
+  const actions = {
+    sendMessage,
+    setInputValue,
+    loadConversation,
+    submitFeedback,
+    retry,
+    reset
+  };
+  return { state, actions };
+}
+
+// src/chat/MessageThread/MessageThread.tsx
+import { twMerge as twMerge5 } from "tailwind-merge";
+import { useEffect, useRef as useRef2 } from "react";
+
+// src/chat/MessageBubble/MessageBubble.tsx
+import { twMerge as twMerge4 } from "tailwind-merge";
+
+// src/response/AgentResponse/AgentResponse.tsx
+import { Badge as Badge2 } from "@surf-kit/core";
+
+// src/response/ResponseMessage/ResponseMessage.tsx
+import ReactMarkdown from "react-markdown";
+import rehypeSanitize from "rehype-sanitize";
+import { twMerge } from "tailwind-merge";
+import { jsx } from "react/jsx-runtime";
+function normalizeMarkdownLists(content) {
+  return content.replace(/:\s+-\s+/g, ":\n\n- ");
+}
+function ResponseMessage({ content, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: twMerge(
+        "text-sm leading-relaxed text-text-primary",
+        "[&_p]:my-2",
+        "[&_ul]:my-2 [&_ul]:list-disc [&_ul]:pl-6",
+        "[&_ol]:my-2 [&_ol]:list-decimal [&_ol]:pl-6",
+        "[&_li]:my-1",
+        "[&_strong]:text-text-primary [&_strong]:font-semibold",
+        "[&_em]:text-text-secondary",
+        "[&_h1]:text-lg [&_h1]:font-semibold [&_h1]:text-text-primary [&_h1]:mt-4 [&_h1]:mb-2",
+        "[&_h2]:text-base [&_h2]:font-semibold [&_h2]:text-text-primary [&_h2]:mt-3 [&_h2]:mb-1.5",
+        "[&_h3]:text-sm [&_h3]:font-semibold [&_h3]:text-accent [&_h3]:mt-2 [&_h3]:mb-1",
+        "[&_code]:bg-surface-raised [&_code]:text-accent [&_code]:px-1.5 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-xs [&_code]:font-mono",
+        "[&_pre]:bg-surface-raised [&_pre]:border [&_pre]:border-border [&_pre]:rounded-xl [&_pre]:p-4 [&_pre]:overflow-x-auto",
+        "[&_blockquote]:border-l-2 [&_blockquote]:border-border-strong [&_blockquote]:pl-4 [&_blockquote]:text-text-secondary",
+        "[&_a]:text-accent [&_a]:underline-offset-2 [&_a]:hover:text-accent/80",
+        className
+      ),
+      "data-testid": "response-message",
+      children: /* @__PURE__ */ jsx(
+        ReactMarkdown,
+        {
+          rehypePlugins: [rehypeSanitize],
+          components: {
+            script: () => null,
+            iframe: () => null,
+            p: ({ children }) => /* @__PURE__ */ jsx("p", { className: "my-2", children }),
+            ul: ({ children }) => /* @__PURE__ */ jsx("ul", { className: "my-2 list-disc pl-6", children }),
+            ol: ({ children }) => /* @__PURE__ */ jsx("ol", { className: "my-2 list-decimal pl-6", children }),
+            li: ({ children }) => /* @__PURE__ */ jsx("li", { className: "my-1", children }),
+            strong: ({ children }) => /* @__PURE__ */ jsx("strong", { className: "font-semibold", children }),
+            h1: ({ children }) => /* @__PURE__ */ jsx("h1", { className: "text-base font-bold mt-4 mb-2", children }),
+            h2: ({ children }) => /* @__PURE__ */ jsx("h2", { className: "text-sm font-bold mt-3 mb-1", children }),
+            h3: ({ children }) => /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold mt-2 mb-1", children }),
+            code: ({ children }) => /* @__PURE__ */ jsx("code", { className: "bg-surface-sunken rounded px-1 py-0.5 text-xs font-mono", children })
+          },
+          children: normalizeMarkdownLists(content)
+        }
+      )
+    }
+  );
+}
+
+// src/response/StructuredResponse/StructuredResponse.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+function tryParse(value) {
+  if (value === void 0 || value === null) return null;
+  if (typeof value === "string") {
+    try {
+      return JSON.parse(value);
+    } catch {
+      return null;
+    }
+  }
+  return value;
+}
+function renderSteps(data) {
+  const steps = tryParse(data.steps);
+  if (!steps || !Array.isArray(steps)) return null;
+  return /* @__PURE__ */ jsx2("ol", { className: "flex flex-col gap-2", "data-testid": "structured-steps", children: steps.map((step, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-3", children: [
+    /* @__PURE__ */ jsx2(
+      "span",
+      {
+        className: "mt-0.5 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-accent text-[11px] font-semibold text-white",
+        "aria-hidden": "true",
+        children: i + 1
+      }
+    ),
+    /* @__PURE__ */ jsx2("span", { className: "text-sm text-text-primary leading-relaxed", children: step })
+  ] }, i)) });
+}
+function renderTable(data) {
+  const columns = tryParse(data.columns);
+  const rawRows = tryParse(data.rows);
+  if (columns && rawRows && Array.isArray(columns) && Array.isArray(rawRows)) {
+    return /* @__PURE__ */ jsx2("div", { className: "overflow-x-auto rounded-lg border border-border", "data-testid": "structured-table", children: /* @__PURE__ */ jsxs("table", { role: "table", className: "w-full border-collapse text-sm", children: [
+      /* @__PURE__ */ jsx2("thead", { className: "bg-surface-raised", children: /* @__PURE__ */ jsx2("tr", { children: columns.map((col) => /* @__PURE__ */ jsx2(
+        "th",
+        {
+          className: "text-left px-4 py-2.5 font-semibold text-text-primary border-b border-border",
+          children: col
+        },
+        col
+      )) }) }),
+      /* @__PURE__ */ jsx2("tbody", { children: rawRows.map((row, i) => {
+        const cells = Array.isArray(row) ? row : columns.map((col) => row[col]);
+        return /* @__PURE__ */ jsx2("tr", { className: "even:bg-surface-raised/40", children: cells.map((cell, j) => /* @__PURE__ */ jsx2("td", { className: "px-4 py-2 text-text-secondary border-b border-border", children: String(cell ?? "") }, j)) }, i);
+      }) })
+    ] }) });
+  }
+  const entries = Object.entries(data);
+  return /* @__PURE__ */ jsx2("div", { className: "overflow-x-auto rounded-lg border border-border", "data-testid": "structured-table", children: /* @__PURE__ */ jsx2("table", { role: "table", className: "w-full border-collapse text-sm", children: /* @__PURE__ */ jsx2("tbody", { children: entries.map(([key, value]) => /* @__PURE__ */ jsxs("tr", { className: "even:bg-surface-raised/40", children: [
+    /* @__PURE__ */ jsx2("td", { className: "px-4 py-2 text-text-primary font-medium border-b border-border w-1/3", children: key }),
+    /* @__PURE__ */ jsx2("td", { className: "px-4 py-2 text-text-secondary border-b border-border", children: typeof value === "object" ? JSON.stringify(value) : String(value ?? "") })
+  ] }, key)) }) }) });
+}
+function renderCard(data) {
+  const title = typeof data.title === "string" ? data.title : null;
+  const body = typeof data.body === "string" ? data.body : null;
+  const link = typeof data.link === "string" ? data.link : null;
+  const linkLabel = typeof data.link_label === "string" ? data.link_label : "Learn more";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "rounded-xl border border-border bg-surface-raised p-4 flex flex-col gap-2",
+      "data-testid": "structured-card",
+      children: [
+        title && /* @__PURE__ */ jsx2("p", { className: "text-sm font-semibold text-text-primary", children: title }),
+        body && /* @__PURE__ */ jsx2("p", { className: "text-sm text-text-secondary leading-relaxed", children: body }),
+        link && /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: link,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "mt-1 inline-flex items-center gap-1 text-xs font-medium text-accent hover:text-accent/80 underline-offset-2 hover:underline transition-colors",
+            children: [
+              linkLabel,
+              /* @__PURE__ */ jsx2("svg", { className: "h-3 w-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsx2("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function renderList(data) {
+  const items = tryParse(data.items);
+  const title = typeof data.title === "string" ? data.title : null;
+  if (!items || !Array.isArray(items)) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", "data-testid": "structured-list", children: [
+    title && /* @__PURE__ */ jsx2("p", { className: "text-xs font-semibold uppercase tracking-wider text-text-secondary mb-1", children: title }),
+    /* @__PURE__ */ jsx2("ul", { className: "flex flex-col gap-1.5", children: items.map((item, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2.5", children: [
+      /* @__PURE__ */ jsx2("span", { className: "mt-1.5 h-1.5 w-1.5 shrink-0 rounded-full bg-accent", "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx2("span", { className: "text-sm text-text-primary leading-relaxed", children: item })
+    ] }, i)) })
+  ] });
+}
+function renderWarning(data) {
+  const severity = typeof data.severity === "string" ? data.severity : "medium";
+  const action = typeof data.action === "string" ? data.action : null;
+  const details = typeof data.details === "string" ? data.details : null;
+  const isHigh = severity === "high";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "alert",
+      className: `rounded-xl border p-4 flex gap-3 ${isHigh ? "border-red-200 bg-red-50 dark:border-red-900/50 dark:bg-red-950/30" : "border-amber-200 bg-amber-50 dark:border-amber-900/50 dark:bg-amber-950/30"}`,
+      "data-testid": "structured-warning",
+      children: [
+        /* @__PURE__ */ jsx2(
+          "svg",
+          {
+            className: `mt-0.5 h-5 w-5 shrink-0 ${isHigh ? "text-red-500" : "text-amber-500"}`,
+            fill: "none",
+            viewBox: "0 0 24 24",
+            stroke: "currentColor",
+            strokeWidth: 2,
+            children: /* @__PURE__ */ jsx2("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" })
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          action && /* @__PURE__ */ jsx2("p", { className: `text-sm font-semibold ${isHigh ? "text-red-700 dark:text-red-300" : "text-amber-700 dark:text-amber-300"}`, children: action }),
+          details && /* @__PURE__ */ jsx2("p", { className: `text-sm ${isHigh ? "text-red-600 dark:text-red-400" : "text-amber-600 dark:text-amber-400"}`, children: details })
+        ] })
+      ]
+    }
+  );
+}
+function StructuredResponse({ uiHint, data, className }) {
+  if (!data) return null;
+  let content;
+  switch (uiHint) {
+    case "steps":
+      content = renderSteps(data);
+      break;
+    case "table":
+      content = renderTable(data);
+      break;
+    case "card":
+      content = renderCard(data);
+      break;
+    case "list":
+      content = renderList(data);
+      break;
+    case "warning":
+      content = renderWarning(data);
+      break;
+    case "text":
+      content = typeof data.text === "string" ? /* @__PURE__ */ jsx2("p", { "data-testid": "structured-text", children: data.text }) : null;
+      break;
+    default:
+      content = null;
+  }
+  if (!content) return null;
+  return /* @__PURE__ */ jsx2("div", { className, "data-testid": "structured-response", children: content });
+}
+
+// src/sources/SourceList/SourceList.tsx
+import { useState } from "react";
+
+// src/sources/SourceCard/SourceCard.tsx
+import { Badge } from "@surf-kit/core";
+import { twMerge as twMerge2 } from "tailwind-merge";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function getConfidenceIntent(confidence) {
+  if (confidence >= 0.8) return "success";
+  if (confidence >= 0.5) return "warning";
+  return "error";
+}
+function getConfidenceLabel(confidence) {
+  if (confidence >= 0.8) return "High";
+  if (confidence >= 0.5) return "Medium";
+  return "Low";
+}
+function SourceCard({ source, variant = "compact", onNavigate, className }) {
+  const handleClick = () => {
+    if (onNavigate) {
+      onNavigate(source);
+    }
+  };
+  const isCompact = variant === "compact";
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      className: twMerge2(
+        "rounded-xl border transition-all duration-200",
+        "bg-surface border-border",
+        onNavigate && "cursor-pointer hover:border-border-strong",
+        className
+      ),
+      "data-document-id": source.document_id,
+      "data-testid": "source-card",
+      children: /* @__PURE__ */ jsxs2(
+        "div",
+        {
+          className: isCompact ? "px-4 py-3" : "px-6 py-4",
+          onClick: handleClick,
+          role: onNavigate ? "button" : void 0,
+          tabIndex: onNavigate ? 0 : void 0,
+          onKeyDown: onNavigate ? (e) => {
+            if (e.key === "Enter" || e.key === " ") {
+              e.preventDefault();
+              handleClick();
+            }
+          } : void 0,
+          children: [
+            /* @__PURE__ */ jsxs2("div", { className: "flex items-start justify-between gap-2", children: [
+              /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ jsx3("p", { className: "text-sm font-medium text-text-primary truncate", children: source.title }),
+                source.section && /* @__PURE__ */ jsx3("p", { className: "text-[11px] font-semibold uppercase tracking-wider text-text-secondary truncate mt-0.5", children: source.section })
+              ] }),
+              /* @__PURE__ */ jsx3(
+                Badge,
+                {
+                  intent: getConfidenceIntent(source.confidence),
+                  size: "sm",
+                  children: getConfidenceLabel(source.confidence)
+                }
+              )
+            ] }),
+            !isCompact && /* @__PURE__ */ jsx3("p", { className: "text-xs text-text-secondary mt-2 line-clamp-3 leading-relaxed", children: source.snippet })
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/sources/SourceList/SourceList.tsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function SourceList({
+  sources,
+  variant = "compact",
+  collapsible = false,
+  defaultExpanded = true,
+  onNavigate,
+  className
+}) {
+  const [isExpanded, setIsExpanded] = useState(defaultExpanded);
+  if (sources.length === 0) return null;
+  const content = /* @__PURE__ */ jsx4("div", { className: "flex flex-col gap-1.5", "data-testid": "source-list-items", children: sources.map((source) => /* @__PURE__ */ jsx4(
+    SourceCard,
+    {
+      source,
+      variant,
+      onNavigate
+    },
+    source.document_id
+  )) });
+  if (!collapsible) {
+    return /* @__PURE__ */ jsx4("div", { className, "data-testid": "source-list", children: content });
+  }
+  return /* @__PURE__ */ jsxs3("div", { className, "data-testid": "source-list", children: [
+    /* @__PURE__ */ jsxs3(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsExpanded((prev) => !prev),
+        "aria-expanded": isExpanded,
+        className: "flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wider text-text-secondary hover:text-accent mb-2 transition-colors duration-200",
+        children: [
+          /* @__PURE__ */ jsx4(
+            "svg",
+            {
+              className: `w-4 h-4 transition-transform ${isExpanded ? "rotate-180" : ""}`,
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              strokeWidth: 2,
+              children: /* @__PURE__ */ jsx4("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" })
+            }
+          ),
+          "Sources (",
+          sources.length,
+          ")"
+        ]
+      }
+    ),
+    isExpanded && content
+  ] });
+}
+
+// src/response/FollowUpChips/FollowUpChips.tsx
+import { twMerge as twMerge3 } from "tailwind-merge";
+import { jsx as jsx5 } from "react/jsx-runtime";
+function FollowUpChips({ suggestions, onSelect, className }) {
+  if (suggestions.length === 0) return null;
+  return /* @__PURE__ */ jsx5(
+    "div",
+    {
+      className: `flex gap-2 overflow-x-auto py-1 ${className ?? ""}`,
+      role: "group",
+      "aria-label": "Follow-up suggestions",
+      "data-testid": "follow-up-chips",
+      children: suggestions.map((suggestion) => /* @__PURE__ */ jsx5(
+        "button",
+        {
+          type: "button",
+          onClick: () => onSelect(suggestion),
+          className: twMerge3(
+            "px-4 py-1.5 rounded-full text-sm shrink-0 whitespace-nowrap",
+            "border border-border bg-surface text-text-primary",
+            "hover:bg-surface-raised hover:border-interactive hover:text-text-primary",
+            "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent",
+            "transition-all duration-200"
+          ),
+          children: suggestion
+        },
+        suggestion
+      ))
+    }
+  );
+}
+
+// src/response/AgentResponse/AgentResponse.tsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+function getConfidenceIntent2(overall) {
+  if (overall === "high") return "success";
+  if (overall === "medium") return "warning";
+  return "error";
+}
+function getVerificationIntent(status) {
+  if (status === "passed") return "success";
+  if (status === "flagged") return "warning";
+  return "error";
+}
+function getVerificationLabel(status) {
+  if (status === "passed") return "Verified";
+  if (status === "flagged") return "Flagged";
+  return "Failed";
+}
+function AgentResponse({
+  response,
+  showSources = true,
+  showConfidence = false,
+  showVerification = false,
+  onFollowUp,
+  onNavigateSource,
+  className
+}) {
+  return /* @__PURE__ */ jsxs4("div", { className: `flex flex-col gap-4 ${className ?? ""}`, "data-testid": "agent-response", children: [
+    /* @__PURE__ */ jsx6(ResponseMessage, { content: response.message }),
+    response.ui_hint !== "text" && response.structured_data && /* @__PURE__ */ jsx6(
+      StructuredResponse,
+      {
+        uiHint: response.ui_hint,
+        data: response.structured_data
+      }
+    ),
+    (showConfidence || showVerification) && /* @__PURE__ */ jsxs4("div", { className: "flex flex-wrap items-center gap-2 mt-1", "data-testid": "response-meta", children: [
+      showConfidence && /* @__PURE__ */ jsxs4(
+        Badge2,
+        {
+          intent: getConfidenceIntent2(response.confidence.overall),
+          size: "sm",
+          children: [
+            response.confidence.overall,
+            " confidence"
+          ]
+        }
+      ),
+      showVerification && /* @__PURE__ */ jsxs4(
+        Badge2,
+        {
+          intent: getVerificationIntent(response.verification.status),
+          size: "sm",
+          children: [
+            getVerificationLabel(response.verification.status),
+            " (",
+            response.verification.claims_verified,
+            "/",
+            response.verification.claims_checked,
+            ")"
+          ]
+        }
+      )
+    ] }),
+    showSources && response.sources.length > 0 && /* @__PURE__ */ jsx6(
+      SourceList,
+      {
+        sources: response.sources,
+        variant: "compact",
+        collapsible: true,
+        defaultExpanded: false,
+        onNavigate: onNavigateSource
+      }
+    ),
+    response.follow_up_suggestions.length > 0 && onFollowUp && /* @__PURE__ */ jsx6(
+      FollowUpChips,
+      {
+        suggestions: response.follow_up_suggestions,
+        onSelect: onFollowUp
+      }
+    )
+  ] });
+}
+
+// src/chat/MessageBubble/MessageBubble.tsx
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+function MessageBubble({
+  message,
+  showAgent,
+  showSources = true,
+  showConfidence = true,
+  showVerification = true,
+  className
+}) {
+  const isUser = message.role === "user";
+  if (isUser) {
+    return /* @__PURE__ */ jsx7(
+      "div",
+      {
+        "data-message-id": message.id,
+        className: twMerge4("flex w-full justify-end", className),
+        children: /* @__PURE__ */ jsx7("div", { className: "max-w-[75%] rounded-[18px] rounded-br-[4px] px-4 py-2.5 bg-accent text-white whitespace-pre-wrap text-sm leading-relaxed", children: message.content })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      "data-message-id": message.id,
+      className: twMerge4("flex w-full flex-col items-start gap-1.5", className),
+      children: [
+        showAgent && message.agent && /* @__PURE__ */ jsx7("div", { className: "text-[11px] font-medium uppercase tracking-[0.08em] text-text-secondary px-1", children: message.agent.replace("_agent", "").replace("_", " ") }),
+        /* @__PURE__ */ jsx7("div", { className: "max-w-[88%] rounded-[18px] rounded-tl-[4px] px-4 py-3 bg-surface-raised border border-border", children: message.response ? /* @__PURE__ */ jsx7(
+          AgentResponse,
+          {
+            response: message.response,
+            showSources,
+            showConfidence,
+            showVerification
+          }
+        ) : /* @__PURE__ */ jsx7(ResponseMessage, { content: message.content }) })
+      ]
+    }
+  );
+}
+
+// src/chat/MessageThread/MessageThread.tsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+function MessageThread({ messages, streamingSlot, showSources, showConfidence, showVerification, className }) {
+  const bottomRef = useRef2(null);
+  useEffect(() => {
+    bottomRef.current?.scrollIntoView?.({ behavior: "smooth" });
+  }, [messages.length, streamingSlot]);
+  return /* @__PURE__ */ jsxs6(
+    "div",
+    {
+      role: "log",
+      "aria-live": "polite",
+      "aria-label": "Message thread",
+      className: twMerge5(
+        "flex flex-col gap-4 overflow-y-auto flex-1 px-4 py-6",
+        className
+      ),
+      children: [
+        messages.map((message) => /* @__PURE__ */ jsx8(
+          MessageBubble,
+          {
+            message,
+            showSources,
+            showConfidence,
+            showVerification
+          },
+          message.id
+        )),
+        streamingSlot,
+        /* @__PURE__ */ jsx8("div", { ref: bottomRef })
+      ]
+    }
+  );
+}
+
+// src/chat/MessageComposer/MessageComposer.tsx
+import { twMerge as twMerge6 } from "tailwind-merge";
+import { useState as useState2, useRef as useRef3, useCallback as useCallback2 } from "react";
+import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+function MessageComposer({
+  onSend,
+  isLoading = false,
+  placeholder = "Type a message...",
+  className
+}) {
+  const [value, setValue] = useState2("");
+  const textareaRef = useRef3(null);
+  const canSend = value.trim().length > 0 && !isLoading;
+  const handleSend = useCallback2(() => {
+    if (!canSend) return;
+    onSend(value.trim());
+    setValue("");
+    textareaRef.current?.focus();
+  }, [canSend, onSend, value]);
+  const handleKeyDown = useCallback2(
+    (e) => {
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        handleSend();
+      }
+    },
+    [handleSend]
+  );
+  return /* @__PURE__ */ jsxs7(
+    "div",
+    {
+      className: twMerge6(
+        "flex items-end gap-3 border-t border-border px-4 py-3 bg-canvas",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx9(
+          "textarea",
+          {
+            ref: textareaRef,
+            value,
+            onChange: (e) => setValue(e.target.value),
+            onKeyDown: handleKeyDown,
+            placeholder,
+            rows: 1,
+            disabled: isLoading,
+            className: twMerge6(
+              "flex-1 resize-none rounded-xl border border-border bg-surface",
+              "px-4 py-2.5 text-sm text-text-primary placeholder:text-text-muted",
+              "focus:border-transparent focus:ring-2 focus:ring-accent/40 focus:outline-none",
+              "disabled:opacity-50 disabled:cursor-not-allowed",
+              "transition-all duration-200"
+            ),
+            style: { colorScheme: "dark" },
+            "aria-label": "Message input"
+          }
+        ),
+        /* @__PURE__ */ jsx9(
+          "button",
+          {
+            type: "button",
+            onClick: handleSend,
+            disabled: !value.trim() || isLoading,
+            "aria-label": "Send message",
+            className: twMerge6(
+              "inline-flex items-center justify-center rounded-xl px-5 py-2.5",
+              "text-sm font-semibold text-white shrink-0",
+              "transition-all duration-200",
+              "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent",
+              value.trim() && !isLoading ? "bg-accent hover:bg-accent-hover hover:scale-[1.02] active:scale-[0.98]" : "bg-accent/30 text-text-muted cursor-not-allowed"
+            ),
+            children: "Send"
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/chat/WelcomeScreen/WelcomeScreen.tsx
+import { twMerge as twMerge7 } from "tailwind-merge";
+import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+function WelcomeScreen({
+  title = "Welcome",
+  message = "How can I help you today?",
+  suggestedQuestions = [],
+  onQuestionSelect,
+  className
+}) {
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      className: twMerge7(
+        "flex flex-1 flex-col items-center justify-center gap-8 p-8 text-center",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx10(
+          "div",
+          {
+            className: "w-14 h-14 rounded-2xl bg-accent/10 border border-border flex items-center justify-center pulse-glow",
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ jsx10("span", { className: "text-2xl", children: "\u2726" })
+          }
+        ),
+        /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-2", children: [
+          title && /* @__PURE__ */ jsx10("h2", { className: "text-2xl font-semibold text-text-primary", children: title }),
+          /* @__PURE__ */ jsx10("p", { className: "text-text-secondary text-base leading-relaxed max-w-sm", children: message })
+        ] }),
+        suggestedQuestions.length > 0 && /* @__PURE__ */ jsx10(
+          "div",
+          {
+            className: "flex flex-wrap justify-center gap-2 max-w-md",
+            role: "group",
+            "aria-label": "Suggested questions",
+            children: suggestedQuestions.map((question) => /* @__PURE__ */ jsx10(
+              "button",
+              {
+                type: "button",
+                onClick: () => onQuestionSelect?.(question),
+                className: twMerge7(
+                  "px-4 py-2 rounded-full text-sm",
+                  "border border-border bg-surface text-text-primary",
+                  "hover:bg-surface-raised hover:border-interactive hover:text-text-primary",
+                  "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent",
+                  "transition-colors duration-200"
+                ),
+                children: question
+              },
+              question
+            ))
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/streaming/StreamingMessage/StreamingMessage.tsx
+import { useEffect as useEffect3, useRef as useRef5 } from "react";
+import { Spinner } from "@surf-kit/core";
+
+// src/hooks/useCharacterDrain.ts
+import { useState as useState3, useRef as useRef4, useEffect as useEffect2 } from "react";
+function useCharacterDrain(target, msPerChar = 15) {
+  const [displayed, setDisplayed] = useState3("");
+  const indexRef = useRef4(0);
+  const lastTimeRef = useRef4(0);
+  const rafRef = useRef4(null);
+  const drainTargetRef = useRef4("");
+  const msPerCharRef = useRef4(msPerChar);
+  msPerCharRef.current = msPerChar;
+  if (target !== "") {
+    drainTargetRef.current = target;
+  }
+  const drainTarget = drainTargetRef.current;
+  const isDraining = displayed.length < drainTarget.length;
+  const tickRef = useRef4(() => {
+  });
+  tickRef.current = (now) => {
+    const currentTarget = drainTargetRef.current;
+    if (currentTarget === "") {
+      rafRef.current = null;
+      return;
+    }
+    if (lastTimeRef.current === 0) lastTimeRef.current = now;
+    const elapsed = now - lastTimeRef.current;
+    const charsToAdvance = Math.floor(elapsed / msPerCharRef.current);
+    if (charsToAdvance > 0 && indexRef.current < currentTarget.length) {
+      const nextIndex = Math.min(indexRef.current + charsToAdvance, currentTarget.length);
+      indexRef.current = nextIndex;
+      lastTimeRef.current = now;
+      setDisplayed(currentTarget.slice(0, nextIndex));
+    }
+    if (indexRef.current < currentTarget.length) {
+      rafRef.current = requestAnimationFrame((t) => tickRef.current(t));
+    } else {
+      rafRef.current = null;
+    }
+  };
+  useEffect2(() => {
+    if (drainTargetRef.current !== "" && indexRef.current < drainTargetRef.current.length && rafRef.current === null) {
+      rafRef.current = requestAnimationFrame((t) => tickRef.current(t));
+    }
+  }, [drainTarget]);
+  useEffect2(() => {
+    if (target === "" && !isDraining && displayed !== "") {
+      indexRef.current = 0;
+      lastTimeRef.current = 0;
+      drainTargetRef.current = "";
+      setDisplayed("");
+    }
+  }, [target, isDraining, displayed]);
+  useEffect2(() => {
+    return () => {
+      if (rafRef.current !== null) {
+        cancelAnimationFrame(rafRef.current);
+        rafRef.current = null;
+      }
+    };
+  }, []);
+  return { displayed, isDraining };
+}
+
+// src/streaming/StreamingMessage/StreamingMessage.tsx
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+var phaseLabels = {
+  idle: "",
+  waiting: "Waiting",
+  thinking: "Thinking",
+  retrieving: "Searching",
+  generating: "Writing",
+  verifying: "Verifying"
+};
+function StreamingMessage({
+  stream,
+  onComplete,
+  showPhases = true,
+  className
+}) {
+  const onCompleteRef = useRef5(onComplete);
+  onCompleteRef.current = onComplete;
+  const wasActiveRef = useRef5(stream.active);
+  useEffect3(() => {
+    if (wasActiveRef.current && !stream.active) {
+      onCompleteRef.current?.();
+    }
+    wasActiveRef.current = stream.active;
+  }, [stream.active]);
+  const phaseLabel = phaseLabels[stream.phase];
+  const { displayed: displayedContent } = useCharacterDrain(stream.content);
+  return /* @__PURE__ */ jsxs9("div", { className, "data-testid": "streaming-message", children: [
+    /* @__PURE__ */ jsxs9("div", { "aria-live": "assertive", className: "sr-only", children: [
+      stream.active && stream.phase !== "idle" && "Response started",
+      !stream.active && stream.content && "Response complete"
+    ] }),
+    showPhases && stream.active && stream.phase !== "idle" && /* @__PURE__ */ jsxs9(
+      "div",
+      {
+        className: "flex items-center gap-2 mb-2 text-sm text-text-secondary",
+        "data-testid": "phase-indicator",
+        children: [
+          /* @__PURE__ */ jsx11("span", { "aria-hidden": "true", children: /* @__PURE__ */ jsx11(Spinner, { size: "sm" }) }),
+          /* @__PURE__ */ jsx11("span", { children: phaseLabel })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs9("div", { className: "text-text-primary whitespace-pre-wrap", children: [
+      displayedContent,
+      stream.active && /* @__PURE__ */ jsx11(
+        "span",
+        {
+          className: "inline-block w-0.5 h-4 bg-accent align-text-bottom animate-pulse ml-0.5",
+          "aria-hidden": "true",
+          "data-testid": "streaming-cursor"
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/chat/AgentChat/AgentChat.tsx
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+function AgentChat({
+  endpoint,
+  title = "Chat",
+  welcomeTitle,
+  welcomeMessage = "How can I help you today?",
+  suggestedQuestions = [],
+  showHeader = true,
+  showWelcomeTitle = true,
+  showSources,
+  showConfidence,
+  showVerification,
+  className
+}) {
+  const { state, actions } = useAgentChat({ apiUrl: endpoint });
+  const hasMessages = state.messages.length > 0;
+  const handleSend = (content) => {
+    void actions.sendMessage(content);
+  };
+  const handleQuestionSelect = (question) => {
+    void actions.sendMessage(question);
+  };
+  return /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      className: twMerge8(
+        "flex flex-col h-full bg-canvas border border-border rounded-xl overflow-hidden",
+        className
+      ),
+      children: [
+        showHeader && /* @__PURE__ */ jsx12("div", { className: "flex items-center justify-between border-b border-border px-4 py-3 bg-surface-raised shrink-0", children: /* @__PURE__ */ jsx12("h1", { className: "text-base font-semibold text-text-primary", children: title }) }),
+        hasMessages ? /* @__PURE__ */ jsx12(
+          MessageThread,
+          {
+            messages: state.messages,
+            streamingSlot: state.isLoading ? /* @__PURE__ */ jsx12(
+              StreamingMessage,
+              {
+                stream: {
+                  active: state.isLoading,
+                  phase: state.streamPhase,
+                  content: state.streamingContent,
+                  sources: [],
+                  agent: null,
+                  agentLabel: null
+                }
+              }
+            ) : void 0,
+            showSources,
+            showConfidence,
+            showVerification
+          }
+        ) : /* @__PURE__ */ jsx12(
+          WelcomeScreen,
+          {
+            title: showWelcomeTitle ? welcomeTitle ?? title : "",
+            message: welcomeMessage,
+            suggestedQuestions,
+            onQuestionSelect: handleQuestionSelect
+          }
+        ),
+        /* @__PURE__ */ jsx12(MessageComposer, { onSend: handleSend, isLoading: state.isLoading })
+      ]
+    }
+  );
+}
+
+// src/response/ErrorResponse/ErrorResponse.tsx
+import { Alert, Button } from "@surf-kit/core";
+import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+function ErrorResponse({ error, onRetry, className }) {
+  return /* @__PURE__ */ jsx13("div", { role: "alert", className, "data-testid": "error-response", children: /* @__PURE__ */ jsxs11(Alert, { intent: "error", title: "Error", children: [
+    /* @__PURE__ */ jsx13("p", { children: error.message }),
+    error.retryable && onRetry && /* @__PURE__ */ jsx13("div", { className: "mt-3", children: /* @__PURE__ */ jsx13(
+      Button,
+      {
+        intent: "secondary",
+        size: "sm",
+        onPress: onRetry,
+        "aria-label": "Retry",
+        children: "Retry"
+      }
+    ) })
+  ] }) });
+}
+
+// src/sources/SourceInline/SourceInline.tsx
+import { Tooltip } from "@surf-kit/core";
+import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+function SourceInline({ source, index, className }) {
+  const tooltipContent = `${source.title}${source.section ? ` - ${source.section}` : ""}: ${source.snippet.slice(0, 120)}${source.snippet.length > 120 ? "..." : ""}`;
+  return /* @__PURE__ */ jsx14(Tooltip, { content: tooltipContent, placement: "top", children: /* @__PURE__ */ jsxs12(
+    "span",
+    {
+      className: `inline-flex items-center justify-center text-xs text-accent font-medium cursor-help ${className ?? ""}`,
+      "data-testid": "source-inline",
+      "data-document-id": source.document_id,
+      "aria-label": `Source ${index}: ${source.title}`,
+      children: [
+        "[",
+        index,
+        "]"
+      ]
+    }
+  ) });
+}
+
+// src/sources/SourceDrawer/SourceDrawer.tsx
+import { Sheet, Badge as Badge3 } from "@surf-kit/core";
+import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+function getConfidenceIntent3(confidence) {
+  if (confidence >= 0.8) return "success";
+  if (confidence >= 0.5) return "warning";
+  return "error";
+}
+function SourceDrawer({ source, isOpen, onClose, className }) {
+  if (!source) return null;
+  return /* @__PURE__ */ jsx15(
+    Sheet,
+    {
+      isOpen,
+      onClose,
+      title: source.title,
+      size: "md",
+      className,
+      children: /* @__PURE__ */ jsxs13("div", { "data-testid": "source-drawer", "data-document-id": source.document_id, children: [
+        source.section && /* @__PURE__ */ jsx15("p", { className: "text-sm text-text-secondary mb-4", children: source.section }),
+        /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 mb-4", children: [
+          /* @__PURE__ */ jsx15("span", { className: "text-sm text-text-secondary", children: "Confidence:" }),
+          /* @__PURE__ */ jsxs13(Badge3, { intent: getConfidenceIntent3(source.confidence), size: "sm", children: [
+            Math.round(source.confidence * 100),
+            "%"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs13("div", { className: "mb-4", children: [
+          /* @__PURE__ */ jsx15("h3", { className: "text-sm font-medium text-text-primary mb-2", children: "Snippet" }),
+          /* @__PURE__ */ jsx15("p", { className: "text-sm text-text-secondary bg-surface-raised p-4 rounded-lg", children: source.snippet })
+        ] }),
+        source.url && /* @__PURE__ */ jsxs13("div", { children: [
+          /* @__PURE__ */ jsx15("h3", { className: "text-sm font-medium text-text-primary mb-2", children: "Source URL" }),
+          /* @__PURE__ */ jsx15(
+            "a",
+            {
+              href: source.url,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: "text-sm text-accent hover:underline break-all",
+              children: source.url
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+}
+
+// src/sources/SourceBadge/SourceBadge.tsx
+import { Badge as Badge4 } from "@surf-kit/core";
+import { jsxs as jsxs14 } from "react/jsx-runtime";
+function SourceBadge({ count, className }) {
+  if (count === 0) return null;
+  return /* @__PURE__ */ jsxs14(Badge4, { intent: "info", size: "sm", className, "data-testid": "source-badge", children: [
+    count,
+    " ",
+    count === 1 ? "source" : "sources"
+  ] });
+}
+
+// src/confidence/ConfidenceBadge/ConfidenceBadge.tsx
+import { Badge as Badge5 } from "@surf-kit/core";
+import { jsx as jsx16 } from "react/jsx-runtime";
+var intentMap = {
+  high: "success",
+  medium: "warning",
+  low: "error"
+};
+var labelMap = {
+  high: "High confidence",
+  medium: "Medium confidence",
+  low: "Low confidence"
+};
+function ConfidenceBadge({ confidence, className }) {
+  const level = confidence.overall;
+  return /* @__PURE__ */ jsx16(
+    Badge5,
+    {
+      intent: intentMap[level],
+      size: "sm",
+      role: "status",
+      "aria-label": labelMap[level],
+      className,
+      children: level.charAt(0).toUpperCase() + level.slice(1)
+    }
+  );
+}
+
+// src/confidence/ConfidenceBreakdown/ConfidenceBreakdown.tsx
+import { useState as useState4 } from "react";
+
+// src/confidence/ConfidenceMeter/ConfidenceMeter.tsx
+import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+function getBarColor(value) {
+  if (value >= 0.8) return "bg-green-500";
+  if (value >= 0.5) return "bg-yellow-500";
+  return "bg-red-500";
+}
+function ConfidenceMeter({ value, label, className }) {
+  const clamped = Math.max(0, Math.min(1, value));
+  const pct = Math.round(clamped * 100);
+  return /* @__PURE__ */ jsxs15("div", { className, "data-testid": "confidence-meter", children: [
+    /* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-between mb-1", children: [
+      /* @__PURE__ */ jsx17("span", { className: "text-xs font-medium text-text-secondary", children: label }),
+      /* @__PURE__ */ jsxs15("span", { className: "text-xs text-text-secondary", children: [
+        pct,
+        "%"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx17(
+      "div",
+      {
+        className: "h-2 w-full rounded-full bg-surface-secondary overflow-hidden",
+        role: "progressbar",
+        "aria-valuenow": pct,
+        "aria-valuemin": 0,
+        "aria-valuemax": 100,
+        "aria-label": `${label}: ${pct}%`,
+        children: /* @__PURE__ */ jsx17(
+          "div",
+          {
+            className: `h-full rounded-full transition-all duration-300 ${getBarColor(clamped)}`,
+            style: { width: `${pct}%` }
+          }
+        )
+      }
+    )
+  ] });
+}
+
+// src/confidence/ConfidenceBreakdown/ConfidenceBreakdown.tsx
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
+var dimensions = [
+  { key: "retrieval_quality", label: "Retrieval Quality" },
+  { key: "source_authority", label: "Source Authority" },
+  { key: "answer_groundedness", label: "Answer Groundedness" },
+  { key: "recency", label: "Recency" }
+];
+function ConfidenceBreakdown({
+  confidence,
+  expandable = true,
+  defaultExpanded = false,
+  className
+}) {
+  const [expanded, setExpanded] = useState4(defaultExpanded);
+  const isExpanded = expandable ? expanded : true;
+  return /* @__PURE__ */ jsxs16("div", { className: `rounded-xl border border-border bg-surface ${className ?? ""}`, "data-testid": "confidence-breakdown", children: [
+    /* @__PURE__ */ jsxs16(
+      "button",
+      {
+        type: "button",
+        className: "flex w-full items-center justify-between px-4 py-3 text-left",
+        onClick: () => expandable && setExpanded((prev) => !prev),
+        "aria-expanded": isExpanded,
+        disabled: !expandable,
+        children: [
+          /* @__PURE__ */ jsx18("span", { className: "text-sm font-medium text-text-primary", children: "Confidence" }),
+          /* @__PURE__ */ jsx18(ConfidenceBadge, { confidence })
+        ]
+      }
+    ),
+    isExpanded && /* @__PURE__ */ jsxs16(
+      "div",
+      {
+        className: "border-t border-border px-4 py-3 space-y-3 animate-in fade-in slide-in-from-top-1 duration-200",
+        "data-testid": "confidence-breakdown-details",
+        children: [
+          dimensions.map((dim) => /* @__PURE__ */ jsx18(
+            ConfidenceMeter,
+            {
+              value: confidence[dim.key],
+              label: dim.label
+            },
+            dim.key
+          )),
+          confidence.reasoning && /* @__PURE__ */ jsx18("p", { className: "text-xs text-text-secondary mt-2", children: confidence.reasoning })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/confidence/VerificationBadge/VerificationBadge.tsx
+import { Badge as Badge6 } from "@surf-kit/core";
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
+var config = {
+  passed: {
+    intent: "success",
+    label: "Verified",
+    icon: "\u2713",
+    ariaLabel: "Verification passed"
+  },
+  flagged: {
+    intent: "warning",
+    label: "Flagged",
+    icon: "\u26A0",
+    ariaLabel: "Verification flagged"
+  },
+  failed: {
+    intent: "error",
+    label: "Failed",
+    icon: "\u2717",
+    ariaLabel: "Verification failed"
+  }
+};
+function VerificationBadge({ verification, className }) {
+  const { intent, label, icon, ariaLabel } = config[verification.status];
+  return /* @__PURE__ */ jsxs17(
+    Badge6,
+    {
+      intent,
+      size: "sm",
+      role: "status",
+      "aria-label": ariaLabel,
+      className,
+      children: [
+        /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", className: "mr-1", children: icon }),
+        label
+      ]
+    }
+  );
+}
+
+// src/confidence/VerificationDetail/VerificationDetail.tsx
+import { useState as useState5 } from "react";
+import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
+function VerificationDetail({
+  verification,
+  expandable = true,
+  defaultExpanded = false,
+  className
+}) {
+  const [expanded, setExpanded] = useState5(defaultExpanded);
+  const isExpanded = expandable ? expanded : true;
+  return /* @__PURE__ */ jsxs18("div", { className: `rounded-xl border border-border bg-surface ${className ?? ""}`, "data-testid": "verification-detail", children: [
+    /* @__PURE__ */ jsxs18(
+      "button",
+      {
+        type: "button",
+        className: "flex w-full items-center justify-between px-4 py-3 text-left",
+        onClick: () => expandable && setExpanded((prev) => !prev),
+        "aria-expanded": isExpanded,
+        disabled: !expandable,
+        children: [
+          /* @__PURE__ */ jsx20("span", { className: "text-sm font-medium text-text-primary", children: "Verification" }),
+          /* @__PURE__ */ jsx20(VerificationBadge, { verification })
+        ]
+      }
+    ),
+    isExpanded && /* @__PURE__ */ jsxs18(
+      "div",
+      {
+        className: "border-t border-border px-4 py-3 space-y-2 animate-in fade-in slide-in-from-top-1 duration-200",
+        "data-testid": "verification-detail-content",
+        children: [
+          /* @__PURE__ */ jsxs18("div", { className: "flex gap-4 text-xs text-text-secondary", children: [
+            /* @__PURE__ */ jsxs18("span", { "data-testid": "claims-checked", children: [
+              "Claims checked: ",
+              /* @__PURE__ */ jsx20("strong", { className: "text-text-primary", children: verification.claims_checked })
+            ] }),
+            /* @__PURE__ */ jsxs18("span", { "data-testid": "claims-verified", children: [
+              "Claims verified: ",
+              /* @__PURE__ */ jsx20("strong", { className: "text-text-primary", children: verification.claims_verified })
+            ] })
+          ] }),
+          verification.flags.length > 0 && /* @__PURE__ */ jsx20("ul", { className: "mt-2 space-y-1", "data-testid": "verification-flags", children: verification.flags.map((flag, i) => /* @__PURE__ */ jsxs18("li", { className: "flex items-start gap-2 text-xs text-text-secondary", children: [
+            /* @__PURE__ */ jsx20("span", { className: "text-yellow-500 shrink-0", "aria-hidden": "true", children: "\u26A0" }),
+            flag
+          ] }, i)) })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/hooks/useAgentTheme.ts
+import { useMemo } from "react";
+var DEFAULT_ACCENT = "#6366f1";
+var DEFAULT_LABEL = "Agent";
+function useAgentTheme(agentId, agentThemes) {
+  return useMemo(() => {
+    if (!agentId) {
+      return { accent: DEFAULT_ACCENT, icon: null, label: DEFAULT_LABEL };
+    }
+    const theme = agentThemes?.[agentId];
+    if (!theme) {
+      return { accent: DEFAULT_ACCENT, icon: null, label: agentId };
+    }
+    return {
+      accent: theme.accent ?? DEFAULT_ACCENT,
+      icon: theme.icon ?? null,
+      label: theme.label
+    };
+  }, [agentId, agentThemes]);
+}
+
+// src/agent-identity/AgentAvatar/AgentAvatar.tsx
+import { jsx as jsx21 } from "react/jsx-runtime";
+var sizeMap = {
+  sm: "h-6 w-6 text-xs",
+  md: "h-8 w-8 text-sm",
+  lg: "h-10 w-10 text-base"
+};
+var iconSizeMap = {
+  sm: 14,
+  md: 18,
+  lg: 22
+};
+function AgentAvatar({ agentId, agent, size = "md", agentThemes, className }) {
+  const resolvedId = agent?.id ?? agentId ?? null;
+  const themes = agent ? { ...agentThemes, [agent.id]: agent } : agentThemes;
+  const { accent, icon: Icon, label } = useAgentTheme(resolvedId, themes);
+  const initial = label.charAt(0).toUpperCase();
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      className: `inline-flex items-center justify-center rounded-full shrink-0 font-medium text-white ${sizeMap[size]} ${className ?? ""}`,
+      style: { backgroundColor: accent },
+      role: "img",
+      "aria-label": `${label} avatar`,
+      "data-testid": "agent-avatar",
+      children: Icon ? /* @__PURE__ */ jsx21(Icon, { size: iconSizeMap[size], className: "text-white" }) : /* @__PURE__ */ jsx21("span", { "aria-hidden": "true", children: initial })
+    }
+  );
+}
+
+// src/agent-identity/AgentLabel/AgentLabel.tsx
+import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
+function AgentLabel({ agent, className }) {
+  const accent = agent.accent ?? "#6366f1";
+  return /* @__PURE__ */ jsxs19(
+    "span",
+    {
+      className: `text-xs font-medium ${className ?? ""}`,
+      "data-testid": "agent-label",
+      children: [
+        "Answered by",
+        " ",
+        /* @__PURE__ */ jsx22("span", { style: { color: accent }, children: agent.label })
+      ]
+    }
+  );
+}
+
+// src/agent-identity/AgentHandoff/AgentHandoff.tsx
+import { jsx as jsx23, jsxs as jsxs20 } from "react/jsx-runtime";
+function AgentHandoff({ from, to, className }) {
+  return /* @__PURE__ */ jsxs20(
+    "div",
+    {
+      className: `flex items-center gap-3 px-4 py-3 rounded-xl border border-border bg-surface ${className ?? ""}`,
+      "data-testid": "agent-handoff",
+      children: [
+        /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 animate-in fade-in slide-in-from-left-2 duration-300", children: [
+          /* @__PURE__ */ jsx23(AgentAvatar, { agent: from, size: "sm" }),
+          /* @__PURE__ */ jsx23("span", { className: "text-xs text-text-secondary", children: from.label })
+        ] }),
+        /* @__PURE__ */ jsx23("span", { className: "text-text-secondary text-xs", "aria-hidden": "true", children: "\u2192" }),
+        /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 animate-in fade-in slide-in-from-right-2 duration-300", children: [
+          /* @__PURE__ */ jsx23(AgentAvatar, { agent: to, size: "sm" }),
+          /* @__PURE__ */ jsx23("span", { className: "text-xs text-text-secondary", children: to.label })
+        ] }),
+        /* @__PURE__ */ jsxs20("div", { className: "sr-only", role: "status", "aria-live": "polite", children: [
+          "Handing off from ",
+          from.label,
+          " to ",
+          to.label
+        ] })
+      ]
+    }
+  );
+}
+
+// src/agent-identity/RoutingIndicator/RoutingIndicator.tsx
+import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
+function RoutingIndicator({ from, to, reason, className }) {
+  return /* @__PURE__ */ jsxs21(
+    "div",
+    {
+      className: `inline-flex items-center gap-1.5 rounded-md border border-border/50 bg-surface-secondary/50 px-2.5 py-1 font-mono text-[11px] text-text-secondary ${className ?? ""}`,
+      "data-testid": "routing-indicator",
+      children: [
+        /* @__PURE__ */ jsx24("span", { className: "opacity-60", children: "Routed:" }),
+        /* @__PURE__ */ jsx24("span", { children: from }),
+        /* @__PURE__ */ jsx24("span", { className: "opacity-40", "aria-hidden": "true", children: "\u2192" }),
+        /* @__PURE__ */ jsx24("span", { children: to }),
+        reason && /* @__PURE__ */ jsxs21("span", { className: "opacity-50 ml-1", title: reason, children: [
+          "(",
+          reason,
+          ")"
+        ] })
+      ]
+    }
+  );
+}
+
+// src/streaming/ThinkingIndicator/ThinkingIndicator.tsx
+import { useReducedMotion } from "@surf-kit/hooks";
+import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
+function ThinkingIndicator({ label = "Thinking...", className }) {
+  const reducedMotion = useReducedMotion();
+  return /* @__PURE__ */ jsxs22(
+    "span",
+    {
+      role: "status",
+      className: `inline-flex items-center gap-2 text-sm ${className ?? ""}`,
+      "data-testid": "thinking-indicator",
+      children: [
+        /* @__PURE__ */ jsx25("span", { className: "text-text-secondary", children: label }),
+        !reducedMotion && /* @__PURE__ */ jsxs22("span", { className: "flex gap-1", "aria-hidden": "true", "data-testid": "animated-dots", children: [
+          /* @__PURE__ */ jsx25("span", { className: "w-1.5 h-1.5 rounded-full bg-current animate-bounce [animation-delay:0ms]" }),
+          /* @__PURE__ */ jsx25("span", { className: "w-1.5 h-1.5 rounded-full bg-current animate-bounce [animation-delay:150ms]" }),
+          /* @__PURE__ */ jsx25("span", { className: "w-1.5 h-1.5 rounded-full bg-current animate-bounce [animation-delay:300ms]" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/streaming/ToolExecution/ToolExecution.tsx
+import { Spinner as Spinner2 } from "@surf-kit/core";
+import { jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
+var defaultLabels = {
+  search: "Searching knowledge base...",
+  retrieve: "Retrieving documents...",
+  calculate: "Calculating..."
+};
+function ToolExecution({ tool, label, className }) {
+  const displayLabel = label ?? defaultLabels[tool] ?? `Running ${tool}...`;
+  return /* @__PURE__ */ jsxs23(
+    "div",
+    {
+      className: `flex items-center gap-2 text-sm text-text-secondary ${className ?? ""}`,
+      role: "status",
+      "data-testid": "tool-execution",
+      children: [
+        /* @__PURE__ */ jsx26("span", { "aria-hidden": "true", children: /* @__PURE__ */ jsx26(Spinner2, { size: "sm" }) }),
+        /* @__PURE__ */ jsx26("span", { children: displayLabel })
+      ]
+    }
+  );
+}
+
+// src/streaming/RetrievalProgress/RetrievalProgress.tsx
+import { Spinner as Spinner3 } from "@surf-kit/core";
+import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
+function RetrievalProgress({ sources, isActive, className }) {
+  return /* @__PURE__ */ jsxs24(
+    "div",
+    {
+      className: `space-y-2 ${className ?? ""}`,
+      role: "status",
+      "aria-label": isActive ? `Retrieving sources, ${sources.length} found so far` : `${sources.length} sources found`,
+      "data-testid": "retrieval-progress",
+      children: [
+        isActive && /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-2 text-sm text-text-secondary", children: [
+          /* @__PURE__ */ jsx27("span", { "aria-hidden": "true", children: /* @__PURE__ */ jsx27(Spinner3, { size: "sm" }) }),
+          /* @__PURE__ */ jsx27("span", { children: "Retrieving sources..." })
+        ] }),
+        sources.length > 0 && /* @__PURE__ */ jsx27("ul", { className: "space-y-1", "data-testid": "source-list", children: sources.map((source, index) => /* @__PURE__ */ jsxs24(
+          "li",
+          {
+            className: "text-sm text-text-secondary flex items-center gap-2 animate-in fade-in slide-in-from-left-2",
+            style: { animationDelay: `${index * 100}ms`, animationFillMode: "both" },
+            "data-testid": "retrieval-source-item",
+            children: [
+              /* @__PURE__ */ jsx27("span", { className: "w-1.5 h-1.5 rounded-full bg-accent flex-shrink-0", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx27("span", { className: "truncate", children: source.title })
+            ]
+          },
+          source.document_id
+        )) })
+      ]
+    }
+  );
+}
+
+// src/streaming/VerificationProgress/VerificationProgress.tsx
+import { jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
+function VerificationProgress({
+  isActive,
+  label = "Checking accuracy...",
+  className
+}) {
+  if (!isActive) return null;
+  return /* @__PURE__ */ jsxs25(
+    "div",
+    {
+      className: `flex items-center gap-2 text-sm ${className ?? ""}`,
+      role: "status",
+      "data-testid": "verification-progress",
+      children: [
+        /* @__PURE__ */ jsxs25(
+          "svg",
+          {
+            className: "w-4 h-4 animate-spin text-accent",
+            xmlns: "http://www.w3.org/2000/svg",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx28("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+              /* @__PURE__ */ jsx28("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx28("span", { className: "text-accent animate-pulse", children: label })
+      ]
+    }
+  );
+}
+
+// src/streaming/TypewriterText/TypewriterText.tsx
+import { useEffect as useEffect4, useState as useState6 } from "react";
+import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
+function TypewriterText({
+  text,
+  speed = 30,
+  delay = 0,
+  onComplete,
+  className = "",
+  showCursor = true
+}) {
+  const [displayedText, setDisplayedText] = useState6("");
+  const [isComplete, setIsComplete] = useState6(false);
+  useEffect4(() => {
+    setDisplayedText("");
+    setIsComplete(false);
+    let index = 0;
+    let interval;
+    const timeout = setTimeout(() => {
+      interval = setInterval(() => {
+        if (index < text.length) {
+          setDisplayedText(text.slice(0, index + 1));
+          index++;
+        } else {
+          clearInterval(interval);
+          setIsComplete(true);
+          onComplete?.();
+        }
+      }, speed);
+    }, delay);
+    return () => {
+      clearTimeout(timeout);
+      clearInterval(interval);
+    };
+  }, [text, speed, delay, onComplete]);
+  return /* @__PURE__ */ jsxs26("span", { className, children: [
+    displayedText,
+    showCursor && !isComplete && /* @__PURE__ */ jsx29("span", { className: "typewriter-cursor", "aria-hidden": "true" })
+  ] });
+}
+
+// src/chat/ConversationList/ConversationList.tsx
+import { twMerge as twMerge9 } from "tailwind-merge";
+import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
+function ConversationList({
+  conversations,
+  activeId,
+  onSelect,
+  onDelete,
+  onNew,
+  className
+}) {
+  return /* @__PURE__ */ jsxs27(
+    "nav",
+    {
+      "aria-label": "Conversation list",
+      className: twMerge9("flex flex-col h-full bg-canvas", className),
+      children: [
+        onNew && /* @__PURE__ */ jsx30("div", { className: "p-3 border-b border-border", children: /* @__PURE__ */ jsx30(
+          "button",
+          {
+            type: "button",
+            onClick: onNew,
+            className: "w-full px-4 py-2.5 rounded-xl text-sm font-semibold bg-accent text-white hover:bg-accent-hover transition-all duration-200",
+            children: "New conversation"
+          }
+        ) }),
+        /* @__PURE__ */ jsxs27("ul", { role: "list", className: "flex-1 overflow-y-auto", children: [
+          conversations.map((conversation) => {
+            const isActive = conversation.id === activeId;
+            return /* @__PURE__ */ jsxs27(
+              "li",
+              {
+                className: twMerge9(
+                  "flex items-start border-b border-border transition-colors duration-200",
+                  "hover:bg-surface",
+                  isActive && "bg-surface-raised border-l-2 border-l-accent"
+                ),
+                children: [
+                  /* @__PURE__ */ jsxs27(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => onSelect(conversation.id),
+                      "aria-current": isActive ? "true" : void 0,
+                      className: "flex-1 min-w-0 text-left px-4 py-3",
+                      children: [
+                        /* @__PURE__ */ jsx30("div", { className: "text-sm font-medium text-brand-cream truncate", children: conversation.title }),
+                        /* @__PURE__ */ jsx30("div", { className: "text-xs text-brand-cream/40 truncate mt-0.5 leading-relaxed", children: conversation.lastMessage })
+                      ]
+                    }
+                  ),
+                  onDelete && /* @__PURE__ */ jsx30(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => onDelete(conversation.id),
+                      "aria-label": `Delete ${conversation.title}`,
+                      className: "shrink-0 p-1.5 m-2 rounded-lg text-brand-cream/25 hover:text-brand-watermelon hover:bg-brand-watermelon/10 transition-colors duration-200",
+                      children: /* @__PURE__ */ jsxs27(
+                        "svg",
+                        {
+                          xmlns: "http://www.w3.org/2000/svg",
+                          width: "14",
+                          height: "14",
+                          viewBox: "0 0 24 24",
+                          fill: "none",
+                          stroke: "currentColor",
+                          strokeWidth: "2",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          "aria-hidden": "true",
+                          children: [
+                            /* @__PURE__ */ jsx30("polyline", { points: "3 6 5 6 21 6" }),
+                            /* @__PURE__ */ jsx30("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+                          ]
+                        }
+                      )
+                    }
+                  )
+                ]
+              },
+              conversation.id
+            );
+          }),
+          conversations.length === 0 && /* @__PURE__ */ jsx30("li", { className: "px-4 py-8 text-center", children: /* @__PURE__ */ jsx30("span", { className: "text-sm text-brand-cream/30 font-body", children: "No conversations yet" }) })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/layouts/AgentFullPage/AgentFullPage.tsx
+import { twMerge as twMerge10 } from "tailwind-merge";
+import { useState as useState7, useCallback as useCallback3 } from "react";
+import { Fragment, jsx as jsx31, jsxs as jsxs28 } from "react/jsx-runtime";
+function AgentFullPage({
+  endpoint,
+  title = "Chat",
+  showConversationList = false,
+  conversations = [],
+  activeConversationId,
+  onConversationSelect,
+  onConversationDelete,
+  onNewConversation,
+  className
+}) {
+  const [sidebarOpen, setSidebarOpen] = useState7(false);
+  const handleSelect = useCallback3(
+    (id) => {
+      onConversationSelect?.(id);
+      setSidebarOpen(false);
+    },
+    [onConversationSelect]
+  );
+  return /* @__PURE__ */ jsxs28(
+    "div",
+    {
+      className: twMerge10("flex h-screen w-full overflow-hidden bg-brand-dark", className),
+      "data-testid": "agent-full-page",
+      children: [
+        showConversationList && /* @__PURE__ */ jsxs28(Fragment, { children: [
+          sidebarOpen && /* @__PURE__ */ jsx31(
+            "div",
+            {
+              className: "fixed inset-0 bg-brand-dark/80 backdrop-blur-sm z-30 md:hidden",
+              onClick: () => setSidebarOpen(false),
+              "data-testid": "sidebar-overlay"
+            }
+          ),
+          /* @__PURE__ */ jsx31(
+            "aside",
+            {
+              className: twMerge10(
+                "bg-brand-dark border-r border-brand-gold/15 w-72 shrink-0 flex-col z-40",
+                // Desktop: always visible
+                "hidden md:flex",
+                // Mobile: overlay when open
+                sidebarOpen && "fixed inset-y-0 left-0 flex md:relative"
+              ),
+              "aria-label": "Conversations sidebar",
+              children: /* @__PURE__ */ jsx31(
+                ConversationList,
+                {
+                  conversations,
+                  activeId: activeConversationId,
+                  onSelect: handleSelect,
+                  onDelete: onConversationDelete,
+                  onNew: onNewConversation
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs28("div", { className: "flex-1 flex flex-col min-w-0 bg-brand-dark", children: [
+          showConversationList && /* @__PURE__ */ jsx31("div", { className: "md:hidden flex items-center border-b border-brand-gold/15 px-3 py-2 bg-brand-dark-panel/60 backdrop-blur-sm", children: /* @__PURE__ */ jsx31(
+            "button",
+            {
+              type: "button",
+              onClick: () => setSidebarOpen(true),
+              "aria-label": "Open conversations sidebar",
+              className: "p-2 rounded-xl text-brand-cream/60 hover:text-brand-cream hover:bg-brand-dark-panel transition-colors duration-200",
+              children: /* @__PURE__ */ jsxs28(
+                "svg",
+                {
+                  xmlns: "http://www.w3.org/2000/svg",
+                  width: "20",
+                  height: "20",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  "aria-hidden": "true",
+                  children: [
+                    /* @__PURE__ */ jsx31("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
+                    /* @__PURE__ */ jsx31("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
+                    /* @__PURE__ */ jsx31("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
+                  ]
+                }
+              )
+            }
+          ) }),
+          /* @__PURE__ */ jsx31(
+            AgentChat,
+            {
+              endpoint,
+              title,
+              className: "flex-1 rounded-none border-0"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/layouts/AgentPanel/AgentPanel.tsx
+import { twMerge as twMerge11 } from "tailwind-merge";
+import { useRef as useRef6, useEffect as useEffect5 } from "react";
+import { jsx as jsx32, jsxs as jsxs29 } from "react/jsx-runtime";
+function AgentPanel({
+  endpoint,
+  isOpen,
+  onClose,
+  side = "right",
+  width = 400,
+  title = "Chat",
+  className
+}) {
+  const panelRef = useRef6(null);
+  useEffect5(() => {
+    if (!isOpen) return;
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [isOpen, onClose]);
+  const widthStyle = typeof width === "number" ? `${width}px` : width;
+  return /* @__PURE__ */ jsxs29(
+    "div",
+    {
+      className: twMerge11("fixed inset-0 z-50", !isOpen && "pointer-events-none"),
+      "aria-hidden": !isOpen,
+      children: [
+        /* @__PURE__ */ jsx32(
+          "div",
+          {
+            className: twMerge11(
+              "fixed inset-0 transition-opacity duration-300",
+              isOpen ? "opacity-100 bg-brand-dark/70 backdrop-blur-sm pointer-events-auto" : "opacity-0 pointer-events-none"
+            ),
+            onClick: isOpen ? onClose : void 0,
+            "data-testid": "panel-backdrop"
+          }
+        ),
+        /* @__PURE__ */ jsxs29(
+          "div",
+          {
+            ref: panelRef,
+            role: "dialog",
+            "aria-label": title,
+            "aria-modal": isOpen ? "true" : void 0,
+            style: { width: widthStyle, maxWidth: "100vw" },
+            className: twMerge11(
+              "fixed top-0 h-full flex flex-col z-50 bg-brand-dark shadow-card",
+              "transition-transform duration-300 ease-in-out",
+              side === "left" ? `left-0 border-r border-brand-gold/15 ${isOpen ? "translate-x-0" : "-translate-x-full"}` : `right-0 border-l border-brand-gold/15 ${isOpen ? "translate-x-0" : "translate-x-full"}`,
+              className
+            ),
+            children: [
+              /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between border-b border-brand-gold/15 px-5 py-3.5 bg-brand-dark-panel/60 backdrop-blur-sm shrink-0", children: [
+                /* @__PURE__ */ jsx32("h2", { className: "text-base font-display font-semibold text-brand-cream", children: title }),
+                /* @__PURE__ */ jsx32(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: onClose,
+                    "aria-label": "Close panel",
+                    className: "rounded-xl p-2 text-brand-cream/40 hover:text-brand-cream/80 hover:bg-brand-cream/5 transition-colors duration-200",
+                    children: /* @__PURE__ */ jsxs29("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+                      /* @__PURE__ */ jsx32("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                      /* @__PURE__ */ jsx32("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                    ] })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx32(
+                AgentChat,
+                {
+                  endpoint,
+                  title,
+                  showHeader: false,
+                  showWelcomeTitle: false,
+                  className: "flex-1 rounded-none border-0"
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/layouts/AgentWidget/AgentWidget.tsx
+import { twMerge as twMerge12 } from "tailwind-merge";
+import { useState as useState8, useCallback as useCallback4 } from "react";
+import { jsx as jsx33, jsxs as jsxs30 } from "react/jsx-runtime";
+function AgentWidget({
+  endpoint,
+  position = "bottom-right",
+  triggerLabel = "Chat",
+  title = "Chat",
+  className
+}) {
+  const [isOpen, setIsOpen] = useState8(false);
+  const toggle = useCallback4(() => {
+    setIsOpen((prev) => !prev);
+  }, []);
+  const positionClasses = position === "bottom-left" ? "left-4 bottom-4" : "right-4 bottom-4";
+  const popoverPositionClasses = position === "bottom-left" ? "left-4 bottom-20" : "right-4 bottom-20";
+  const popoverOrigin = position === "bottom-left" ? "origin-bottom-left" : "origin-bottom-right";
+  return /* @__PURE__ */ jsxs30("div", { className, children: [
+    /* @__PURE__ */ jsxs30(
+      "div",
+      {
+        role: "dialog",
+        "aria-label": title,
+        "aria-hidden": !isOpen,
+        className: twMerge12(
+          "fixed z-50 flex flex-col",
+          "w-[min(400px,calc(100vw-2rem))] h-[min(600px,calc(100vh-6rem))]",
+          "rounded-2xl overflow-hidden border border-brand-gold/15",
+          "bg-brand-dark/95 backdrop-blur-[12px] shadow-card",
+          popoverPositionClasses,
+          popoverOrigin,
+          "transition-all duration-200 ease-out",
+          isOpen ? "opacity-100 scale-100 pointer-events-auto translate-y-0" : "opacity-0 scale-95 pointer-events-none translate-y-2"
+        ),
+        children: [
+          /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between px-4 py-2.5 bg-brand-dark-panel/80 border-b border-brand-gold/15 shrink-0", children: [
+            /* @__PURE__ */ jsx33("h2", { className: "text-sm font-display font-semibold text-brand-cream", children: title }),
+            /* @__PURE__ */ jsx33(
+              "button",
+              {
+                type: "button",
+                onClick: () => setIsOpen(false),
+                "aria-label": "Minimize chat",
+                className: "rounded-lg p-1.5 text-brand-cream/40 hover:text-brand-cream/70 transition-colors duration-200",
+                children: /* @__PURE__ */ jsxs30("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+                  /* @__PURE__ */ jsx33("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                  /* @__PURE__ */ jsx33("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                ] })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx33(
+            AgentChat,
+            {
+              endpoint,
+              title,
+              showHeader: false,
+              showWelcomeTitle: false,
+              className: "flex-1 rounded-none border-0 min-h-0"
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx33(
+      "button",
+      {
+        type: "button",
+        onClick: toggle,
+        "aria-label": isOpen ? "Close chat" : triggerLabel,
+        "aria-expanded": isOpen,
+        className: twMerge12(
+          "fixed z-50 flex items-center justify-center w-14 h-14 rounded-full",
+          "bg-brand-blue text-brand-cream shadow-glow-cyan",
+          "hover:bg-brand-cyan hover:shadow-glow-cyan hover:scale-105",
+          "active:scale-95",
+          "transition-all duration-200",
+          positionClasses
+        ),
+        children: isOpen ? /* @__PURE__ */ jsxs30("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsx33("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+          /* @__PURE__ */ jsx33("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+        ] }) : /* @__PURE__ */ jsx33("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx33("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" }) })
+      }
+    )
+  ] });
+}
+
+// src/layouts/AgentEmbed/AgentEmbed.tsx
+import { twMerge as twMerge13 } from "tailwind-merge";
+import { jsx as jsx34 } from "react/jsx-runtime";
+function AgentEmbed({
+  endpoint,
+  title = "Chat",
+  className
+}) {
+  return /* @__PURE__ */ jsx34(
+    "div",
+    {
+      className: twMerge13("w-full h-full min-h-0", className),
+      "data-testid": "agent-embed",
+      children: /* @__PURE__ */ jsx34(
+        AgentChat,
+        {
+          endpoint,
+          title,
+          className: "h-full rounded-none border-0"
+        }
+      )
+    }
+  );
+}
+
+// src/feedback/ThumbsFeedback/ThumbsFeedback.tsx
+import { useState as useState9 } from "react";
+import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
+function ThumbsFeedback({
+  messageId,
+  onFeedback,
+  state = null,
+  onNegative,
+  className
+}) {
+  const [selected, setSelected] = useState9(state);
+  const handleClick = (rating) => {
+    setSelected(rating);
+    onFeedback(messageId, rating);
+    if (rating === "negative" && onNegative) {
+      onNegative();
+    }
+  };
+  return /* @__PURE__ */ jsxs31(
+    "div",
+    {
+      className: `inline-flex items-center gap-0.5 ${className ?? ""}`,
+      role: "group",
+      "aria-label": "Rate this response",
+      "data-testid": "thumbs-feedback",
+      children: [
+        /* @__PURE__ */ jsx35(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleClick("positive"),
+            "aria-label": "Thumbs up",
+            "aria-pressed": selected === "positive",
+            className: `p-1.5 rounded-md transition-colors duration-200 ${selected === "positive" ? "text-brand-cyan bg-brand-cyan/15" : "text-brand-cream/30 hover:text-brand-cyan hover:bg-brand-cyan/10"}`,
+            "data-testid": "thumbs-up",
+            children: /* @__PURE__ */ jsxs31(
+              "svg",
+              {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                "aria-hidden": "true",
+                children: [
+                  /* @__PURE__ */ jsx35("path", { d: "M7 10v12" }),
+                  /* @__PURE__ */ jsx35("path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z" })
+                ]
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx35(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleClick("negative"),
+            "aria-label": "Thumbs down",
+            "aria-pressed": selected === "negative",
+            className: `p-1.5 rounded-md transition-colors duration-200 ${selected === "negative" ? "text-brand-watermelon bg-brand-watermelon/15" : "text-brand-cream/30 hover:text-brand-watermelon hover:bg-brand-watermelon/10"}`,
+            "data-testid": "thumbs-down",
+            children: /* @__PURE__ */ jsxs31(
+              "svg",
+              {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                "aria-hidden": "true",
+                children: [
+                  /* @__PURE__ */ jsx35("path", { d: "M17 14V2" }),
+                  /* @__PURE__ */ jsx35("path", { d: "M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z" })
+                ]
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/feedback/FeedbackDialog/FeedbackDialog.tsx
+import { useState as useState10 } from "react";
+import { Dialog, Button as Button2, TextArea } from "@surf-kit/core";
+import { Fragment as Fragment2, jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
+function FeedbackDialog({ isOpen, onClose, onSubmit, className }) {
+  const [comment, setComment] = useState10("");
+  const handleSubmit = () => {
+    onSubmit(comment);
+    setComment("");
+    onClose();
+  };
+  return /* @__PURE__ */ jsx36(
+    Dialog,
+    {
+      isOpen,
+      onClose,
+      title: "Share your feedback",
+      size: "sm",
+      className,
+      footer: /* @__PURE__ */ jsxs32(Fragment2, { children: [
+        /* @__PURE__ */ jsx36(Button2, { intent: "ghost", onPress: onClose, children: "Cancel" }),
+        /* @__PURE__ */ jsx36(Button2, { intent: "primary", onPress: handleSubmit, isDisabled: comment.trim().length === 0, children: "Submit" })
+      ] }),
+      children: /* @__PURE__ */ jsx36(
+        TextArea,
+        {
+          label: "What could be improved?",
+          value: comment,
+          onChange: setComment,
+          placeholder: "Tell us what went wrong or how this response could be better...",
+          rows: 4,
+          "data-testid": "feedback-textarea"
+        }
+      )
+    }
+  );
+}
+
+// src/feedback/FeedbackConfirmation/FeedbackConfirmation.tsx
+import { jsx as jsx37 } from "react/jsx-runtime";
+function FeedbackConfirmation({ variant = "inline", className }) {
+  if (variant === "toast") {
+    return /* @__PURE__ */ jsx37(
+      "div",
+      {
+        role: "status",
+        className: `fixed bottom-4 right-4 bg-surface border border-border rounded-lg px-4 py-3 shadow-lg text-sm text-text-primary ${className ?? ""}`,
+        "data-testid": "feedback-confirmation",
+        children: "Thanks for your feedback"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx37(
+    "span",
+    {
+      role: "status",
+      className: `text-sm text-text-secondary ${className ?? ""}`,
+      "data-testid": "feedback-confirmation",
+      children: "Thanks for your feedback"
+    }
+  );
+}
+export {
+  AgentAvatar,
+  AgentChat,
+  AgentEmbed,
+  AgentFullPage,
+  AgentHandoff,
+  AgentLabel,
+  AgentPanel,
+  AgentResponse as AgentResponseView,
+  AgentWidget,
+  ConfidenceBadge,
+  ConfidenceBreakdown as ConfidenceBreakdownView,
+  ConfidenceMeter,
+  ConversationList,
+  ErrorResponse,
+  FeedbackConfirmation,
+  FeedbackDialog,
+  FollowUpChips,
+  MessageBubble,
+  MessageComposer,
+  MessageThread,
+  ResponseMessage,
+  RetrievalProgress,
+  RoutingIndicator,
+  SourceBadge,
+  SourceCard,
+  SourceDrawer,
+  SourceInline,
+  SourceList,
+  StreamingMessage,
+  StructuredResponse,
+  ThinkingIndicator,
+  ThumbsFeedback,
+  ToolExecution,
+  TypewriterText,
+  VerificationBadge,
+  VerificationDetail,
+  VerificationProgress,
+  WelcomeScreen
+};
+//# sourceMappingURL=index.js.map