@tangle-network/ui 1.0.0

package/dist/chunk-YJ2G3XO5.js

@@ -0,0 +1,1048 @@
+import {
+  bumpActiveSessionActivity,
+  registerActiveSession,
+  setActiveSessionAttention,
+  setActiveSessionConnection,
+  setActiveSessionError,
+  setActiveSessionRunning,
+  setForegroundActiveSession,
+  unregisterActiveSession,
+  updateActiveSessionMeta
+} from "./chunk-OEX7NZE3.js";
+import {
+  parseToolEvent
+} from "./chunk-7UO2ZMRQ.js";
+
+// src/hooks/use-dropdown-menu.ts
+import { useEffect, useRef, useState } from "react";
+function useDropdownMenu(options) {
+  const closeOnEsc = options?.closeOnEsc ?? true;
+  const [open, setOpen] = useState(false);
+  const ref = useRef(null);
+  useEffect(() => {
+    function handleClick(e) {
+      if (ref.current && !ref.current.contains(e.target)) {
+        setOpen(false);
+      }
+    }
+    if (open) {
+      document.addEventListener("mousedown", handleClick);
+    }
+    return () => document.removeEventListener("mousedown", handleClick);
+  }, [open]);
+  useEffect(() => {
+    if (!open || !closeOnEsc) return;
+    function handleKey(e) {
+      if (e.key === "Escape") setOpen(false);
+    }
+    document.addEventListener("keydown", handleKey);
+    return () => document.removeEventListener("keydown", handleKey);
+  }, [open, closeOnEsc]);
+  return {
+    open,
+    setOpen,
+    ref,
+    toggle: () => setOpen((prev) => !prev),
+    close: () => setOpen(false)
+  };
+}
+
+// src/hooks/use-tool-call-stream.ts
+import { useState as useState2, useCallback, useRef as useRef2 } from "react";
+function useToolCallStream() {
+  const [segments, setSegments] = useState2([]);
+  const pendingToolsRef = useRef2(/* @__PURE__ */ new Map());
+  const lastSegmentKindRef = useRef2(null);
+  const pushText = useCallback((delta) => {
+    setSegments((prev) => {
+      const last = prev[prev.length - 1];
+      if (last && last.kind === "text") {
+        return [...prev.slice(0, -1), { kind: "text", content: last.content + delta }];
+      }
+      return [...prev, { kind: "text", content: delta }];
+    });
+    lastSegmentKindRef.current = "text";
+  }, []);
+  const pushEvent = useCallback((event) => {
+    const toolCall = parseToolEvent(event);
+    if (!toolCall) return;
+    if (event.type === "tool.invocation" || event.type === "tool_use") {
+      pendingToolsRef.current.set(toolCall.id, toolCall);
+      setSegments((prev) => [
+        ...prev,
+        { kind: "tool_call", call: { ...toolCall, status: "running" } }
+      ]);
+      lastSegmentKindRef.current = "tool";
+    }
+  }, []);
+  const completeToolCall = useCallback(
+    (id, result) => {
+      const pending = pendingToolsRef.current.get(id);
+      if (pending) {
+        pending.status = result.error ? "error" : "success";
+        pending.output = result.output || result.error;
+        pending.duration = result.duration;
+        pendingToolsRef.current.delete(id);
+      }
+      setSegments(
+        (prev) => prev.map((seg) => {
+          if (seg.kind === "tool_call" && seg.call.id === id) {
+            return {
+              kind: "tool_call",
+              call: {
+                ...seg.call,
+                status: result.error ? "error" : "success",
+                output: result.output || result.error,
+                duration: result.duration
+              }
+            };
+          }
+          return seg;
+        })
+      );
+    },
+    []
+  );
+  const reset = useCallback(() => {
+    setSegments([]);
+    pendingToolsRef.current.clear();
+    lastSegmentKindRef.current = null;
+  }, []);
+  return { segments, pushEvent, pushText, completeToolCall, reset };
+}
+
+// src/hooks/use-realtime-session.ts
+import { createElement, useEffect as useEffect2, useMemo, useRef as useRef3, useState as useState3 } from "react";
+function parseEvent(message) {
+  try {
+    const parsed = JSON.parse(message);
+    return typeof parsed?.type === "string" ? parsed : null;
+  } catch {
+    return null;
+  }
+}
+function eventTimestamp(event) {
+  const rootTimestamp = event.timestamp;
+  if (typeof rootTimestamp === "number" && Number.isFinite(rootTimestamp)) {
+    return rootTimestamp;
+  }
+  const raw = event.data?.timestamp ?? event.data?.ts ?? event.data?.time ?? event.data?.eventAt;
+  if (typeof raw === "number" && Number.isFinite(raw)) return raw;
+  return null;
+}
+function resolveErrorMessage(event) {
+  const message = event.data?.message;
+  return typeof message === "string" && message.length > 0 ? message : null;
+}
+function updateStoreFromEvent(sessionId, event) {
+  const lastEventAt = eventTimestamp(event) ?? Date.now();
+  bumpActiveSessionActivity(sessionId, { lastEventAt });
+  if (event.type === "session.run.started") {
+    setActiveSessionRunning(sessionId, true, { lastEventAt });
+    return;
+  }
+  if (event.type === "session.run.completed" || event.type === "done" || event.type === "result") {
+    setActiveSessionRunning(sessionId, false, { lastEventAt });
+    return;
+  }
+  if (event.type === "session.attention") {
+    setActiveSessionAttention(sessionId, true, { lastEventAt });
+    return;
+  }
+  if (event.type === "error" || event.type === "session.run.failed") {
+    setActiveSessionError(sessionId, resolveErrorMessage(event) ?? "Session error");
+    return;
+  }
+}
+function useRealtimeSession({
+  sessionId,
+  projectId = null,
+  projectLabel,
+  title,
+  href,
+  metadata,
+  connectUrl,
+  enabled = true,
+  foreground = true,
+  keepRegistered = true,
+  reconnect = true,
+  reconnectIntervalMs = 1500,
+  maxReconnectAttempts = Infinity,
+  transportMode = "websocket",
+  onEvent,
+  onOpen,
+  onClose,
+  onError
+}) {
+  const [connectionState, setConnectionState] = useState3("disconnected");
+  const [lastError, setLastError] = useState3(null);
+  const [reconnectAttempts, setReconnectAttempts] = useState3(0);
+  const socketRef = useRef3(null);
+  const timerRef = useRef3(null);
+  const reconnectAttemptsRef = useRef3(0);
+  const shouldReconnectRef = useRef3(true);
+  const registration = useMemo(
+    () => ({
+      sessionId,
+      projectId,
+      projectLabel,
+      title,
+      href,
+      metadata
+    }),
+    [href, metadata, projectId, projectLabel, sessionId, title]
+  );
+  useEffect2(() => {
+    if (!sessionId || !keepRegistered) return void 0;
+    registerActiveSession(registration);
+    return () => {
+      unregisterActiveSession(sessionId);
+    };
+  }, [keepRegistered, registration, sessionId]);
+  useEffect2(() => {
+    if (!sessionId || !keepRegistered) return;
+    updateActiveSessionMeta(sessionId, {
+      projectId,
+      projectLabel,
+      title,
+      href,
+      metadata
+    });
+  }, [href, keepRegistered, metadata, projectId, projectLabel, sessionId, title]);
+  useEffect2(() => {
+    if (!sessionId || !foreground) return void 0;
+    setForegroundActiveSession(sessionId);
+    return () => {
+      setForegroundActiveSession(null);
+    };
+  }, [foreground, sessionId]);
+  useEffect2(() => {
+    if (!enabled || !sessionId || !connectUrl || typeof window === "undefined") {
+      setConnectionState("disconnected");
+      if (sessionId) {
+        setActiveSessionConnection(sessionId, {
+          connectionState: "disconnected",
+          reconnectState: "idle",
+          transportMode
+        });
+      }
+      return void 0;
+    }
+    shouldReconnectRef.current = true;
+    const clearReconnectTimer = () => {
+      if (timerRef.current != null) {
+        window.clearTimeout(timerRef.current);
+        timerRef.current = null;
+      }
+    };
+    const connect = () => {
+      clearReconnectTimer();
+      setConnectionState(reconnectAttemptsRef.current > 0 ? "reconnecting" : "connecting");
+      setActiveSessionConnection(sessionId, {
+        connectionState: reconnectAttemptsRef.current > 0 ? "reconnecting" : "connecting",
+        reconnectState: reconnectAttemptsRef.current > 0 ? "reconnecting" : "idle",
+        transportMode,
+        lastError: null
+      });
+      const socket = new window.WebSocket(connectUrl);
+      socketRef.current = socket;
+      socket.onopen = () => {
+        reconnectAttemptsRef.current = 0;
+        setReconnectAttempts(0);
+        setLastError(null);
+        setConnectionState("connected");
+        registerActiveSession(registration);
+        setActiveSessionConnection(sessionId, {
+          connectionState: "connected",
+          reconnectState: "idle",
+          transportMode,
+          lastError: null,
+          lastEventAt: Date.now()
+        });
+        onOpen?.();
+      };
+      socket.onmessage = (message) => {
+        const event = parseEvent(message.data);
+        if (!event) return;
+        registerActiveSession(registration);
+        updateStoreFromEvent(sessionId, event);
+        onEvent?.(event);
+      };
+      socket.onerror = () => {
+        const nextError = "Realtime session connection error";
+        setLastError(nextError);
+        setConnectionState("error");
+        setActiveSessionConnection(sessionId, {
+          connectionState: "error",
+          reconnectState: reconnect ? "reconnecting" : "failed",
+          transportMode,
+          lastError: nextError
+        });
+        onError?.(new Error(nextError));
+      };
+      socket.onclose = () => {
+        socketRef.current = null;
+        onClose?.();
+        if (!shouldReconnectRef.current || !reconnect) {
+          setConnectionState("disconnected");
+          setActiveSessionConnection(sessionId, {
+            connectionState: "disconnected",
+            reconnectState: "idle",
+            transportMode
+          });
+          return;
+        }
+        reconnectAttemptsRef.current += 1;
+        setReconnectAttempts(reconnectAttemptsRef.current);
+        if (reconnectAttemptsRef.current > maxReconnectAttempts) {
+          setConnectionState("error");
+          setActiveSessionConnection(sessionId, {
+            connectionState: "error",
+            reconnectState: "failed",
+            transportMode,
+            lastError: "Unable to reconnect to realtime session"
+          });
+          return;
+        }
+        setConnectionState("reconnecting");
+        timerRef.current = window.setTimeout(connect, reconnectIntervalMs);
+      };
+    };
+    connect();
+    return () => {
+      shouldReconnectRef.current = false;
+      clearReconnectTimer();
+      const socket = socketRef.current;
+      socketRef.current = null;
+      if (socket && socket.readyState < WebSocket.CLOSING) {
+        socket.close();
+      }
+    };
+  }, [
+    connectUrl,
+    enabled,
+    maxReconnectAttempts,
+    onClose,
+    onError,
+    onEvent,
+    onOpen,
+    reconnect,
+    reconnectIntervalMs,
+    registration,
+    sessionId,
+    transportMode
+  ]);
+  return {
+    connectionState,
+    lastError,
+    reconnectAttempts,
+    isConnected: connectionState === "connected"
+  };
+}
+function RealtimeSessionRegistryItem(props) {
+  useRealtimeSession({
+    ...props,
+    foreground: props.foreground ?? false
+  });
+  return null;
+}
+function RealtimeSessionRegistry({ sessions }) {
+  return sessions.map(
+    (session) => createElement(RealtimeSessionRegistryItem, {
+      key: session.key ?? session.sessionId,
+      ...session
+    })
+  );
+}
+
+// src/hooks/use-sdk-session.ts
+import { useCallback as useCallback2, useMemo as useMemo2, useRef as useRef4, useState as useState4 } from "react";
+function uid() {
+  if (typeof globalThis.crypto !== "undefined" && typeof globalThis.crypto.randomUUID === "function") {
+    try {
+      return globalThis.crypto.randomUUID();
+    } catch {
+    }
+  }
+  return `sdk-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+}
+function toMillis(value) {
+  if (value == null) return void 0;
+  if (typeof value === "number") return value;
+  if (value instanceof Date) return value.getTime();
+  const millis = new Date(value).getTime();
+  return Number.isFinite(millis) ? millis : void 0;
+}
+function asRecord(value) {
+  return value && typeof value === "object" && !Array.isArray(value) ? value : void 0;
+}
+function asString(value) {
+  return typeof value === "string" && value.length > 0 ? value : void 0;
+}
+function textPartsFromContent(content, attachments) {
+  const attachmentText = attachments?.length ? `
+
+Attachments:
+${attachments.map((attachment) => `- ${attachment.name}`).join("\n")}` : "";
+  const text = `${content}${attachmentText}`.trim();
+  return text ? [{ type: "text", text }] : [];
+}
+function normalizeTime(value) {
+  const record = asRecord(value);
+  if (!record) return void 0;
+  const start = Number(record.start ?? record.startedAt ?? record.started_at);
+  const end = Number(record.end ?? record.completedAt ?? record.completed_at);
+  if (!Number.isFinite(start) && !Number.isFinite(end)) {
+    return void 0;
+  }
+  return {
+    start: Number.isFinite(start) ? start : void 0,
+    end: Number.isFinite(end) ? end : void 0
+  };
+}
+function normalizeStatus(value, output, error) {
+  if (value === "pending" || value === "running" || value === "completed" || value === "error") {
+    return value;
+  }
+  if (typeof error === "string" && error.length > 0) {
+    return "error";
+  }
+  if (output !== void 0) {
+    return "completed";
+  }
+  return "running";
+}
+function resolveToolIdentity(rawPart) {
+  return String(
+    rawPart.id ?? rawPart.callID ?? rawPart.callId ?? rawPart.toolUseId ?? rawPart.toolCallId ?? rawPart.tool ?? rawPart.name ?? "tool"
+  );
+}
+function normalizePart(rawPart) {
+  const type = String(rawPart.type ?? "");
+  if (type === "text") {
+    return {
+      type: "text",
+      text: asString(rawPart.text) ?? asString(rawPart.content) ?? ""
+    };
+  }
+  if (type === "reasoning") {
+    return {
+      type: "reasoning",
+      text: asString(rawPart.text) ?? asString(rawPart.content) ?? "",
+      time: normalizeTime(rawPart.time)
+    };
+  }
+  if (type === "tool") {
+    const stateRecord = asRecord(rawPart.state);
+    const input = stateRecord?.input ?? rawPart.input;
+    const output = stateRecord?.output ?? rawPart.output;
+    const error = stateRecord?.error ?? rawPart.error;
+    return {
+      type: "tool",
+      id: resolveToolIdentity(rawPart),
+      tool: String(rawPart.tool ?? rawPart.name ?? "tool"),
+      callID: rawPart.callID != null || rawPart.callId != null ? String(rawPart.callID ?? rawPart.callId) : void 0,
+      state: {
+        status: normalizeStatus(stateRecord?.status ?? rawPart.status, output, error),
+        input,
+        output,
+        error: typeof error === "string" ? error : void 0,
+        metadata: asRecord(stateRecord?.metadata) ?? asRecord(rawPart.metadata),
+        time: normalizeTime(stateRecord?.time ?? rawPart.time)
+      }
+    };
+  }
+  return null;
+}
+function getPartKey(rawPart) {
+  const type = String(rawPart.type ?? "unknown");
+  if (type === "tool") {
+    return `tool:${resolveToolIdentity(rawPart)}`;
+  }
+  if (type === "reasoning") {
+    return `reasoning:${String(rawPart.id ?? rawPart.partId ?? rawPart.index ?? "current")}`;
+  }
+  return `text:${String(rawPart.id ?? rawPart.partId ?? rawPart.index ?? "current")}`;
+}
+function mergePart(existing, incoming, delta) {
+  if (!existing) {
+    if (incoming.type === "text" && delta) {
+      return { type: "text", text: delta };
+    }
+    return incoming;
+  }
+  if (existing.type === "text" && incoming.type === "text") {
+    return {
+      type: "text",
+      text: delta ? `${existing.text}${delta}` : incoming.text,
+      synthetic: incoming.synthetic ?? existing.synthetic
+    };
+  }
+  if (existing.type === "reasoning" && incoming.type === "reasoning") {
+    return {
+      ...existing,
+      ...incoming,
+      text: delta && incoming.text === existing.text ? `${existing.text}${delta}` : incoming.text || existing.text,
+      time: incoming.time ?? existing.time
+    };
+  }
+  if (existing.type === "tool" && incoming.type === "tool") {
+    return {
+      ...existing,
+      ...incoming,
+      state: {
+        ...existing.state,
+        ...incoming.state,
+        time: incoming.state.time ?? existing.state.time
+      }
+    };
+  }
+  return incoming;
+}
+function mapSeeds(messages) {
+  return {
+    messages: messages.map((message, index) => ({
+      id: message.id,
+      role: message.role,
+      _insertionIndex: index,
+      time: {
+        created: toMillis(message.createdAt) ?? Date.now()
+      }
+    })),
+    partMap: Object.fromEntries(
+      messages.map((message) => [
+        message.id,
+        message.parts ?? textPartsFromContent(message.content ?? "", message.attachments)
+      ])
+    )
+  };
+}
+function useSdkSession({
+  initialMessages = []
+} = {}) {
+  const initialConversation = useMemo2(
+    () => mapSeeds(initialMessages),
+    [initialMessages]
+  );
+  const [conversation, setConversation] = useState4(initialConversation);
+  const [isStreaming, setIsStreaming] = useState4(false);
+  const activeAssistantIdRef = useRef4(null);
+  const insertionIndexRef = useRef4(initialConversation.messages.length);
+  const partIndexRef = useRef4({});
+  const replaceHistory = useCallback2((messages) => {
+    const next = mapSeeds(messages);
+    setConversation(next);
+    setIsStreaming(false);
+    activeAssistantIdRef.current = null;
+    insertionIndexRef.current = next.messages.length;
+    partIndexRef.current = {};
+  }, []);
+  const appendUserMessage = useCallback2(
+    ({
+      id = uid(),
+      role = "user",
+      content,
+      createdAt,
+      attachments
+    }) => {
+      setConversation((prev) => ({
+        messages: [
+          ...prev.messages,
+          {
+            id,
+            role,
+            _insertionIndex: insertionIndexRef.current++,
+            time: {
+              created: toMillis(createdAt) ?? Date.now()
+            }
+          }
+        ],
+        partMap: {
+          ...prev.partMap,
+          [id]: textPartsFromContent(content, attachments)
+        }
+      }));
+      return id;
+    },
+    []
+  );
+  const beginAssistantMessage = useCallback2(
+    ({
+      id = uid(),
+      role = "assistant",
+      createdAt
+    } = {}) => {
+      setConversation((prev) => ({
+        messages: [
+          ...prev.messages,
+          {
+            id,
+            role,
+            _insertionIndex: insertionIndexRef.current++,
+            time: {
+              created: toMillis(createdAt) ?? Date.now()
+            }
+          }
+        ],
+        partMap: {
+          ...prev.partMap,
+          [id]: prev.partMap[id] ?? []
+        }
+      }));
+      activeAssistantIdRef.current = id;
+      partIndexRef.current[id] = partIndexRef.current[id] ?? {};
+      setIsStreaming(true);
+      return id;
+    },
+    []
+  );
+  const completeAssistantMessage = useCallback2(
+    ({ messageId, finalText } = {}) => {
+      const targetId = messageId ?? activeAssistantIdRef.current;
+      if (!targetId) {
+        setIsStreaming(false);
+        return;
+      }
+      if (finalText) {
+        setConversation((prev) => {
+          const existingParts = prev.partMap[targetId] ?? [];
+          const nextParts = [...existingParts];
+          const textIndex = nextParts.findIndex((part) => part.type === "text");
+          if (textIndex === -1) {
+            nextParts.push({ type: "text", text: finalText });
+          } else {
+            nextParts[textIndex] = { type: "text", text: finalText };
+          }
+          return {
+            ...prev,
+            partMap: {
+              ...prev.partMap,
+              [targetId]: nextParts
+            }
+          };
+        });
+      }
+      delete partIndexRef.current[targetId];
+      if (activeAssistantIdRef.current === targetId) {
+        activeAssistantIdRef.current = null;
+      }
+      setIsStreaming(false);
+    },
+    []
+  );
+  const failAssistantMessage = useCallback2(
+    (error, options) => {
+      const targetId = options?.messageId ?? activeAssistantIdRef.current;
+      if (!targetId) {
+        setIsStreaming(false);
+        return;
+      }
+      setConversation((prev) => ({
+        ...prev,
+        partMap: {
+          ...prev.partMap,
+          [targetId]: [{ type: "text", text: `Error: ${error}` }]
+        }
+      }));
+      delete partIndexRef.current[targetId];
+      if (activeAssistantIdRef.current === targetId) {
+        activeAssistantIdRef.current = null;
+      }
+      setIsStreaming(false);
+    },
+    []
+  );
+  const applySdkEvent = useCallback2(
+    (event, options) => {
+      const eventData = asRecord(event.data) ?? {};
+      if (event.type === "message.updated") {
+        const id = asString(eventData.id) ?? asString(eventData.messageId) ?? options?.messageId;
+        const role = asString(eventData.role) ?? "assistant";
+        if (!id) {
+          return;
+        }
+        setConversation((prev) => {
+          if (prev.messages.some((message) => message.id === id)) {
+            return prev;
+          }
+          return {
+            ...prev,
+            messages: [
+              ...prev.messages,
+              {
+                id,
+                role,
+                _insertionIndex: insertionIndexRef.current++,
+                time: { created: Date.now() }
+              }
+            ],
+            partMap: {
+              ...prev.partMap,
+              [id]: prev.partMap[id] ?? []
+            }
+          };
+        });
+        if (role === "assistant" || role === "system") {
+          activeAssistantIdRef.current = id;
+          partIndexRef.current[id] = partIndexRef.current[id] ?? {};
+          setIsStreaming(true);
+        }
+        return;
+      }
+      if (event.type === "message.part.updated") {
+        const rawPart = asRecord(eventData.part) ?? eventData;
+        const targetId = options?.messageId ?? activeAssistantIdRef.current;
+        const delta = asString(eventData.delta);
+        if (!targetId || !rawPart) {
+          return;
+        }
+        const normalizedPart = normalizePart(rawPart);
+        if (!normalizedPart) {
+          return;
+        }
+        const key = getPartKey(rawPart);
+        setConversation((prev) => {
+          const existingParts = prev.partMap[targetId] ?? [];
+          const nextParts = [...existingParts];
+          const indexMap = partIndexRef.current[targetId] ?? (partIndexRef.current[targetId] = {});
+          const existingIndex = indexMap[key];
+          if (existingIndex == null) {
+            indexMap[key] = nextParts.length;
+            nextParts.push(mergePart(void 0, normalizedPart, delta));
+          } else {
+            nextParts[existingIndex] = mergePart(
+              nextParts[existingIndex],
+              normalizedPart,
+              delta
+            );
+          }
+          return {
+            ...prev,
+            partMap: {
+              ...prev.partMap,
+              [targetId]: nextParts
+            }
+          };
+        });
+        activeAssistantIdRef.current = targetId;
+        setIsStreaming(true);
+        return;
+      }
+      if (event.type === "result") {
+        completeAssistantMessage({
+          messageId: options?.messageId,
+          finalText: asString(eventData.finalText)
+        });
+        return;
+      }
+      if (event.type === "done") {
+        completeAssistantMessage({ messageId: options?.messageId });
+        return;
+      }
+      if (event.type === "error") {
+        failAssistantMessage(
+          asString(eventData.message) ?? "Agent error",
+          { messageId: options?.messageId }
+        );
+      }
+    },
+    [completeAssistantMessage, failAssistantMessage]
+  );
+  const reset = useCallback2(() => {
+    setConversation({ messages: [], partMap: {} });
+    setIsStreaming(false);
+    activeAssistantIdRef.current = null;
+    insertionIndexRef.current = 0;
+    partIndexRef.current = {};
+  }, []);
+  return {
+    messages: conversation.messages,
+    partMap: conversation.partMap,
+    isStreaming,
+    activeAssistantMessageId: activeAssistantIdRef.current,
+    replaceHistory,
+    appendUserMessage,
+    beginAssistantMessage,
+    applySdkEvent,
+    completeAssistantMessage,
+    failAssistantMessage,
+    setStreaming: setIsStreaming,
+    reset
+  };
+}
+
+// src/hooks/use-sse-stream.ts
+import * as React from "react";
+function useSSEStream(options) {
+  const {
+    url,
+    authToken,
+    autoReconnect = true,
+    maxRetries = 5,
+    reconnectDelay = 1e3,
+    eventTypes,
+    onEvent,
+    onStateChange,
+    onError,
+    headers,
+    enabled = true
+  } = options;
+  const [state, setState] = React.useState("disconnected");
+  const [events, setEvents] = React.useState([]);
+  const [lastEvent, setLastEvent] = React.useState(null);
+  const [error, setError] = React.useState(null);
+  const [lastEventTime, setLastEventTime] = React.useState(Date.now());
+  const [timeSinceLastEvent, setTimeSinceLastEvent] = React.useState(0);
+  const retryCountRef = React.useRef(0);
+  const eventSourceRef = React.useRef(null);
+  const abortControllerRef = React.useRef(null);
+  const reconnectTimeoutRef = React.useRef(null);
+  const lastEventIdRef = React.useRef(void 0);
+  React.useEffect(() => {
+    const interval = setInterval(() => {
+      setTimeSinceLastEvent(Date.now() - lastEventTime);
+    }, 1e3);
+    return () => clearInterval(interval);
+  }, [lastEventTime]);
+  React.useEffect(() => {
+    onStateChange?.(state);
+  }, [state, onStateChange]);
+  const handleEvent = React.useCallback(
+    (eventType, data, id) => {
+      const event = {
+        id,
+        event: eventType,
+        data,
+        timestamp: Date.now()
+      };
+      if (id) {
+        lastEventIdRef.current = id;
+      }
+      setLastEventTime(Date.now());
+      setLastEvent(event);
+      setEvents((prev) => {
+        const next = [...prev, event];
+        return next.length > 1e3 ? next.slice(-1e3) : next;
+      });
+      onEvent?.(event);
+    },
+    [onEvent]
+  );
+  const disconnect = React.useCallback(() => {
+    if (reconnectTimeoutRef.current) {
+      clearTimeout(reconnectTimeoutRef.current);
+      reconnectTimeoutRef.current = null;
+    }
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort();
+      abortControllerRef.current = null;
+    }
+    if (eventSourceRef.current) {
+      eventSourceRef.current.close();
+      eventSourceRef.current = null;
+    }
+    setState("disconnected");
+  }, []);
+  const connect = React.useCallback(() => {
+    disconnect();
+    if (!url || !enabled) {
+      return;
+    }
+    setState("connecting");
+    setError(null);
+    const connectUrl = new URL(url, window.location.origin);
+    if (lastEventIdRef.current) {
+      connectUrl.searchParams.set("lastEventId", lastEventIdRef.current);
+    }
+    if (authToken || headers) {
+      abortControllerRef.current = new AbortController();
+      const fetchHeaders = {
+        Accept: "text/event-stream",
+        "Cache-Control": "no-cache",
+        ...headers
+      };
+      if (authToken) {
+        fetchHeaders.Authorization = authToken.startsWith("Bearer ") ? authToken : `Bearer ${authToken}`;
+      }
+      if (lastEventIdRef.current) {
+        fetchHeaders["Last-Event-ID"] = lastEventIdRef.current;
+      }
+      fetch(connectUrl.toString(), {
+        headers: fetchHeaders,
+        signal: abortControllerRef.current.signal
+      }).then(async (response) => {
+        if (!response.ok) {
+          throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+        }
+        if (!response.body) {
+          throw new Error("Response body is null");
+        }
+        setState("connected");
+        retryCountRef.current = 0;
+        const reader = response.body.getReader();
+        const decoder = new TextDecoder();
+        let buffer = "";
+        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() || "";
+          let currentEvent = "";
+          let currentData = "";
+          let currentId;
+          for (const line of lines) {
+            if (line.startsWith("event:")) {
+              currentEvent = line.slice(6).trim();
+            } else if (line.startsWith("data:")) {
+              currentData += (currentData ? "\n" : "") + line.slice(5).trim();
+            } else if (line.startsWith("id:")) {
+              currentId = line.slice(3).trim();
+            } else if (line === "" && currentData) {
+              try {
+                const parsedData = JSON.parse(currentData);
+                const eventType = currentEvent || "message";
+                if (!eventTypes || eventTypes.includes(eventType)) {
+                  handleEvent(eventType, parsedData, currentId);
+                }
+              } catch {
+                if (!eventTypes || eventTypes.includes(currentEvent || "message")) {
+                  handleEvent(
+                    currentEvent || "message",
+                    currentData,
+                    currentId
+                  );
+                }
+              }
+              currentEvent = "";
+              currentData = "";
+              currentId = void 0;
+            }
+          }
+        }
+        if (autoReconnect && enabled) {
+          setState("reconnecting");
+          const delay = reconnectDelay * 2 ** retryCountRef.current;
+          reconnectTimeoutRef.current = setTimeout(
+            () => {
+              retryCountRef.current += 1;
+              connect();
+            },
+            Math.min(delay, 3e4)
+          );
+        } else {
+          setState("disconnected");
+        }
+      }).catch((err) => {
+        if (err.name === "AbortError") {
+          return;
+        }
+        setError(err);
+        onError?.(err);
+        setState("error");
+        if (autoReconnect && enabled && retryCountRef.current < maxRetries) {
+          setState("reconnecting");
+          const delay = reconnectDelay * 2 ** retryCountRef.current;
+          reconnectTimeoutRef.current = setTimeout(
+            () => {
+              retryCountRef.current += 1;
+              connect();
+            },
+            Math.min(delay, 3e4)
+          );
+        }
+      });
+    } else {
+      const es = new EventSource(connectUrl.toString());
+      eventSourceRef.current = es;
+      es.onopen = () => {
+        setState("connected");
+        retryCountRef.current = 0;
+      };
+      es.onerror = () => {
+        const err = new Error("EventSource connection error");
+        setError(err);
+        onError?.(err);
+        if (autoReconnect && enabled && retryCountRef.current < maxRetries) {
+          setState("reconnecting");
+          es.close();
+          const delay = reconnectDelay * 2 ** retryCountRef.current;
+          reconnectTimeoutRef.current = setTimeout(
+            () => {
+              retryCountRef.current += 1;
+              connect();
+            },
+            Math.min(delay, 3e4)
+          );
+        } else {
+          setState("error");
+        }
+      };
+      const types = eventTypes || ["message"];
+      for (const type of types) {
+        es.addEventListener(type, (e) => {
+          try {
+            const data = JSON.parse(e.data);
+            handleEvent(type, data, e.lastEventId);
+          } catch {
+            handleEvent(type, e.data, e.lastEventId);
+          }
+        });
+      }
+      if (!eventTypes) {
+        es.onmessage = (e) => {
+          try {
+            const data = JSON.parse(e.data);
+            handleEvent("message", data, e.lastEventId);
+          } catch {
+            handleEvent("message", e.data, e.lastEventId);
+          }
+        };
+      }
+    }
+  }, [
+    url,
+    authToken,
+    headers,
+    enabled,
+    autoReconnect,
+    maxRetries,
+    reconnectDelay,
+    eventTypes,
+    handleEvent,
+    onError,
+    disconnect
+  ]);
+  React.useEffect(() => {
+    if (enabled) {
+      connect();
+    }
+    return () => disconnect();
+  }, [enabled, connect, disconnect]);
+  const clearEvents = React.useCallback(() => {
+    setEvents([]);
+    setLastEvent(null);
+  }, []);
+  return {
+    state,
+    events,
+    lastEvent,
+    error,
+    connect,
+    disconnect,
+    clearEvents,
+    retryCount: retryCountRef.current,
+    timeSinceLastEvent
+  };
+}
+
+export {
+  useDropdownMenu,
+  useToolCallStream,
+  useRealtimeSession,
+  RealtimeSessionRegistry,
+  useSdkSession,
+  useSSEStream
+};