@gendive/chatllm 0.22.1 → 0.23.1

package/dist/react/index.mjs

@@ -2,7 +2,7 @@
 import React17 from "react";
 
 // src/react/hooks/useChatUI.ts
-import { useState as useState6, useRef as useRef5, useCallback as useCallback6, useEffect as useEffect4, useMemo as useMemo3 } from "react";
+import { useState as useState6, useRef as useRef7, useCallback as useCallback8, useEffect as useEffect4, useMemo as useMemo4 } from "react";
 
 // src/types.ts
 var DEFAULT_PERSONALIZATION = {
@@ -2059,6 +2059,462 @@ var parseContextRefs = (content) => {
   return { refs, cleanContent };
 };
 
+// src/react/utils/errors.ts
+var ChatError = class extends Error {
+  code;
+  retryable;
+  statusCode;
+  originalError;
+  constructor(code, message, options) {
+    super(message);
+    this.name = "ChatError";
+    this.code = code;
+    this.statusCode = options?.statusCode;
+    this.originalError = options?.originalError;
+    this.retryable = options?.retryable ?? isRetryableCode(code);
+  }
+};
+var classifyStatusCode = (status) => {
+  if (status === 401 || status === 403) return "AUTH";
+  if (status === 429) return "RATE_LIMIT";
+  if (status >= 500) return "API";
+  if (status >= 400) return "API";
+  return "UNKNOWN";
+};
+var isRetryableCode = (code) => code === "NETWORK" || code === "RATE_LIMIT" || code === "API";
+var classifyFetchError = (error, response) => {
+  if (error instanceof DOMException && error.name === "AbortError") {
+    return new ChatError("ABORT", "\uC694\uCCAD\uC774 \uCDE8\uC18C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.", {
+      originalError: error,
+      retryable: false
+    });
+  }
+  if (error instanceof Error && error.name === "AbortError") {
+    return new ChatError("ABORT", "\uC694\uCCAD\uC774 \uCDE8\uC18C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.", {
+      originalError: error,
+      retryable: false
+    });
+  }
+  if (error instanceof ChatError) return error;
+  if (response && !response.ok) {
+    const code = classifyStatusCode(response.status);
+    const messages = {
+      AUTH: "\uC778\uC99D\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4. API \uD0A4\uB97C \uD655\uC778\uD574\uC8FC\uC138\uC694.",
+      RATE_LIMIT: "\uC694\uCCAD \uD55C\uB3C4\uB97C \uCD08\uACFC\uD588\uC2B5\uB2C8\uB2E4. \uC7A0\uC2DC \uD6C4 \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694.",
+      API: `\uC11C\uBC84 \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4. (${response.status})`,
+      NETWORK: "\uB124\uD2B8\uC6CC\uD06C \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4.",
+      TIMEOUT: "\uC694\uCCAD \uC2DC\uAC04\uC774 \uCD08\uACFC\uB418\uC5C8\uC2B5\uB2C8\uB2E4.",
+      ABORT: "\uC694\uCCAD\uC774 \uCDE8\uC18C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.",
+      UNKNOWN: "\uC54C \uC218 \uC5C6\uB294 \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4."
+    };
+    return new ChatError(code, messages[code], {
+      statusCode: response.status,
+      originalError: error
+    });
+  }
+  if (error instanceof TypeError) {
+    return new ChatError("NETWORK", "\uB124\uD2B8\uC6CC\uD06C \uC5F0\uACB0\uC744 \uD655\uC778\uD574\uC8FC\uC138\uC694.", {
+      originalError: error
+    });
+  }
+  const message = error instanceof Error ? error.message : "\uC54C \uC218 \uC5C6\uB294 \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4.";
+  return new ChatError("UNKNOWN", message, { originalError: error });
+};
+var createTimeoutError = (timeoutMs) => new ChatError("TIMEOUT", `\uC2A4\uD2B8\uB9AC\uBC0D \uC751\uB2F5\uC774 ${timeoutMs / 1e3}\uCD08 \uB3D9\uC548 \uC5C6\uC2B5\uB2C8\uB2E4.`, {
+  retryable: false
+});
+
+// src/react/hooks/useStreamingFetch.ts
+import { useCallback as useCallback6, useRef as useRef5 } from "react";
+var DEFAULT_CHUNK_TIMEOUT = 3e4;
+var parseSSELine = (line) => {
+  if (!line.trim()) return null;
+  let data = line;
+  if (line.startsWith("data: ")) {
+    data = line.slice(6);
+    if (data === "[DONE]") return null;
+  }
+  try {
+    const parsed = JSON.parse(data);
+    let usage = null;
+    if (parsed.usage) {
+      usage = {
+        promptTokens: parsed.usage.prompt_tokens ?? parsed.usage.promptTokens ?? 0,
+        completionTokens: parsed.usage.completion_tokens ?? parsed.usage.completionTokens ?? 0,
+        totalTokens: parsed.usage.total_tokens ?? parsed.usage.totalTokens ?? 0
+      };
+    } else if (parsed.prompt_eval_count != null || parsed.eval_count != null) {
+      usage = {
+        promptTokens: parsed.prompt_eval_count ?? 0,
+        completionTokens: parsed.eval_count ?? 0,
+        totalTokens: (parsed.prompt_eval_count ?? 0) + (parsed.eval_count ?? 0)
+      };
+    }
+    const delta = parsed.choices?.[0]?.delta ?? null;
+    const finishReason = parsed.choices?.[0]?.finish_reason ?? null;
+    const content = delta?.content ?? parsed.message?.content ?? parsed.content ?? parsed.text ?? "";
+    const thinking = parsed.message?.thinking ?? "";
+    return { content, thinking, finishReason, delta, usage, raw: parsed };
+  } catch {
+    return null;
+  }
+};
+var parseSSEResponse = async (response) => {
+  const reader = response.body?.getReader();
+  if (!reader) return "";
+  const decoder = new TextDecoder();
+  let buffer = "";
+  let result = "";
+  try {
+    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) {
+        const chunk = parseSSELine(line);
+        if (chunk?.content) result += chunk.content;
+      }
+    }
+    if (buffer.trim()) {
+      const chunk = parseSSELine(buffer);
+      if (chunk?.content) result += chunk.content;
+    }
+  } finally {
+    reader.releaseLock();
+  }
+  return result;
+};
+var useStreamingFetch = (options = {}) => {
+  const { chunkTimeout = DEFAULT_CHUNK_TIMEOUT } = options;
+  const abortControllersRef = useRef5(/* @__PURE__ */ new Map());
+  const createAbortController = useCallback6((sessionId) => {
+    const controller = new AbortController();
+    abortControllersRef.current.set(sessionId, controller);
+    return controller;
+  }, []);
+  const abort = useCallback6((sessionId) => {
+    abortControllersRef.current.get(sessionId)?.abort();
+  }, []);
+  const cleanup = useCallback6((sessionId) => {
+    abortControllersRef.current.delete(sessionId);
+  }, []);
+  const getSignal = useCallback6((sessionId) => {
+    return abortControllersRef.current.get(sessionId)?.signal;
+  }, []);
+  const readWithTimeout = useCallback6(async (reader) => {
+    let timerId;
+    try {
+      return await Promise.race([
+        reader.read(),
+        new Promise((_, reject) => {
+          timerId = setTimeout(() => reject(createTimeoutError(chunkTimeout)), chunkTimeout);
+        })
+      ]);
+    } finally {
+      clearTimeout(timerId);
+    }
+  }, [chunkTimeout]);
+  const streamResponse = useCallback6(async (response, onChunk, streamOptions) => {
+    if (!response.ok) {
+      throw classifyFetchError(new Error("API error"), response);
+    }
+    const reader = response.body?.getReader();
+    if (!reader) throw new Error("No reader");
+    const decoder = new TextDecoder();
+    let buffer = "";
+    let lastUsage = null;
+    try {
+      while (true) {
+        const { done, value } = streamOptions?.noTimeout ? await reader.read() : await readWithTimeout(reader);
+        if (done) break;
+        buffer += decoder.decode(value, { stream: true });
+        const lines = buffer.split("\n");
+        buffer = lines.pop() || "";
+        let shouldBreak = false;
+        for (const line of lines) {
+          const chunk = parseSSELine(line);
+          if (!chunk) continue;
+          if (chunk.usage) lastUsage = chunk.usage;
+          const result = onChunk(chunk);
+          if (result === "break") {
+            shouldBreak = true;
+            break;
+          }
+        }
+        if (shouldBreak) break;
+      }
+      if (buffer.trim()) {
+        const chunk = parseSSELine(buffer);
+        if (chunk) {
+          if (chunk.usage) lastUsage = chunk.usage;
+          onChunk(chunk);
+        }
+      }
+    } finally {
+      reader.releaseLock();
+    }
+    return { usage: lastUsage };
+  }, [readWithTimeout]);
+  const fetchAndStream = useCallback6(async (fetchOptions, onChunk) => {
+    const response = await fetch(fetchOptions.url, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(fetchOptions.body),
+      signal: fetchOptions.signal
+    });
+    fetchOptions.onHeaders?.(response);
+    return streamResponse(response, onChunk);
+  }, [streamResponse]);
+  return {
+    abortControllers: abortControllersRef,
+    createAbortController,
+    abort,
+    cleanup,
+    getSignal,
+    readWithTimeout,
+    streamResponse,
+    fetchAndStream,
+    parseSSELine
+  };
+};
+
+// src/react/hooks/useChecklist.ts
+import { useRef as useRef6, useCallback as useCallback7, useMemo as useMemo3 } from "react";
+var CHECKLIST_STEP_DELAY_MS = 100;
+var toActiveItems = (items) => items.map((it) => ({
+  id: it.id,
+  title: it.title,
+  skill: it.skill,
+  fileIndex: it.fileIndex,
+  fileType: it.fileType,
+  refImage: it.refImage,
+  refStep: it.refStep
+}));
+var useChecklist = ({
+  sessionsRef,
+  sessions,
+  setSessions,
+  sendMessage,
+  abortControllers,
+  removeLoadingSession,
+  pendingAttachmentDataRef,
+  trackChecklistSkip,
+  resolveChecklistRefImage,
+  buildChecklistStepPrompt
+}) => {
+  const skipNextChecklistParsingRef = useRef6(false);
+  const activeChecklistRef = useRef6(null);
+  const pendingChecklistRef = useRef6(null);
+  const sendMessageRef = useRef6(sendMessage);
+  sendMessageRef.current = sendMessage;
+  const findSessionAndMessage = useCallback7(
+    (messageId) => {
+      const session = sessionsRef.current?.find(
+        (s) => s.messages.some((m) => m.id === messageId)
+      );
+      if (!session) return null;
+      const message = session.messages.find((m) => m.id === messageId);
+      if (!message?.checklistBlock) return null;
+      return { session, message };
+    },
+    [sessionsRef]
+  );
+  const executeStep = useCallback7(
+    (items, stepIndex, messageId, sessionId, isFirst) => {
+      skipNextChecklistParsingRef.current = true;
+      setTimeout(() => {
+        const item = items[stepIndex];
+        const refUrl = resolveChecklistRefImage(item, messageId, sessionId);
+        if (refUrl) {
+          pendingAttachmentDataRef.current = [
+            { name: "ref_image", mimeType: "image/png", base64: "", size: 0, url: refUrl }
+          ];
+        }
+        sendMessageRef.current(
+          buildChecklistStepPrompt(stepIndex, items.length, item, isFirst, refUrl),
+          { hiddenUserMessage: true, isChecklistExecution: true, checklistStep: { index: stepIndex, title: item.title } }
+        );
+      }, CHECKLIST_STEP_DELAY_MS);
+    },
+    [resolveChecklistRefImage, buildChecklistStepPrompt, pendingAttachmentDataRef]
+  );
+  const updateChecklistItems = useCallback7(
+    (sessionId, messageId, updater) => {
+      setSessions(
+        (prev) => prev.map((s) => {
+          if (s.id !== sessionId) return s;
+          return {
+            ...s,
+            messages: s.messages.map((m) => {
+              if (m.id !== messageId || !m.checklistBlock) return m;
+              const result = updater(m.checklistBlock.items, m.checklistBlock);
+              return {
+                ...m,
+                checklistBlock: {
+                  ...m.checklistBlock,
+                  items: result.items,
+                  ...result.currentStep !== void 0 ? { currentStep: result.currentStep } : {},
+                  ...result.completed !== void 0 ? { completed: result.completed } : {}
+                }
+              };
+            })
+          };
+        })
+      );
+    },
+    [setSessions]
+  );
+  const handleChecklistStart = useCallback7(
+    (messageId) => {
+      const found = findSessionAndMessage(messageId);
+      if (!found) return;
+      const { session, message } = found;
+      pendingChecklistRef.current = null;
+      activeChecklistRef.current = {
+        messageId,
+        sessionId: session.id,
+        items: toActiveItems(message.checklistBlock.items),
+        currentStep: 0,
+        stepResults: []
+      };
+      updateChecklistItems(session.id, messageId, (items) => ({
+        items: items.map((it, idx) => ({
+          ...it,
+          status: idx === 0 ? "in_progress" : it.status
+        })),
+        currentStep: 0
+      }));
+      executeStep(message.checklistBlock.items, 0, messageId, session.id, true);
+    },
+    [findSessionAndMessage, updateChecklistItems, executeStep]
+  );
+  const handleChecklistAbort = useCallback7(() => {
+    if (!activeChecklistRef.current) return;
+    const checklist = activeChecklistRef.current;
+    const stepIdx = checklist.currentStep;
+    abortControllers.current?.get(checklist.sessionId)?.abort();
+    updateChecklistItems(checklist.sessionId, checklist.messageId, (items) => ({
+      items: items.map((it, idx) => ({
+        ...it,
+        status: idx === stepIdx ? "error" : it.status
+      }))
+    }));
+    activeChecklistRef.current = null;
+    removeLoadingSession(checklist.sessionId);
+  }, [abortControllers, updateChecklistItems, removeLoadingSession]);
+  const handleChecklistRetry = useCallback7(
+    (messageId, stepIndex) => {
+      const found = findSessionAndMessage(messageId);
+      if (!found) return;
+      const { session, message } = found;
+      activeChecklistRef.current = {
+        messageId,
+        sessionId: session.id,
+        items: toActiveItems(message.checklistBlock.items),
+        currentStep: stepIndex,
+        stepResults: message.checklistBlock.items.slice(0, stepIndex).map((it) => it.result || "")
+      };
+      updateChecklistItems(session.id, messageId, (items) => ({
+        items: items.map((it, idx) => ({
+          ...it,
+          status: idx === stepIndex ? "in_progress" : idx > stepIndex ? "pending" : it.status
+        })),
+        currentStep: stepIndex
+      }));
+      executeStep(message.checklistBlock.items, stepIndex, messageId, session.id, stepIndex === 0);
+    },
+    [findSessionAndMessage, updateChecklistItems, executeStep]
+  );
+  const handleChecklistSkip = useCallback7(
+    (messageId, stepIndex) => {
+      const found = findSessionAndMessage(messageId);
+      if (!found) return;
+      const { session, message } = found;
+      trackChecklistSkip();
+      updateChecklistItems(session.id, messageId, (items) => ({
+        items: items.map((it, idx) => ({
+          ...it,
+          status: idx === stepIndex ? "done" : it.status,
+          result: idx === stepIndex ? "(\uAC74\uB108\uB700)" : it.result
+        }))
+      }));
+      const nextPending = message.checklistBlock.items.findIndex(
+        (it, idx) => idx > stepIndex && (it.status === "pending" || it.status === "error")
+      );
+      if (nextPending >= 0) {
+        activeChecklistRef.current = {
+          messageId,
+          sessionId: session.id,
+          items: toActiveItems(message.checklistBlock.items),
+          currentStep: nextPending,
+          stepResults: message.checklistBlock.items.slice(0, nextPending).map((it) => it.result || "(\uAC74\uB108\uB700)")
+        };
+        updateChecklistItems(session.id, messageId, (items) => ({
+          items: items.map((it, idx) => ({
+            ...it,
+            status: idx === nextPending ? "in_progress" : it.status
+          })),
+          currentStep: nextPending
+        }));
+        executeStep(message.checklistBlock.items, nextPending, messageId, session.id, false);
+      } else {
+        const allResults = message.checklistBlock.items.map((it, i) => {
+          const result = i === stepIndex ? "(\uAC74\uB108\uB700)" : it.result || "(\uAC74\uB108\uB700)";
+          return `### ${i + 1}. ${it.title}
+${result}`;
+        }).join("\n\n");
+        updateChecklistItems(session.id, messageId, () => ({
+          items: message.checklistBlock.items.map((it, idx) => ({
+            ...it,
+            status: idx === stepIndex ? "done" : it.status,
+            result: idx === stepIndex ? "(\uAC74\uB108\uB700)" : it.result
+          })),
+          completed: true
+        }));
+        skipNextChecklistParsingRef.current = true;
+        setTimeout(() => {
+          sendMessageRef.current(
+            `\uBAA8\uB4E0 \uCCB4\uD06C\uB9AC\uC2A4\uD2B8 \uB2E8\uACC4\uAC00 \uC644\uB8CC\uB418\uC5C8\uC2B5\uB2C8\uB2E4. \uC544\uB798\uB294 \uAC01 \uB2E8\uACC4\uBCC4 \uACB0\uACFC\uC785\uB2C8\uB2E4:
+
+${allResults}
+
+\uC704 \uACB0\uACFC\uB97C \uC885\uD569\uD558\uC5EC \uCD5C\uC885 \uACB0\uACFC\uBB3C\uC744 \uC644\uC131\uD574\uC8FC\uC138\uC694. checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \uB9C8\uC138\uC694.`,
+            { hiddenUserMessage: true, isChecklistExecution: true }
+          );
+        }, CHECKLIST_STEP_DELAY_MS);
+      }
+    },
+    [findSessionAndMessage, updateChecklistItems, executeStep, trackChecklistSkip]
+  );
+  const activeChecklistMessage = useMemo3(() => {
+    const active = activeChecklistRef.current;
+    if (!active) {
+      for (const session2 of sessions) {
+        const msg = session2.messages.find(
+          (m) => m.checklistBlock && !m.checklistBlock.completed
+        );
+        if (msg) return msg;
+      }
+      return null;
+    }
+    const session = sessions.find((s) => s.id === active.sessionId);
+    if (!session) return null;
+    return session.messages.find((m) => m.id === active.messageId) || null;
+  }, [sessions]);
+  return {
+    activeChecklistRef,
+    pendingChecklistRef,
+    skipNextChecklistParsingRef,
+    handleChecklistStart,
+    handleChecklistAbort,
+    handleChecklistRetry,
+    handleChecklistSkip,
+    activeChecklistMessage
+  };
+};
+
 // src/react/utils/sessionCache.ts
 var buildCacheKey = (storageKey, sessionId) => `${storageKey}_cache_${sessionId}`;
 var writeSessionCache = (storageKey, session) => {
@@ -2091,38 +2547,14 @@ var removeSessionCache = (storageKey, sessionId) => {
 };
 
 // src/react/hooks/useChatUI.ts
-var parseSSEResponse = async (response) => {
-  const reader = response.body?.getReader();
-  if (!reader) return "";
-  const decoder = new TextDecoder();
-  let buffer = "";
-  let result = "";
-  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: ")) {
-        const data = line.slice(6);
-        if (data === "[DONE]") continue;
-        try {
-          const parsed = JSON.parse(data);
-          const chunk = parsed.content ?? parsed.text ?? "";
-          if (chunk) result += chunk;
-        } catch {
-        }
-      }
-    }
-  }
-  return result;
-};
 var DEFAULT_STORAGE_KEY2 = "chatllm_sessions";
 var DEFAULT_COMPRESSION_THRESHOLD = 20;
 var DEFAULT_KEEP_RECENT = 6;
 var DEFAULT_RECOMPRESSION_THRESHOLD = 10;
 var DEFAULT_TOKEN_LIMIT = 8e3;
+var DEFAULT_STREAM_CHUNK_TIMEOUT = 3e4;
+var DEFAULT_MAX_TOOL_CALL_DEPTH = 5;
+var DEFAULT_MAX_TOOL_RESULT_SIZE = 1e4;
 var DEFAULT_SESSION_CONTEXT_MAX_CHARS = 4e3;
 var DEFAULT_SESSION_CONTEXT_MAX_ITEMS = 10;
 var SESSION_CONTEXT_ITEM_MAX_CHARS = 500;
@@ -2249,6 +2681,12 @@ var useChatUI = (options) => {
     onSendMessage,
     onSessionChange,
     onError,
+    streamChunkTimeout = DEFAULT_STREAM_CHUNK_TIMEOUT,
+    retry: retryConfig,
+    onAbort,
+    onTokenUsage,
+    maxToolCallDepth = DEFAULT_MAX_TOOL_CALL_DEPTH,
+    maxToolResultSize = DEFAULT_MAX_TOOL_RESULT_SIZE,
     onTitleChange,
     generateTitle: generateTitleCallback,
     // Memory options
@@ -2315,8 +2753,8 @@ var useChatUI = (options) => {
   const [input, setInput] = useState6("");
   const [loadingSessionIds, setLoadingSessionIds] = useState6(/* @__PURE__ */ new Set());
   const isLoading = currentSessionId !== null && loadingSessionIds.has(currentSessionId);
-  const addLoadingSession = useCallback6((id) => setLoadingSessionIds((prev) => new Set(prev).add(id)), []);
-  const removeLoadingSession = useCallback6((id) => setLoadingSessionIds((prev) => {
+  const addLoadingSession = useCallback8((id) => setLoadingSessionIds((prev) => new Set(prev).add(id)), []);
+  const removeLoadingSession = useCallback8((id) => setLoadingSessionIds((prev) => {
     const next = new Set(prev);
     next.delete(id);
     return next;
@@ -2343,41 +2781,45 @@ var useChatUI = (options) => {
   const [deepResearchProgress, setDeepResearchProgress] = useState6(
     null
   );
-  const sessionsRef = useRef5(sessions);
+  const sessionsRef = useRef7(sessions);
   useEffect4(() => {
     sessionsRef.current = sessions;
   }, [sessions]);
-  const modelsRef = useRef5(models);
+  const modelsRef = useRef7(models);
   useEffect4(() => {
     modelsRef.current = models;
   }, [models]);
-  const onSendMessageRef = useRef5(onSendMessage);
-  const onResponseHeadersRef = useRef5(options.onResponseHeaders);
-  const onSessionChangeRef = useRef5(onSessionChange);
-  const onErrorRef = useRef5(onError);
-  const onTitleChangeRef = useRef5(onTitleChange);
-  const generateTitleRef = useRef5(generateTitleCallback);
-  const onPersonalizationChangeRef = useRef5(options.onPersonalizationChange);
-  const onPersonalizationSaveRef = useRef5(options.onPersonalizationSave);
-  const onLoadSessionsRef = useRef5(onLoadSessions);
-  const onCreateSessionRef = useRef5(onCreateSession);
-  const onLoadSessionRef = useRef5(onLoadSession);
-  const onDeleteSessionCallbackRef = useRef5(onDeleteSessionCallback);
-  const onUpdateSessionTitleRef = useRef5(onUpdateSessionTitle);
-  const onSaveMessagesRef = useRef5(onSaveMessages);
-  const onToolCallRef = useRef5(onToolCall);
-  const onSkillCompleteRef = useRef5(onSkillComplete);
-  const onSessionContextChangeRef = useRef5(onSessionContextChange);
-  const onLoadModelsRef = useRef5(onLoadModels);
-  const onUploadImageRef = useRef5(onUploadImage);
-  const onImageErrorRef = useRef5(onImageError);
-  const fileUploaderRef = useRef5(fileUploader);
-  const globalMemoryRef = useRef5(null);
+  const onSendMessageRef = useRef7(onSendMessage);
+  const onResponseHeadersRef = useRef7(options.onResponseHeaders);
+  const onSessionChangeRef = useRef7(onSessionChange);
+  const onErrorRef = useRef7(onError);
+  const onAbortRef = useRef7(onAbort);
+  const onTokenUsageRef = useRef7(onTokenUsage);
+  const onTitleChangeRef = useRef7(onTitleChange);
+  const generateTitleRef = useRef7(generateTitleCallback);
+  const onPersonalizationChangeRef = useRef7(options.onPersonalizationChange);
+  const onPersonalizationSaveRef = useRef7(options.onPersonalizationSave);
+  const onLoadSessionsRef = useRef7(onLoadSessions);
+  const onCreateSessionRef = useRef7(onCreateSession);
+  const onLoadSessionRef = useRef7(onLoadSession);
+  const onDeleteSessionCallbackRef = useRef7(onDeleteSessionCallback);
+  const onUpdateSessionTitleRef = useRef7(onUpdateSessionTitle);
+  const onSaveMessagesRef = useRef7(onSaveMessages);
+  const onToolCallRef = useRef7(onToolCall);
+  const onSkillCompleteRef = useRef7(onSkillComplete);
+  const onSessionContextChangeRef = useRef7(onSessionContextChange);
+  const onLoadModelsRef = useRef7(onLoadModels);
+  const onUploadImageRef = useRef7(onUploadImage);
+  const onImageErrorRef = useRef7(onImageError);
+  const fileUploaderRef = useRef7(fileUploader);
+  const globalMemoryRef = useRef7(null);
   useEffect4(() => {
     onSendMessageRef.current = onSendMessage;
     onResponseHeadersRef.current = options.onResponseHeaders;
     onSessionChangeRef.current = onSessionChange;
     onErrorRef.current = onError;
+    onAbortRef.current = onAbort;
+    onTokenUsageRef.current = onTokenUsage;
     onTitleChangeRef.current = onTitleChange;
     generateTitleRef.current = generateTitleCallback;
     onPersonalizationChangeRef.current = options.onPersonalizationChange;
@@ -2396,15 +2838,19 @@ var useChatUI = (options) => {
     fileUploaderRef.current = fileUploader;
     onLoadModelsRef.current = onLoadModels;
   });
-  const abortControllersRef = useRef5(/* @__PURE__ */ new Map());
-  const pendingInitialLoadRef = useRef5(null);
-  const skipNextPollParsingRef = useRef5(false);
-  const skipNextSkillParsingRef = useRef5(false);
-  const skipNextChecklistParsingRef = useRef5(false);
-  const activeChecklistRef = useRef5(null);
-  const pendingChecklistRef = useRef5(null);
-  const pendingAttachmentDataRef = useRef5(null);
-  const lastExtractionMsgCountRef = useRef5(0);
+  const abortControllersRef = useRef7(/* @__PURE__ */ new Map());
+  const { streamResponse } = useStreamingFetch({ chunkTimeout: streamChunkTimeout });
+  const pendingInitialLoadRef = useRef7(null);
+  const skipNextPollParsingRef = useRef7(false);
+  const toolCallDepthRef = useRef7(0);
+  const skipNextSkillParsingRef = useRef7(false);
+  const sendMessageForChecklistRef = useRef7(
+    async () => {
+      console.warn("[ChatUI] sendMessageForChecklistRef called before sendMessage initialized");
+    }
+  );
+  const pendingAttachmentDataRef = useRef7(null);
+  const lastExtractionMsgCountRef = useRef7(0);
   const resolveChecklistRefImage = (item, checklistMessageId, sessionId) => {
     const session = sessionsRef.current.find((s) => s.id === sessionId);
     if (!session) return null;
@@ -2471,7 +2917,7 @@ ${hints.join(" ")}` : "";
     return `${stepLabel}
 ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \uB9C8\uC138\uC694.`;
   };
-  const memoryOptions = useMemo3(
+  const memoryOptions = useMemo4(
     () => ({
       storageType: globalMemoryConfig?.storageType || "localStorage",
       storageKey: globalMemoryConfig?.localStorage?.key || `${storageKey}_memory`,
@@ -2485,11 +2931,11 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
   const globalMemoryRaw = useGlobalMemory(memoryOptions);
   const globalMemory = useGlobalMemoryEnabled ? globalMemoryRaw : null;
   globalMemoryRef.current = globalMemory;
-  const stableToolCall = useCallback6(
+  const stableToolCall = useCallback8(
     (name, params) => onToolCallRef.current(name, params),
     []
   );
-  const mergedSkills = useMemo3(() => {
+  const mergedSkills = useMemo4(() => {
     if (!tools || !onToolCall) return skills || {};
     const toolSkills = convertToolsToSkills(tools, stableToolCall);
     return { ...skills || {}, ...toolSkills };
@@ -2527,7 +2973,7 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
   });
   const [projectSettingsOpen, setProjectSettingsOpen] = useState6(false);
   const projectMemoryKey = enableProjects && projectHook.currentProjectId ? `${storageKey}_project_memory_${projectHook.currentProjectId}` : `${storageKey}_project_memory_none`;
-  const projectMemoryOptions = useMemo3(
+  const projectMemoryOptions = useMemo4(
     () => ({
       storageType: globalMemoryConfig?.storageType || "localStorage",
       storageKey: projectMemoryKey,
@@ -2539,7 +2985,7 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
   );
   const projectMemoryRaw = useGlobalMemory(projectMemoryOptions);
   const projectMemory = enableProjects ? projectMemoryRaw : null;
-  const unwrapResponseHeaders = useCallback6((result) => {
+  const unwrapResponseHeaders = useCallback8((result) => {
     if (typeof result === "object" && result !== null && "response" in result && "headers" in result) {
       const wrapped = result;
       onResponseHeadersRef.current?.(wrapped.headers);
@@ -2547,7 +2993,7 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
     }
     return result;
   }, []);
-  const emitFetchHeaders = useCallback6((response) => {
+  const emitFetchHeaders = useCallback8((response) => {
     if (onResponseHeadersRef.current && response.headers) {
       const headerMap = {};
       response.headers.forEach((v, k) => {
@@ -2556,7 +3002,7 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
       onResponseHeadersRef.current(headerMap);
     }
   }, []);
-  const callInternalLLM = useCallback6(async (prompt, model) => {
+  const callInternalLLM = useCallback8(async (prompt, model) => {
     if (onSendMessageRef.current) {
       const modelConfig = modelsRef.current.find((m) => m.id === model);
       const provider = modelConfig?.provider || "ollama";
@@ -2594,7 +3040,7 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
   const currentSession = sessions.find((s) => s.id === currentSessionId) || null;
   const messages = currentSession?.messages.filter((m) => !m.hidden) || [];
   const compressionState = currentSession?.compressionState || null;
-  const visibleSessions = useMemo3(() => {
+  const visibleSessions = useMemo4(() => {
     if (!enableProjects || !projectHook.currentProjectId) return sessions;
     return sessions.filter((s) => s.projectId === projectHook.currentProjectId);
   }, [sessions, enableProjects, projectHook.currentProjectId]);
@@ -2689,7 +3135,7 @@ ${focusHint}${hintLine} checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \u
   useEffect4(() => {
     onSessionChangeRef.current?.(currentSession);
   }, [currentSession]);
-  const buildSystemPrompt = useCallback6((session) => {
+  const buildSystemPrompt = useCallback8((session) => {
     const parts = [];
     const { userProfile, responseStyle, language } = personalization;
     const identityName = assistantName || "AI \uC5B4\uC2DC\uC2A4\uD134\uD2B8";
@@ -3048,7 +3494,7 @@ AI (\uD655\uC815):
     }
     return parts.length > 0 ? parts.join("\n") : "";
   }, [personalization, globalMemory, useGlobalMemoryEnabled, enablePoll, enableChecklist, buildSkillsPrompt, enableProjects, projectHook.currentProject, projectMemory, resolvedSkills, assistantName, onBuildSystemPrompt, compactSystemPrompt, selectedModel]);
-  const promoteToSessionContext = useCallback6((sessionId, skillName, content, metadata, label) => {
+  const promoteToSessionContext = useCallback8((sessionId, skillName, content, metadata, label) => {
     const item = createSessionContextItem(skillName, content, metadata, label);
     setSessions(
       (prev) => prev.map((s) => {
@@ -3059,7 +3505,7 @@ AI (\uD655\uC815):
       })
     );
   }, []);
-  const compressContext = useCallback6(async (messagesToCompress, model) => {
+  const compressContext = useCallback8(async (messagesToCompress, model) => {
     const conversationText = messagesToCompress.map((m) => `${m.role === "user" ? "\uC0AC\uC6A9\uC790" : "AI"}: ${m.content}`).join("\n\n");
     const summaryPrompt = `\uB2E4\uC74C \uB300\uD654 \uB0B4\uC6A9\uC744 \uD575\uC2EC \uC815\uBCF4\uB9CC \uC720\uC9C0\uD558\uBA74\uC11C \uAC04\uACB0\uD558\uAC8C \uC694\uC57D\uD574\uC8FC\uC138\uC694.
 \uC911\uC694\uD55C \uACB0\uC815\uC0AC\uD56D, \uC0AC\uC6A9\uC790 \uC694\uAD6C\uC0AC\uD56D, \uB9E5\uB77D \uC815\uBCF4\uB97C \uBCF4\uC874\uD558\uC138\uC694.
@@ -3074,7 +3520,7 @@ ${conversationText}
       return "";
     }
   }, [callInternalLLM]);
-  const incrementalCompressContext = useCallback6(
+  const incrementalCompressContext = useCallback8(
     async (existingSummary, newMessages, model) => {
       const newConversation = newMessages.map((m) => `${m.role === "user" ? "\uC0AC\uC6A9\uC790" : "AI"}: ${m.content}`).join("\n\n");
       const mergePrompt = `\uAE30\uC874 \uB300\uD654 \uC694\uC57D\uACFC \uC0C8\uB85C\uC6B4 \uB300\uD654 \uB0B4\uC6A9\uC744 \uD1B5\uD569\uD558\uC5EC \uD558\uB098\uC758 \uC694\uC57D\uC73C\uB85C \uB9CC\uB4E4\uC5B4\uC8FC\uC138\uC694.
@@ -3101,10 +3547,10 @@ ${newConversation}
     },
     [callInternalLLM]
   );
-  const estimateTokens = useCallback6((messages2) => {
+  const estimateTokens = useCallback8((messages2) => {
     return messages2.reduce((sum, m) => sum + Math.ceil(m.content.length / 4), 0);
   }, []);
-  const newSession = useCallback6(async () => {
+  const newSession = useCallback8(async () => {
     const projectId = enableProjects ? projectHook.currentProjectId || DEFAULT_PROJECT_ID : void 0;
     if (useExternalStorage && onCreateSessionRef.current) {
       setIsSessionLoading(true);
@@ -3142,7 +3588,7 @@ ${newConversation}
     setSessions((prev) => [newSess, ...prev]);
     setCurrentSessionId(newSess.id);
   }, [selectedModel, useExternalStorage, enableProjects, projectHook.currentProjectId]);
-  const selectSession = useCallback6(async (id) => {
+  const selectSession = useCallback8(async (id) => {
     if (useExternalStorage && onLoadSessionRef.current) {
       setIsSessionLoading(true);
       try {
@@ -3252,7 +3698,7 @@ ${newConversation}
     pendingInitialLoadRef.current = null;
     selectSession(id);
   }, [currentSessionId, selectSession, useExternalStorage]);
-  const deleteSession = useCallback6(async (id) => {
+  const deleteSession = useCallback8(async (id) => {
     if (useExternalStorage && onDeleteSessionCallbackRef.current) {
       try {
         await onDeleteSessionCallbackRef.current(id);
@@ -3280,7 +3726,7 @@ ${newConversation}
       return filtered;
     });
   }, [currentSessionId, storageKey, useExternalStorage]);
-  const renameSession = useCallback6(async (id, newTitle) => {
+  const renameSession = useCallback8(async (id, newTitle) => {
     if (!newTitle.trim()) return;
     if (useExternalStorage && onUpdateSessionTitleRef.current) {
       try {
@@ -3303,7 +3749,7 @@ ${newConversation}
     );
     onTitleChangeRef.current?.(id, newTitle.trim());
   }, [useExternalStorage]);
-  const setModel = useCallback6((model) => {
+  const setModel = useCallback8((model) => {
     setSelectedModel(model);
     if (currentSessionId) {
       setSessions(
@@ -3311,10 +3757,10 @@ ${newConversation}
       );
     }
   }, [currentSessionId]);
-  const toggleSidebar = useCallback6(() => setSidebarOpen((prev) => !prev), []);
-  const openSettings = useCallback6(() => setSettingsOpen(true), []);
-  const closeSettings = useCallback6(() => setSettingsOpen(false), []);
-  const copyMessage = useCallback6((content, id) => {
+  const toggleSidebar = useCallback8(() => setSidebarOpen((prev) => !prev), []);
+  const openSettings = useCallback8(() => setSettingsOpen(true), []);
+  const closeSettings = useCallback8(() => setSettingsOpen(false), []);
+  const copyMessage = useCallback8((content, id) => {
     if (typeof navigator !== "undefined") {
       navigator.clipboard.writeText(content).then(() => {
         setCopiedMessageId(id);
@@ -3322,30 +3768,30 @@ ${newConversation}
       });
     }
   }, []);
-  const startEdit = useCallback6((message) => {
+  const startEdit = useCallback8((message) => {
     if (message.role === "user") {
       setEditingMessageId(message.id);
     }
   }, []);
-  const cancelEdit = useCallback6(() => {
+  const cancelEdit = useCallback8(() => {
     setEditingMessageId(null);
   }, []);
-  const stopGeneration = useCallback6(() => {
+  const stopGeneration = useCallback8(() => {
     if (currentSessionId) {
       abortControllersRef.current.get(currentSessionId)?.abort();
     }
   }, [currentSessionId]);
-  const updatePersonalization = useCallback6((config) => {
+  const updatePersonalization = useCallback8((config) => {
     setPersonalization((prev) => {
       const next = { ...prev, ...config };
       onPersonalizationChangeRef.current?.(next);
       return next;
     });
   }, []);
-  const savePersonalization = useCallback6(() => {
+  const savePersonalization = useCallback8(() => {
     onPersonalizationSaveRef.current?.(personalization);
   }, [personalization]);
-  const addAttachments = useCallback6((files) => {
+  const addAttachments = useCallback8((files) => {
     const newAttachments = files.map((file) => {
       const isImage = file.type.startsWith("image/");
       return {
@@ -3360,7 +3806,7 @@ ${newConversation}
     });
     setAttachments((prev) => [...prev, ...newAttachments]);
   }, []);
-  const removeAttachment = useCallback6((id) => {
+  const removeAttachment = useCallback8((id) => {
     setAttachments((prev) => {
       const target = prev.find((a) => a.id === id);
       if (target?.previewUrl) {
@@ -3369,17 +3815,17 @@ ${newConversation}
       return prev.filter((a) => a.id !== id);
     });
   }, []);
-  const toggleDeepResearchMode = useCallback6(() => {
+  const toggleDeepResearchMode = useCallback8(() => {
     setIsDeepResearchMode((prev) => !prev);
   }, []);
-  const trackBehavior = useCallback6(async (key, updater) => {
+  const trackBehavior = useCallback8(async (key, updater) => {
     if (!globalMemory) return;
     const fullKey = `behavior.${key}`;
     const prev = globalMemory.get(fullKey) ?? {};
     const next = updater(prev);
     await globalMemory.set(fullKey, next, { category: "behavior" });
   }, [globalMemory]);
-  const trackMessageLength = useCallback6((length) => {
+  const trackMessageLength = useCallback8((length) => {
     trackBehavior("messageLength", (prev) => {
       const samples = (prev.messageLengthSamples || []).slice(-19);
       samples.push(length);
@@ -3387,39 +3833,69 @@ ${newConversation}
       return { ...prev, messageLengthSamples: samples, avgMessageLength: avg };
     });
   }, [trackBehavior]);
-  const trackSkillUsage = useCallback6((skillName) => {
+  const trackSkillUsage = useCallback8((skillName) => {
     trackBehavior("skillUsage", (prev) => ({
       ...prev,
       [skillName]: (prev[skillName] || 0) + 1
     }));
   }, [trackBehavior]);
-  const trackChecklistSkip = useCallback6(() => {
+  const trackChecklistSkip = useCallback8(() => {
     trackBehavior("checklistSkipRate", (prev) => ({
       total: (prev.total || 0) + 1,
       skipped: (prev.skipped || 0) + 1
     }));
   }, [trackBehavior]);
-  const trackChecklistComplete = useCallback6(() => {
+  const trackChecklistComplete = useCallback8(() => {
     trackBehavior("checklistSkipRate", (prev) => ({
       total: (prev.total || 0) + 1,
       skipped: prev.skipped || 0
     }));
   }, [trackBehavior]);
-  const trackRegenerate = useCallback6(() => {
+  const {
+    activeChecklistRef,
+    pendingChecklistRef,
+    skipNextChecklistParsingRef,
+    handleChecklistStart,
+    handleChecklistAbort,
+    handleChecklistRetry,
+    handleChecklistSkip
+  } = useChecklist({
+    sessionsRef,
+    sessions,
+    setSessions,
+    sendMessage: (...args) => sendMessageForChecklistRef.current(...args),
+    abortControllers: abortControllersRef,
+    removeLoadingSession,
+    pendingAttachmentDataRef,
+    trackChecklistSkip,
+    resolveChecklistRefImage,
+    buildChecklistStepPrompt
+  });
+  const trackRegenerate = useCallback8(() => {
     trackBehavior("regenerateRate", (prev) => ({
       ...prev,
       regenerated: (prev.regenerated || 0) + 1
     }));
   }, [trackBehavior]);
-  const trackMessageSent = useCallback6(() => {
+  const trackMessageSent = useCallback8(() => {
     trackBehavior("regenerateRate", (prev) => ({
       total: (prev.total || 0) + 1,
       regenerated: prev.regenerated || 0
     }));
   }, [trackBehavior]);
-  const sendMessage = useCallback6(async (content, options2) => {
+  const sendMessage = useCallback8(async (content, options2) => {
     const messageContent = content || input;
     if (!messageContent.trim() && attachments.length === 0 || isLoading) return;
+    if (options2?.hiddenUserMessage) {
+      toolCallDepthRef.current += 1;
+      if (toolCallDepthRef.current > maxToolCallDepth) {
+        toolCallDepthRef.current = 0;
+        onErrorRef.current?.(new Error(`\uB3C4\uAD6C \uD638\uCD9C \uAE4A\uC774 \uC81C\uD55C \uCD08\uACFC (\uCD5C\uB300 ${maxToolCallDepth}\uD68C)`));
+        return;
+      }
+    } else {
+      toolCallDepthRef.current = 0;
+    }
     let sessionId = currentSessionId;
     if (!sessionId) {
       if (useExternalStorage && onCreateSessionRef.current) {
@@ -3705,10 +4181,11 @@ ${finalContent}`;
       return;
     }
     abortControllersRef.current.set(capturedSessionId, new AbortController());
+    let accumulatedContent = "";
+    let lastUsage = null;
     try {
       const shouldSkipSkillParsing = skipNextSkillParsingRef.current;
       skipNextSkillParsingRef.current = false;
-      let accumulatedContent = "";
       let checklistStepImageUrl = null;
       let messagesToSend = [...existingMessages, userMessage];
       const recompressionThreshold = DEFAULT_RECOMPRESSION_THRESHOLD;
@@ -3914,119 +4391,71 @@ ${attachmentContext}
         emitFetchHeaders(response);
       }
       if (response) {
-        if (!response.ok) throw new Error("API error");
-        const reader = response.body?.getReader();
-        if (!reader) throw new Error("No reader");
-        const decoder = new TextDecoder();
-        let buffer = "";
         let skillTagDetected = false;
         let checklistTagDetected = false;
         let toolCallAcc = 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.trim()) continue;
-            let data = line;
-            if (line.startsWith("data: ")) {
-              data = line.slice(6);
-              if (data === "[DONE]") continue;
+        const streamResult = await streamResponse(response, (chunk) => {
+          if (useNativeTools && chunk.delta?.tool_calls) {
+            toolCallAcc = accumulateToolCallDelta(toolCallAcc, chunk.delta);
+          }
+          if (useNativeTools && chunk.finishReason === "tool_calls" && toolCallAcc) {
+            accumulatedContent += toolCallToSkillUseXml(toolCallAcc);
+            skillTagDetected = true;
+            return "break";
+          }
+          const { content: content2, thinking } = chunk;
+          if (content2 || thinking) {
+            if (content2) accumulatedContent += content2;
+            if (!shouldSkipSkillParsing && accumulatedContent.includes("</skill_use>")) {
+              const endIdx = accumulatedContent.indexOf("</skill_use>");
+              accumulatedContent = accumulatedContent.substring(0, endIdx + "</skill_use>".length);
+              skillTagDetected = true;
             }
-            try {
-              const parsed = JSON.parse(data);
-              const delta = parsed.choices?.[0]?.delta;
-              const finishReason = parsed.choices?.[0]?.finish_reason;
-              if (useNativeTools && delta?.tool_calls) {
-                toolCallAcc = accumulateToolCallDelta(toolCallAcc, delta);
-              }
-              if (useNativeTools && finishReason === "tool_calls" && toolCallAcc) {
-                accumulatedContent += toolCallToSkillUseXml(toolCallAcc);
-                skillTagDetected = true;
-                break;
-              }
-              const content2 = delta?.content || parsed.message?.content || parsed.content || parsed.text || "";
-              const thinking = parsed.message?.thinking || "";
-              if (content2 || thinking) {
-                if (content2) accumulatedContent += content2;
-                if (!shouldSkipSkillParsing && accumulatedContent.includes("</skill_use>")) {
-                  const endIdx = accumulatedContent.indexOf("</skill_use>");
-                  accumulatedContent = accumulatedContent.substring(0, endIdx + "</skill_use>".length);
-                  skillTagDetected = true;
-                }
-                if (!skipNextChecklistParsingRef.current && accumulatedContent.includes("</checklist>")) {
-                  const endIdx = accumulatedContent.indexOf("</checklist>");
-                  accumulatedContent = accumulatedContent.substring(0, endIdx + "</checklist>".length);
-                  checklistTagDetected = true;
-                }
-                const displayContent = skillTagDetected ? accumulatedContent : null;
-                setSessions(
-                  (prev) => prev.map((s) => {
-                    if (s.id === capturedSessionId) {
-                      return {
-                        ...s,
-                        messages: s.messages.map((m) => {
-                          if (m.id !== assistantMessageId) return m;
-                          if (displayContent) {
-                            return { ...m, content: displayContent };
-                          }
-                          let newContent = m.content;
-                          if (thinking) {
-                            if (!newContent.includes("<thinking>")) {
-                              newContent = "<thinking>" + thinking;
-                            } else if (!newContent.includes("</thinking>")) {
-                              newContent += thinking;
-                            }
-                          }
-                          if (content2) {
-                            if (newContent.includes("<thinking>") && !newContent.includes("</thinking>")) {
-                              newContent += "</thinking>\n\n";
-                            }
-                            newContent += content2;
-                          }
-                          return { ...m, content: newContent };
-                        })
-                      };
-                    }
-                    return s;
-                  })
-                );
-                if (skillTagDetected || checklistTagDetected) break;
-              }
-            } catch {
+            if (!skipNextChecklistParsingRef.current && accumulatedContent.includes("</checklist>")) {
+              const endIdx = accumulatedContent.indexOf("</checklist>");
+              accumulatedContent = accumulatedContent.substring(0, endIdx + "</checklist>".length);
+              checklistTagDetected = true;
             }
+            const displayContent = skillTagDetected ? accumulatedContent : null;
+            setSessions(
+              (prev) => prev.map((s) => {
+                if (s.id === capturedSessionId) {
+                  return {
+                    ...s,
+                    messages: s.messages.map((m) => {
+                      if (m.id !== assistantMessageId) return m;
+                      if (displayContent) {
+                        return { ...m, content: displayContent };
+                      }
+                      let newContent = m.content;
+                      if (thinking) {
+                        if (!newContent.includes("<thinking>")) {
+                          newContent = "<thinking>" + thinking;
+                        } else if (!newContent.includes("</thinking>")) {
+                          newContent += thinking;
+                        }
+                      }
+                      if (content2) {
+                        if (newContent.includes("<thinking>") && !newContent.includes("</thinking>")) {
+                          newContent += "</thinking>\n\n";
+                        }
+                        newContent += content2;
+                      }
+                      return { ...m, content: newContent };
+                    })
+                  };
+                }
+                return s;
+              })
+            );
+            if (skillTagDetected || checklistTagDetected) return "break";
           }
-          if (skillTagDetected || checklistTagDetected) break;
-        }
+        });
+        lastUsage = streamResult.usage;
         if (useNativeTools && toolCallAcc && !skillTagDetected) {
           accumulatedContent += toolCallToSkillUseXml(toolCallAcc);
           skillTagDetected = true;
         }
-        if (buffer.trim()) {
-          try {
-            const parsed = JSON.parse(buffer);
-            const content2 = parsed.message?.content || parsed.content || parsed.text;
-            if (content2) {
-              accumulatedContent += content2;
-              setSessions(
-                (prev) => prev.map((s) => {
-                  if (s.id === capturedSessionId) {
-                    return {
-                      ...s,
-                      messages: s.messages.map(
-                        (m) => m.id === assistantMessageId ? { ...m, content: m.content + content2 } : m
-                      )
-                    };
-                  }
-                  return s;
-                })
-              );
-            }
-          } catch {
-          }
-        }
       }
       const saveMessagesOnEarlyReturn = (overrideContentParts) => {
         if (!useExternalStorage || !capturedSessionId) return;
@@ -4387,9 +4816,10 @@ ${result.content}
               }
               skipNextSkillParsingRef.current = true;
               saveMessagesOnEarlyReturn();
+              const truncatedResult = result.content.length > maxToolResultSize ? result.content.substring(0, maxToolResultSize) + "\n\n...(truncated)" : result.content;
               const resultPrompt = `\uC2A4\uD0AC "${detectedSkill.name}" \uC2E4\uD589 \uACB0\uACFC:
 
-${result.content}
+${truncatedResult}
 
 \uC704 \uACB0\uACFC\uB97C \uBC14\uD0D5\uC73C\uB85C \uC0AC\uC6A9\uC790\uC758 \uC6D0\uB798 \uC9C8\uBB38\uC5D0 \uB2F5\uBCC0\uD574\uC8FC\uC138\uC694. skill_use \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \uB9C8\uC138\uC694.`;
               setTimeout(() => {
@@ -4715,6 +5145,32 @@ ${stepSummary}
           };
         })
       );
+      if (lastUsage && capturedSessionId) {
+        const usage = lastUsage;
+        setSessions(
+          (prev) => prev.map((s) => {
+            if (s.id !== capturedSessionId) return s;
+            const prevStats = s.tokenStats ?? {
+              totalPromptTokens: 0,
+              totalCompletionTokens: 0,
+              totalTokens: 0,
+              messageCount: 0,
+              lastUpdated: 0
+            };
+            return {
+              ...s,
+              tokenStats: {
+                totalPromptTokens: prevStats.totalPromptTokens + usage.promptTokens,
+                totalCompletionTokens: prevStats.totalCompletionTokens + usage.completionTokens,
+                totalTokens: prevStats.totalTokens + usage.totalTokens,
+                messageCount: prevStats.messageCount + 1,
+                lastUpdated: Date.now()
+              }
+            };
+          })
+        );
+        onTokenUsageRef.current?.(capturedSessionId, usage);
+      }
       if (useExternalStorage && capturedSessionId) {
         const assistantContentForSave = accumulatedContent;
         if (assistantContentForSave && onSaveMessagesRef.current) {
@@ -4743,296 +5199,77 @@ ${stepSummary}
         if (sinceLastExtraction >= 4) {
           lastExtractionMsgCountRef.current = currentMsgCount;
           const recentForExtraction = [...existingMessages.slice(-6), userMessage].map(
-            (m) => ({ role: m.role, content: m.content })
-          );
-          infoExtraction.extractInfo(recentForExtraction).catch(() => {
-          });
-        }
-      }
-      if (observerConfig) {
-        const newMessages = [userMessage, { id: assistantMessageId, role: "assistant", content: accumulatedContent, timestamp: Date.now() }];
-        observer.processMessages(capturedSessionId, newMessages);
-      }
-    } catch (error) {
-      if (error instanceof Error && error.name === "AbortError") {
-        return;
-      }
-      const err = error instanceof Error ? error : new Error("Unknown error");
-      onErrorRef.current?.(err);
-      setSessions(
-        (prev) => prev.map((s) => {
-          if (s.id === capturedSessionId) {
-            return {
-              ...s,
-              messages: s.messages.map(
-                (m) => m.id === assistantMessageId ? { ...m, content: "\uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694." } : m
-              )
-            };
-          }
-          return s;
-        })
-      );
-    } finally {
-      removeLoadingSession(capturedSessionId);
-      abortControllersRef.current.delete(capturedSessionId);
-    }
-  }, [
-    input,
-    loadingSessionIds,
-    currentSessionId,
-    sessions,
-    selectedModel,
-    quotedText,
-    selectedAction,
-    apiEndpoint,
-    apiKey,
-    models,
-    contextCompressionThreshold,
-    keepRecentMessages,
-    buildSystemPrompt,
-    compressContext,
-    useExternalStorage,
-    handleSkillCall,
-    resolvedSkills,
-    /** @Todo vibecode - attachments, continueAfterToolResult를 deps에 추가하여 stale closure 방지 */
-    attachments,
-    continueAfterToolResult
-  ]);
-  const handleChecklistStart = useCallback6(
-    (messageId) => {
-      const session = sessionsRef.current.find(
-        (s) => s.messages.some((m) => m.id === messageId)
-      );
-      if (!session) return;
-      const message = session.messages.find((m) => m.id === messageId);
-      if (!message?.checklistBlock) return;
-      pendingChecklistRef.current = null;
-      activeChecklistRef.current = {
-        messageId,
-        sessionId: session.id,
-        items: message.checklistBlock.items.map((it) => ({ id: it.id, title: it.title, skill: it.skill, fileIndex: it.fileIndex, fileType: it.fileType, refImage: it.refImage, refStep: it.refStep })),
-        currentStep: 0,
-        stepResults: []
-      };
-      setSessions(
-        (prev) => prev.map((s) => {
-          if (s.id !== session.id) return s;
-          return {
-            ...s,
-            messages: s.messages.map((m) => {
-              if (m.id !== messageId || !m.checklistBlock) return m;
-              const updatedItems = m.checklistBlock.items.map((it, idx) => ({
-                ...it,
-                status: idx === 0 ? "in_progress" : it.status
-              }));
-              return {
-                ...m,
-                checklistBlock: { ...m.checklistBlock, items: updatedItems, currentStep: 0 }
-              };
-            })
-          };
-        })
-      );
-      skipNextChecklistParsingRef.current = true;
-      setTimeout(() => {
-        const items = message.checklistBlock.items;
-        const refUrl = resolveChecklistRefImage(items[0], messageId, session.id);
-        if (refUrl) pendingAttachmentDataRef.current = [{ name: "ref_image", mimeType: "image/png", base64: "", size: 0, url: refUrl }];
-        sendMessage(
-          buildChecklistStepPrompt(0, items.length, items[0], true, refUrl),
-          { hiddenUserMessage: true, isChecklistExecution: true, checklistStep: { index: 0, title: items[0].title } }
-        );
-      }, 100);
-    },
-    [sendMessage]
-  );
-  const handleChecklistAbort = useCallback6(() => {
-    if (!activeChecklistRef.current) return;
-    const checklist = activeChecklistRef.current;
-    const stepIdx = checklist.currentStep;
-    abortControllersRef.current.get(checklist.sessionId)?.abort();
-    setSessions(
-      (prev) => prev.map((s) => {
-        if (s.id !== checklist.sessionId) return s;
-        return {
-          ...s,
-          messages: s.messages.map((m) => {
-            if (m.id !== checklist.messageId || !m.checklistBlock) return m;
-            return {
-              ...m,
-              checklistBlock: {
-                ...m.checklistBlock,
-                items: m.checklistBlock.items.map((it, idx) => ({
-                  ...it,
-                  status: idx === stepIdx ? "error" : it.status
-                }))
-              }
-            };
-          })
-        };
-      })
-    );
-    activeChecklistRef.current = null;
-    removeLoadingSession(checklist.sessionId);
-  }, [removeLoadingSession]);
-  const handleChecklistRetry = useCallback6(
-    (messageId, stepIndex) => {
-      const session = sessionsRef.current.find(
-        (s) => s.messages.some((m) => m.id === messageId)
-      );
-      if (!session) return;
-      const message = session.messages.find((m) => m.id === messageId);
-      if (!message?.checklistBlock) return;
-      activeChecklistRef.current = {
-        messageId,
-        sessionId: session.id,
-        items: message.checklistBlock.items.map((it) => ({ id: it.id, title: it.title, skill: it.skill, fileIndex: it.fileIndex, fileType: it.fileType, refImage: it.refImage, refStep: it.refStep })),
-        currentStep: stepIndex,
-        stepResults: message.checklistBlock.items.slice(0, stepIndex).map((it) => it.result || "")
-      };
-      setSessions(
-        (prev) => prev.map((s) => {
-          if (s.id !== session.id) return s;
-          return {
-            ...s,
-            messages: s.messages.map((m) => {
-              if (m.id !== messageId || !m.checklistBlock) return m;
-              return {
-                ...m,
-                checklistBlock: {
-                  ...m.checklistBlock,
-                  items: m.checklistBlock.items.map((it, idx) => ({
-                    ...it,
-                    status: idx === stepIndex ? "in_progress" : idx > stepIndex ? "pending" : it.status
-                  })),
-                  currentStep: stepIndex
-                }
-              };
-            })
-          };
-        })
-      );
-      skipNextChecklistParsingRef.current = true;
-      setTimeout(() => {
-        const items = message.checklistBlock.items;
-        const refUrl = resolveChecklistRefImage(items[stepIndex], messageId, session.id);
-        if (refUrl) pendingAttachmentDataRef.current = [{ name: "ref_image", mimeType: "image/png", base64: "", size: 0, url: refUrl }];
-        sendMessage(
-          buildChecklistStepPrompt(stepIndex, items.length, items[stepIndex], stepIndex === 0, refUrl),
-          { hiddenUserMessage: true, isChecklistExecution: true, checklistStep: { index: stepIndex, title: items[stepIndex].title } }
-        );
-      }, 100);
-    },
-    [sendMessage]
-  );
-  const handleChecklistSkip = useCallback6(
-    (messageId, stepIndex) => {
-      const session = sessionsRef.current.find(
-        (s) => s.messages.some((m) => m.id === messageId)
-      );
-      if (!session) return;
-      const message = session.messages.find((m) => m.id === messageId);
-      if (!message?.checklistBlock) return;
-      trackChecklistSkip();
-      setSessions(
-        (prev) => prev.map((s) => {
-          if (s.id !== session.id) return s;
-          return {
-            ...s,
-            messages: s.messages.map((m) => {
-              if (m.id !== messageId || !m.checklistBlock) return m;
-              return {
-                ...m,
-                checklistBlock: {
-                  ...m.checklistBlock,
-                  items: m.checklistBlock.items.map((it, idx) => ({
-                    ...it,
-                    status: idx === stepIndex ? "done" : it.status,
-                    result: idx === stepIndex ? "(\uAC74\uB108\uB700)" : it.result
-                  }))
-                }
-              };
-            })
-          };
-        })
-      );
-      const nextPending = message.checklistBlock.items.findIndex(
-        (it, idx) => idx > stepIndex && (it.status === "pending" || it.status === "error")
-      );
-      if (nextPending >= 0) {
-        activeChecklistRef.current = {
-          messageId,
-          sessionId: session.id,
-          items: message.checklistBlock.items.map((it) => ({ id: it.id, title: it.title, skill: it.skill, fileIndex: it.fileIndex, fileType: it.fileType, refImage: it.refImage, refStep: it.refStep })),
-          currentStep: nextPending,
-          stepResults: message.checklistBlock.items.slice(0, nextPending).map((it) => it.result || "(\uAC74\uB108\uB700)")
-        };
-        setSessions(
-          (prev) => prev.map((s) => {
-            if (s.id !== session.id) return s;
-            return {
-              ...s,
-              messages: s.messages.map((m) => {
-                if (m.id !== messageId || !m.checklistBlock) return m;
-                return {
-                  ...m,
-                  checklistBlock: {
-                    ...m.checklistBlock,
-                    items: m.checklistBlock.items.map((it, idx) => ({
-                      ...it,
-                      status: idx === nextPending ? "in_progress" : it.status
-                    })),
-                    currentStep: nextPending
-                  }
-                };
-              })
-            };
-          })
-        );
-        skipNextChecklistParsingRef.current = true;
-        setTimeout(() => {
-          const items = message.checklistBlock.items;
-          const refUrl = resolveChecklistRefImage(items[nextPending], messageId, session.id);
-          if (refUrl) pendingAttachmentDataRef.current = [{ name: "ref_image", mimeType: "image/png", base64: "", size: 0, url: refUrl }];
-          sendMessage(
-            buildChecklistStepPrompt(nextPending, items.length, items[nextPending], false, refUrl),
-            { hiddenUserMessage: true, isChecklistExecution: true, checklistStep: { index: nextPending, title: items[nextPending].title } }
+            (m) => ({ role: m.role, content: m.content })
           );
-        }, 100);
-      } else {
-        const allResults = message.checklistBlock.items.map((it, i) => {
-          const result = i === stepIndex ? "(\uAC74\uB108\uB700)" : it.result || "(\uAC74\uB108\uB700)";
-          return `### ${i + 1}. ${it.title}
-${result}`;
-        }).join("\n\n");
-        setSessions(
-          (prev) => prev.map((s) => {
-            if (s.id !== session.id) return s;
+          infoExtraction.extractInfo(recentForExtraction).catch(() => {
+          });
+        }
+      }
+      if (observerConfig) {
+        const newMessages = [userMessage, { id: assistantMessageId, role: "assistant", content: accumulatedContent, timestamp: Date.now() }];
+        observer.processMessages(capturedSessionId, newMessages);
+      }
+    } catch (error) {
+      const classified = classifyFetchError(error);
+      if (classified.code === "ABORT") {
+        if (accumulatedContent) {
+          setSessions(
+            (prev) => prev.map((s) => {
+              if (s.id !== capturedSessionId) return s;
+              return {
+                ...s,
+                messages: s.messages.map(
+                  (m) => m.id === assistantMessageId ? { ...m, content: accumulatedContent } : m
+                )
+              };
+            })
+          );
+          onAbortRef.current?.(capturedSessionId, accumulatedContent);
+        }
+        return;
+      }
+      onErrorRef.current?.(classified);
+      setSessions(
+        (prev) => prev.map((s) => {
+          if (s.id === capturedSessionId) {
             return {
               ...s,
-              messages: s.messages.map((m) => {
-                if (m.id !== messageId || !m.checklistBlock) return m;
-                return { ...m, checklistBlock: { ...m.checklistBlock, completed: true } };
-              })
+              messages: s.messages.map(
+                (m) => m.id === assistantMessageId ? { ...m, content: accumulatedContent || "\uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694." } : m
+              )
             };
-          })
-        );
-        skipNextChecklistParsingRef.current = true;
-        setTimeout(() => {
-          sendMessage(
-            `\uBAA8\uB4E0 \uCCB4\uD06C\uB9AC\uC2A4\uD2B8 \uB2E8\uACC4\uAC00 \uC644\uB8CC\uB418\uC5C8\uC2B5\uB2C8\uB2E4. \uC544\uB798\uB294 \uAC01 \uB2E8\uACC4\uBCC4 \uACB0\uACFC\uC785\uB2C8\uB2E4:
-
-${allResults}
-
-\uC704 \uACB0\uACFC\uB97C \uC885\uD569\uD558\uC5EC \uCD5C\uC885 \uACB0\uACFC\uBB3C\uC744 \uC644\uC131\uD574\uC8FC\uC138\uC694. checklist \uD0DC\uADF8\uB294 \uC0AC\uC6A9\uD558\uC9C0 \uB9C8\uC138\uC694.`,
-            { hiddenUserMessage: true, isChecklistExecution: true }
-          );
-        }, 100);
-      }
-    },
-    [sendMessage]
-  );
-  const handlePollSubmit = useCallback6(
+          }
+          return s;
+        })
+      );
+    } finally {
+      removeLoadingSession(capturedSessionId);
+      abortControllersRef.current.delete(capturedSessionId);
+    }
+  }, [
+    input,
+    loadingSessionIds,
+    currentSessionId,
+    sessions,
+    selectedModel,
+    quotedText,
+    selectedAction,
+    apiEndpoint,
+    apiKey,
+    models,
+    contextCompressionThreshold,
+    keepRecentMessages,
+    buildSystemPrompt,
+    compressContext,
+    useExternalStorage,
+    handleSkillCall,
+    resolvedSkills,
+    /** @Todo vibecode - attachments, continueAfterToolResult를 deps에 추가하여 stale closure 방지 */
+    attachments,
+    continueAfterToolResult
+  ]);
+  sendMessageForChecklistRef.current = sendMessage;
+  const handlePollSubmit = useCallback8(
     (messageId, responses) => {
       const currentSess = sessions.find((s) => s.id === currentSessionId);
       const targetMessage = currentSess?.messages.find((m) => m.id === messageId);
@@ -5102,7 +5339,7 @@ ${formattedParts.join("\n")}
     },
     [sessions, currentSessionId, selectedModel, sendMessage]
   );
-  const saveEdit = useCallback6(async (content) => {
+  const saveEdit = useCallback8(async (content) => {
     if (!editingMessageId || !currentSession || !currentSessionId) return;
     const messageIndex = currentSession.messages.findIndex((m) => m.id === editingMessageId);
     if (messageIndex === -1) return;
@@ -5119,7 +5356,7 @@ ${formattedParts.join("\n")}
     setEditingMessageId(null);
     await sendMessage(content);
   }, [editingMessageId, currentSession, currentSessionId, sendMessage]);
-  const regenerate = useCallback6(async (messageId) => {
+  const regenerate = useCallback8(async (messageId) => {
     console.log("[ChatUI] Regenerate called:", { messageId, currentSessionId, isLoading });
     if (!currentSession || !currentSessionId || isLoading) {
       console.log("[ChatUI] Regenerate early return - missing session or loading");
@@ -5195,100 +5432,39 @@ ${formattedParts.join("\n")}
         signal: abortControllersRef.current.get(capturedSessionId).signal
       });
       console.log("[ChatUI] Regenerate response status:", response.status);
-      if (!response.ok) throw new Error(`API error: ${response.status}`);
-      const reader = response.body?.getReader();
-      if (!reader) throw new Error("No reader");
-      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() || "";
-        for (const line of lines) {
-          if (!line.trim()) continue;
-          let data = line;
-          if (line.startsWith("data: ")) {
-            data = line.slice(6);
-            if (data === "[DONE]") continue;
-          }
-          try {
-            const parsed = JSON.parse(data);
-            const content = parsed.message?.content || parsed.content || parsed.text || "";
-            const thinking = parsed.message?.thinking || "";
-            if (content || thinking) {
-              setSessions(
-                (prev) => prev.map((s) => {
-                  if (s.id === capturedSessionId) {
-                    return {
-                      ...s,
-                      messages: s.messages.map((m) => {
-                        if (m.id !== assistantMessageId) return m;
-                        let newContent = m.content;
-                        if (thinking) {
-                          if (!newContent.includes("<thinking>")) {
-                            newContent = "<thinking>" + thinking;
-                          } else if (!newContent.includes("</thinking>")) {
-                            newContent += thinking;
-                          }
-                        }
-                        if (content) {
-                          if (newContent.includes("<thinking>") && !newContent.includes("</thinking>")) {
-                            newContent += "</thinking>\n\n";
-                          }
-                          newContent += content;
-                        }
-                        return { ...m, content: newContent };
-                      })
-                    };
-                  }
-                  return s;
-                })
-              );
-            }
-          } catch {
-          }
-        }
-      }
-      if (buffer.trim()) {
-        try {
-          const parsed = JSON.parse(buffer);
-          const content = parsed.message?.content || parsed.content || parsed.text || "";
-          const thinking = parsed.message?.thinking || "";
-          if (content || thinking) {
-            setSessions(
-              (prev) => prev.map((s) => {
-                if (s.id === capturedSessionId) {
-                  return {
-                    ...s,
-                    messages: s.messages.map((m) => {
-                      if (m.id !== assistantMessageId) return m;
-                      let newContent = m.content;
-                      if (thinking) {
-                        if (!newContent.includes("<thinking>")) {
-                          newContent = "<thinking>" + thinking;
-                        } else if (!newContent.includes("</thinking>")) {
-                          newContent += thinking;
-                        }
+      await streamResponse(response, (chunk) => {
+        const { content, thinking } = chunk;
+        if (content || thinking) {
+          setSessions(
+            (prev) => prev.map((s) => {
+              if (s.id === capturedSessionId) {
+                return {
+                  ...s,
+                  messages: s.messages.map((m) => {
+                    if (m.id !== assistantMessageId) return m;
+                    let newContent = m.content;
+                    if (thinking) {
+                      if (!newContent.includes("<thinking>")) {
+                        newContent = "<thinking>" + thinking;
+                      } else if (!newContent.includes("</thinking>")) {
+                        newContent += thinking;
                       }
-                      if (content) {
-                        if (newContent.includes("<thinking>") && !newContent.includes("</thinking>")) {
-                          newContent += "</thinking>\n\n";
-                        }
-                        newContent += content;
+                    }
+                    if (content) {
+                      if (newContent.includes("<thinking>") && !newContent.includes("</thinking>")) {
+                        newContent += "</thinking>\n\n";
                       }
-                      return { ...m, content: newContent };
-                    })
-                  };
-                }
-                return s;
-              })
-            );
-          }
-        } catch {
+                      newContent += content;
+                    }
+                    return { ...m, content: newContent };
+                  })
+                };
+              }
+              return s;
+            })
+          );
         }
-      }
+      }, { noTimeout: true });
     } catch (error) {
       if (error instanceof Error && error.name === "AbortError") {
         return;
@@ -5299,7 +5475,7 @@ ${formattedParts.join("\n")}
       removeLoadingSession(capturedSessionId);
     }
   }, [currentSession, currentSessionId, loadingSessionIds, selectedModel, models, apiEndpoint, apiKey, buildSystemPrompt]);
-  const askOtherModel = useCallback6(async (messageId, targetModel) => {
+  const askOtherModel = useCallback8(async (messageId, targetModel) => {
     if (!currentSession || !currentSessionId || isLoading) return;
     const assistantIndex = currentSession.messages.findIndex((m) => m.id === messageId);
     if (assistantIndex === -1) return;
@@ -5354,30 +5530,7 @@ ${currentSession.contextSummary}` },
           responseContent = result.content;
           responseSources = result.sources;
         } else {
-          const reader = result.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() || "";
-            for (const line of lines) {
-              if (line.startsWith("data: ")) {
-                const data = line.slice(6);
-                if (data === "[DONE]") continue;
-                try {
-                  const parsed = JSON.parse(data);
-                  {
-                    const chunk = parsed.content ?? parsed.text ?? "";
-                    if (chunk) responseContent += chunk;
-                  }
-                } catch {
-                }
-              }
-            }
-          }
+          responseContent = await parseSSEResponse(new Response(result));
         }
       } else {
         const isOllama = provider === "ollama" || apiEndpoint.includes("ollama") || apiEndpoint.includes("11434");
@@ -5395,32 +5548,9 @@ ${currentSession.contextSummary}` },
           signal: abortControllersRef.current.get(currentSessionId).signal
         });
         emitFetchHeaders(response);
-        if (!response.ok) throw new Error("API error");
-        const reader = response.body?.getReader();
-        if (!reader) throw new Error("No reader");
-        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() || "";
-          for (const line of lines) {
-            if (line.startsWith("data: ")) {
-              const data = line.slice(6);
-              if (data === "[DONE]") continue;
-              try {
-                const parsed = JSON.parse(data);
-                {
-                  const chunk = parsed.content ?? parsed.text ?? "";
-                  if (chunk) responseContent += chunk;
-                }
-              } catch {
-              }
-            }
-          }
-        }
+        await streamResponse(response, (chunk) => {
+          if (chunk.content) responseContent += chunk.content;
+        }, { noTimeout: true });
       }
       const alternative = {
         id: generateId5("alt"),
@@ -5480,13 +5610,13 @@ ${currentSession.contextSummary}` },
     onSendMessage,
     onError
   ]);
-  const setActiveAlternative = useCallback6((assistantMessageId, index) => {
+  const setActiveAlternative = useCallback8((assistantMessageId, index) => {
     setActiveAlternatives((prev) => ({
       ...prev,
       [assistantMessageId]: index
     }));
   }, []);
-  const getActiveAlternative = useCallback6((assistantMessageId) => {
+  const getActiveAlternative = useCallback8((assistantMessageId) => {
     return activeAlternatives[assistantMessageId] ?? 0;
   }, [activeAlternatives]);
   return {
@@ -5544,6 +5674,10 @@ ${currentSession.contextSummary}` },
       }));
       await infoExtraction.extractInfo(recentMessages);
     },
+    getTokenStats: useCallback8((sessionId) => {
+      const session = sessions.find((s) => s.id === sessionId);
+      return session?.tokenStats ?? null;
+    }, [sessions]),
     // External Storage Loading States
     /**
      * @description 세션 목록 로딩 상태
@@ -5704,7 +5838,7 @@ var ImageErrorContext = createContext(null);
 var useImageError = () => useContext(ImageErrorContext);
 
 // src/react/components/ChatSidebar.tsx
-import { useState as useState9, useRef as useRef7, useEffect as useEffect6 } from "react";
+import { useState as useState9, useRef as useRef9, useEffect as useEffect6 } from "react";
 
 // src/react/components/Icon.tsx
 import { jsx } from "react/jsx-runtime";
@@ -5804,7 +5938,7 @@ var IconSvg = ({
 };
 
 // src/react/components/MarkdownRenderer.tsx
-import React2, { useMemo as useMemo4 } from "react";
+import React2, { useMemo as useMemo5 } from "react";
 
 // src/react/components/LinkChip.tsx
 import { useState as useState7 } from "react";
@@ -6861,11 +6995,11 @@ var MarkdownRenderer = ({
   sources,
   inline = false
 }) => {
-  const inlineRendered = useMemo4(() => {
+  const inlineRendered = useMemo5(() => {
     if (!inline) return null;
     return parseInlineElements(content, "inline-md", sources);
   }, [inline, content, sources]);
-  const rendered = useMemo4(() => {
+  const rendered = useMemo5(() => {
     if (inline) return null;
     const elements = [];
     let processedContent = content;
@@ -7262,7 +7396,7 @@ var MarkdownRenderer = ({
 };
 
 // src/react/components/ProjectSelector.tsx
-import { useState as useState8, useRef as useRef6, useEffect as useEffect5 } from "react";
+import { useState as useState8, useRef as useRef8, useEffect as useEffect5 } from "react";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 var ProjectSelector = ({
   projects,
@@ -7272,7 +7406,7 @@ var ProjectSelector = ({
   onProjectSettings
 }) => {
   const [isOpen, setIsOpen] = useState8(false);
-  const dropdownRef = useRef6(null);
+  const dropdownRef = useRef8(null);
   const currentProject = projects.find((p) => p.id === currentProjectId);
   useEffect5(() => {
     const handleClickOutside = (e) => {
@@ -7510,7 +7644,7 @@ var ChatSidebar = ({
   const sidebarWidth = typeof widthProp === "number" ? `${widthProp}px` : widthProp || "288px";
   const [editingId, setEditingId] = useState9(null);
   const [editingTitle, setEditingTitle] = useState9("");
-  const inputRef = useRef7(null);
+  const inputRef = useRef9(null);
   useEffect6(() => {
     if (editingId && inputRef.current) {
       inputRef.current.focus();
@@ -8152,7 +8286,7 @@ var ChatHeader = ({
 };
 
 // src/react/components/ChatInput.tsx
-import React6, { useRef as useRef8, useEffect as useEffect7, useState as useState11 } from "react";
+import React6, { useRef as useRef10, useEffect as useEffect7, useState as useState11 } from "react";
 import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 var ChatInput = ({
   value,
@@ -8181,12 +8315,12 @@ var ChatInput = ({
   inline = false
 }) => {
   const [mainMenuOpen, setMainMenuOpen] = React6.useState(false);
-  const textareaRef = useRef8(null);
-  const fileInputRef = useRef8(null);
+  const textareaRef = useRef10(null);
+  const fileInputRef = useRef10(null);
   const [actionMenuOpen, setActionMenuOpen] = useState11(false);
   const [isDragOver, setIsDragOver] = useState11(false);
-  const mainMenuRef = useRef8(null);
-  const actionMenuRef = useRef8(null);
+  const mainMenuRef = useRef10(null);
+  const actionMenuRef = useRef10(null);
   useEffect7(() => {
     if (textareaRef.current) {
       textareaRef.current.style.height = "auto";
@@ -8915,7 +9049,7 @@ var iconButtonStyle = {
 };
 
 // src/react/components/MessageList.tsx
-import React14, { useRef as useRef10, useEffect as useEffect10, useCallback as useCallback11, useState as useState18 } from "react";
+import React14, { useRef as useRef12, useEffect as useEffect10, useCallback as useCallback13, useState as useState18 } from "react";
 
 // src/react/components/MessageBubble.tsx
 import { useState as useState17 } from "react";
@@ -9204,7 +9338,7 @@ var DeepResearchProgressUI = ({ progress }) => {
 };
 
 // src/react/components/PollCard.tsx
-import { useState as useState12, useCallback as useCallback7, useEffect as useEffect8 } from "react";
+import { useState as useState12, useCallback as useCallback9, useEffect as useEffect8 } from "react";
 import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 var renderInlineMarkdown = (text) => {
   const parts = [];
@@ -9248,7 +9382,7 @@ var PollCard = ({
   const [otherTexts, setOtherTexts] = useState12({});
   const [otherSelected, setOtherSelected] = useState12({});
   const currentQuestion = questions[activeTab];
-  const handleOptionToggle = useCallback7(
+  const handleOptionToggle = useCallback9(
     (questionId, optionId, multiSelect) => {
       setSelections((prev) => {
         const current = prev[questionId] || /* @__PURE__ */ new Set();
@@ -9270,7 +9404,7 @@ var PollCard = ({
     },
     []
   );
-  const handleOtherToggle = useCallback7((questionId, multiSelect) => {
+  const handleOtherToggle = useCallback9((questionId, multiSelect) => {
     if (multiSelect) {
       setOtherSelected((prev) => ({ ...prev, [questionId]: !prev[questionId] }));
     } else {
@@ -9278,7 +9412,7 @@ var PollCard = ({
       setOtherSelected((prev) => ({ ...prev, [questionId]: true }));
     }
   }, []);
-  const handleSubmit = useCallback7(() => {
+  const handleSubmit = useCallback9(() => {
     const responses = questions.map((q) => {
       const selected = selections[q.id] || /* @__PURE__ */ new Set();
       const other = otherSelected[q.id] && otherTexts[q.id]?.trim();
@@ -9291,7 +9425,7 @@ var PollCard = ({
     });
     onSubmit(responses);
   }, [questions, selections, otherSelected, otherTexts, onSubmit]);
-  const handleSkip = useCallback7(() => {
+  const handleSkip = useCallback9(() => {
     const responses = questions.map((q) => ({
       questionId: q.id,
       selectedOptions: [],
@@ -9339,7 +9473,7 @@ var PollCard = ({
     }
     return () => timers.forEach(clearTimeout);
   }, [activeTab, currentQuestion.options.length]);
-  const handleNext = useCallback7(() => {
+  const handleNext = useCallback9(() => {
     if (!isLastTab) {
       setActiveTab((prev) => prev + 1);
     } else {
@@ -9757,7 +9891,7 @@ var SkillProgressUI = ({
 };
 
 // src/react/components/ImageContentCard.tsx
-import { useState as useState13, useCallback as useCallback8 } from "react";
+import { useState as useState13, useCallback as useCallback10 } from "react";
 import { Fragment as Fragment6, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 var ImageContentCard = ({ part }) => {
   const [isExpanded, setIsExpanded] = useState13(false);
@@ -9765,7 +9899,7 @@ var ImageContentCard = ({ part }) => {
   const [hasError, setHasError] = useState13(false);
   const [imgSrc, setImgSrc] = useState13(part.url);
   const onImageError = useImageError();
-  const handleImageError = useCallback8(async () => {
+  const handleImageError = useCallback10(async () => {
     if (onImageError) {
       const newUrl = await onImageError(imgSrc, part.fileName);
       if (newUrl) {
@@ -10142,7 +10276,7 @@ var ToolStatusCard = ({
 };
 
 // src/react/components/ArtifactCard.tsx
-import { useRef as useRef9, useEffect as useEffect9, useState as useState15, useCallback as useCallback9 } from "react";
+import { useRef as useRef11, useEffect as useEffect9, useState as useState15, useCallback as useCallback11 } from "react";
 import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 var getThemeStyles = () => {
   const root = document.documentElement;
@@ -10183,9 +10317,9 @@ var getAutoResizeScript = (id) => `
   });
 </script>`;
 var HtmlArtifact = ({ code }) => {
-  const iframeRef = useRef9(null);
+  const iframeRef = useRef11(null);
   const [height, setHeight] = useState15(200);
-  const artifactId = useRef9(`artifact-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`);
+  const artifactId = useRef11(`artifact-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`);
   useEffect9(() => {
     const id = artifactId.current;
     const handleMessage = (e) => {
@@ -10232,10 +10366,10 @@ var SvgArtifact = ({ code }) => {
   );
 };
 var MermaidArtifact = ({ code }) => {
-  const containerRef = useRef9(null);
+  const containerRef = useRef11(null);
   const [svgHtml, setSvgHtml] = useState15(null);
   const [error, setError] = useState15(null);
-  const renderMermaid = useCallback9(async () => {
+  const renderMermaid = useCallback11(async () => {
     try {
       let mermaid;
       try {
@@ -10494,7 +10628,7 @@ var ArtifactActions = ({ code, language, containerRef }) => {
   ] });
 };
 var ArtifactCard = ({ part, index = 0 }) => {
-  const contentRef = useRef9(null);
+  const contentRef = useRef11(null);
   return /* @__PURE__ */ jsxs13(
     "div",
     {
@@ -10666,7 +10800,7 @@ var ContentPartRenderer = ({
 };
 
 // src/react/components/ChecklistCard.tsx
-import { useState as useState16, useMemo as useMemo5 } from "react";
+import { useState as useState16, useMemo as useMemo6 } from "react";
 import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 var ChecklistCard = ({
   items,
@@ -10677,7 +10811,7 @@ var ChecklistCard = ({
   onStart
 }) => {
   const [expandedItems, setExpandedItems] = useState16(/* @__PURE__ */ new Set());
-  const { doneCount, isRunning, hasError, isWaiting } = useMemo5(() => {
+  const { doneCount, isRunning, hasError, isWaiting } = useMemo6(() => {
     const done = items.filter((it) => it.status === "done").length;
     const running = items.some((it) => it.status === "in_progress");
     const waiting = items.every((it) => it.status === "pending");
@@ -11927,12 +12061,12 @@ var MessageList = ({
   onExport,
   onToggleChecklistPanel
 }) => {
-  const messagesEndRef = useRef10(null);
-  const containerRef = useRef10(null);
+  const messagesEndRef = useRef12(null);
+  const containerRef = useRef12(null);
   const [selectedText, setSelectedText] = useState18("");
   const [selectionPosition, setSelectionPosition] = useState18(null);
   const [showScrollButton, setShowScrollButton] = useState18(false);
-  const userScrollLockRef = useRef10(false);
+  const userScrollLockRef = useRef12(false);
   const SCROLL_THRESHOLD = 100;
   useEffect10(() => {
     const container = containerRef.current;
@@ -11971,7 +12105,7 @@ var MessageList = ({
       container.removeEventListener("touchmove", handleTouchMove);
     };
   }, []);
-  const handleScroll = useCallback11(() => {
+  const handleScroll = useCallback13(() => {
     if (!containerRef.current) return;
     const { scrollTop, scrollHeight, clientHeight } = containerRef.current;
     const distanceFromBottom = scrollHeight - scrollTop - clientHeight;
@@ -11987,7 +12121,7 @@ var MessageList = ({
       behavior: "smooth"
     });
   }, [messages]);
-  const scrollToBottom = useCallback11(() => {
+  const scrollToBottom = useCallback13(() => {
     userScrollLockRef.current = false;
     setShowScrollButton(false);
     containerRef.current?.scrollTo({
@@ -11995,7 +12129,7 @@ var MessageList = ({
       behavior: "smooth"
     });
   }, []);
-  const handleMouseUp = useCallback11(() => {
+  const handleMouseUp = useCallback13(() => {
     const selection = typeof window !== "undefined" ? window.getSelection() : null;
     const text = selection?.toString().trim();
     if (text && text.length > 0) {
@@ -15266,13 +15400,13 @@ var ChatUI = (props) => {
 };
 
 // src/react/ChatFloatingWidget.tsx
-import { useState as useState28, useRef as useRef17, useEffect as useEffect19, useMemo as useMemo7, useCallback as useCallback16 } from "react";
+import { useState as useState28, useRef as useRef19, useEffect as useEffect19, useMemo as useMemo8, useCallback as useCallback18 } from "react";
 
 // src/react/hooks/useFloatingWidget.ts
-import { useState as useState22, useCallback as useCallback13, useEffect as useEffect14, useRef as useRef12 } from "react";
+import { useState as useState22, useCallback as useCallback15, useEffect as useEffect14, useRef as useRef14 } from "react";
 
 // src/react/hooks/useDragResize.ts
-import { useState as useState21, useRef as useRef11, useCallback as useCallback12, useEffect as useEffect13, useMemo as useMemo6 } from "react";
+import { useState as useState21, useRef as useRef13, useCallback as useCallback14, useEffect as useEffect13, useMemo as useMemo7 } from "react";
 var DRAG_THRESHOLD = 5;
 var FAB_SIZE = 56;
 var EDGE_MARGIN = 24;
@@ -15367,7 +15501,7 @@ var useDragResize = (options) => {
   }));
   const vw = viewport.width;
   const vh = viewport.height;
-  const initializedRef = useRef11(false);
+  const initializedRef = useRef13(false);
   useEffect13(() => {
     if (initializedRef.current || typeof window === "undefined") return;
     initializedRef.current = true;
@@ -15381,26 +15515,26 @@ var useDragResize = (options) => {
     setFabPos({ x: loaded.fabX, y: loaded.fabY });
     setPanelSize({ width: loaded.panelWidth, height: loaded.panelHeight });
   }, [initialPosition, storageKey, initialWidth, initialHeight]);
-  const dragStartRef = useRef11(null);
-  const isDraggingRef = useRef11(false);
-  const wasDragRef = useRef11(false);
-  const userDraggedRef = useRef11(false);
-  const dragDeltaRef = useRef11({ dx: 0, dy: 0 });
-  const fabElRef = useRef11(null);
-  const dragCleanupRef = useRef11(null);
-  const snapTimerRef = useRef11(null);
-  const prevDragRef = useRef11(null);
-  const shakeScoreRef = useRef11(0);
-  const prevVelocityRef = useRef11(null);
-  const isDizzyRef = useRef11(false);
-  const dizzyTimerRef = useRef11(null);
-  const lastVelocityRef = useRef11({ vx: 0, vy: 0, speed: 0 });
-  const dragRafRef = useRef11(null);
-  const animCleanupRef = useRef11(null);
-  const snapEnabledRef = useRef11(snapEnabled);
-  const storageKeyRef = useRef11(storageKey);
-  const panelSizeRef = useRef11(panelSize);
-  const fabPosRef = useRef11(fabPos);
+  const dragStartRef = useRef13(null);
+  const isDraggingRef = useRef13(false);
+  const wasDragRef = useRef13(false);
+  const userDraggedRef = useRef13(false);
+  const dragDeltaRef = useRef13({ dx: 0, dy: 0 });
+  const fabElRef = useRef13(null);
+  const dragCleanupRef = useRef13(null);
+  const snapTimerRef = useRef13(null);
+  const prevDragRef = useRef13(null);
+  const shakeScoreRef = useRef13(0);
+  const prevVelocityRef = useRef13(null);
+  const isDizzyRef = useRef13(false);
+  const dizzyTimerRef = useRef13(null);
+  const lastVelocityRef = useRef13({ vx: 0, vy: 0, speed: 0 });
+  const dragRafRef = useRef13(null);
+  const animCleanupRef = useRef13(null);
+  const snapEnabledRef = useRef13(snapEnabled);
+  const storageKeyRef = useRef13(storageKey);
+  const panelSizeRef = useRef13(panelSize);
+  const fabPosRef = useRef13(fabPos);
   useEffect13(() => {
     snapEnabledRef.current = snapEnabled;
   }, [snapEnabled]);
@@ -15413,7 +15547,7 @@ var useDragResize = (options) => {
   useEffect13(() => {
     fabPosRef.current = fabPos;
   }, [fabPos]);
-  const resizeStartRef = useRef11(null);
+  const resizeStartRef = useRef13(null);
   useEffect13(() => {
     return () => {
       dragCleanupRef.current?.();
@@ -15422,7 +15556,7 @@ var useDragResize = (options) => {
       if (dragRafRef.current) cancelAnimationFrame(dragRafRef.current);
     };
   }, []);
-  const handleFabPointerDown = useCallback12((e) => {
+  const handleFabPointerDown = useCallback14((e) => {
     if (disabled || isMobile) return;
     dragCleanupRef.current?.();
     const el = e.currentTarget;
@@ -15604,7 +15738,7 @@ var useDragResize = (options) => {
   }, [disabled, isMobile]);
   const fabCenterX = fabPos.x + FAB_SIZE / 2;
   const panelDirection = fabCenterX > vw / 2 ? "left" : "right";
-  const panelPositionStyle = useMemo6(() => {
+  const panelPositionStyle = useMemo7(() => {
     if (isMobile || disabled) return {};
     const fabIsTop = fabPos.y < vh / 2;
     let panelBottom;
@@ -15636,7 +15770,7 @@ var useDragResize = (options) => {
       borderRadius: "var(--floating-panel-radius, 16px)"
     };
   }, [isMobile, disabled, fabPos.x, fabPos.y, panelSize.width, panelSize.height, vw, vh, panelDirection, minHeight]);
-  const handleResizePointerDown = useCallback12((edge, e) => {
+  const handleResizePointerDown = useCallback14((edge, e) => {
     if (disabled || isMobile) return;
     e.preventDefault();
     e.stopPropagation();
@@ -15652,7 +15786,7 @@ var useDragResize = (options) => {
     };
     setIsResizing(true);
   }, [disabled, isMobile]);
-  const handleResizePointerMove = useCallback12((e) => {
+  const handleResizePointerMove = useCallback14((e) => {
     if (!resizeStartRef.current) return;
     const { startX, startY, width, height, edge, fabY } = resizeStartRef.current;
     const dx = e.clientX - startX;
@@ -15676,7 +15810,7 @@ var useDragResize = (options) => {
     newHeight = Math.max(minHeight, Math.min(maxH, newHeight));
     setPanelSize({ width: newWidth, height: newHeight });
   }, [minWidth, maxWidth, minHeight]);
-  const handleResizePointerUp = useCallback12((e) => {
+  const handleResizePointerUp = useCallback14((e) => {
     if (!resizeStartRef.current) return;
     e.currentTarget.releasePointerCapture(e.pointerId);
     resizeStartRef.current = null;
@@ -15749,7 +15883,7 @@ var useFloatingWidget = (options) => {
   } = options || {};
   const [isOpen, setIsOpen] = useState22(defaultOpen);
   const [activeTab, setActiveTab] = useState22(defaultTab);
-  const panelRef = useRef12(null);
+  const panelRef = useRef14(null);
   const dragResize = useDragResize({
     initialPosition: position,
     initialWidth: width,
@@ -15761,9 +15895,9 @@ var useFloatingWidget = (options) => {
     maxWidth,
     minHeight
   });
-  const onOpenRef = useRef12(onOpen);
-  const onCloseRef = useRef12(onClose);
-  const onTabChangeRef = useRef12(onTabChange);
+  const onOpenRef = useRef14(onOpen);
+  const onCloseRef = useRef14(onClose);
+  const onTabChangeRef = useRef14(onTabChange);
   useEffect14(() => {
     onOpenRef.current = onOpen;
   }, [onOpen]);
@@ -15773,15 +15907,15 @@ var useFloatingWidget = (options) => {
   useEffect14(() => {
     onTabChangeRef.current = onTabChange;
   }, [onTabChange]);
-  const open = useCallback13(() => {
+  const open = useCallback15(() => {
     setIsOpen(true);
     onOpenRef.current?.();
   }, []);
-  const close = useCallback13(() => {
+  const close = useCallback15(() => {
     setIsOpen(false);
     onCloseRef.current?.();
   }, []);
-  const toggle = useCallback13(() => {
+  const toggle = useCallback15(() => {
     setIsOpen((prev) => {
       const next = !prev;
       if (next) onOpenRef.current?.();
@@ -15789,11 +15923,11 @@ var useFloatingWidget = (options) => {
       return next;
     });
   }, []);
-  const setTab = useCallback13((tabKey) => {
+  const setTab = useCallback15((tabKey) => {
     setActiveTab(tabKey);
     onTabChangeRef.current?.(tabKey);
   }, []);
-  const handleFabInteraction = useCallback13(() => {
+  const handleFabInteraction = useCallback15(() => {
     if (dragResize.isDragging) return;
     toggle();
   }, [dragResize.isDragging, toggle]);
@@ -15823,10 +15957,10 @@ var useFloatingWidget = (options) => {
 };
 
 // src/react/components/floating/FloatingFab.tsx
-import { useRef as useRef14, useState as useState24, useEffect as useEffect16 } from "react";
+import { useRef as useRef16, useState as useState24, useEffect as useEffect16 } from "react";
 
 // src/react/components/floating/DevDiveCharacter.tsx
-import { useState as useState23, useEffect as useEffect15, useRef as useRef13, useCallback as useCallback14 } from "react";
+import { useState as useState23, useEffect as useEffect15, useRef as useRef15, useCallback as useCallback16 } from "react";
 import { Fragment as Fragment10, jsx as jsx24, jsxs as jsxs23 } from "react/jsx-runtime";
 var THEMES = {
   dark: { body: "#2ecc71", stroke: "#27ae60", highlight: "#3ddc84", face: "#1a1a2e", eyeLight: "#fff" },
@@ -15857,11 +15991,11 @@ var DevDiveFabCharacter = ({
   const [isWinking, setIsWinking] = useState23(false);
   const [isCatMouth, setIsCatMouth] = useState23(false);
   const [isEntering, setIsEntering] = useState23(true);
-  const svgRef = useRef13(null);
-  const cleanupRef = useRef13(null);
-  const lastActivityRef = useRef13(Date.now());
-  const isSleepyRef = useRef13(false);
-  const markActivity = useCallback14(() => {
+  const svgRef = useRef15(null);
+  const cleanupRef = useRef15(null);
+  const lastActivityRef = useRef15(Date.now());
+  const isSleepyRef = useRef15(false);
+  const markActivity = useCallback16(() => {
     lastActivityRef.current = Date.now();
     if (isSleepyRef.current) {
       isSleepyRef.current = false;
@@ -15981,7 +16115,7 @@ var DevDiveFabCharacter = ({
     }, 5e3);
     return () => clearInterval(check);
   }, [isOpen, isTalking, isDizzy]);
-  const prevCompleteRef = useRef13(false);
+  const prevCompleteRef = useRef15(false);
   useEffect15(() => {
     const wasComplete = prevCompleteRef.current;
     prevCompleteRef.current = isComplete;
@@ -16182,7 +16316,7 @@ var FloatingFab = ({
 }) => {
   const isRight = position.includes("right");
   const isBottom = position.includes("bottom");
-  const fabRef = useRef14(null);
+  const fabRef = useRef16(null);
   const isCharacterMode = !icon;
   const [bubbleOnRight, setBubbleOnRight] = useState24(!isRight);
   const posLeft = positionStyle?.left;
@@ -16197,11 +16331,11 @@ var FloatingFab = ({
   }, [isRight, posLeft, posTop]);
   const [bubbleText, setBubbleText] = useState24(null);
   const [bubbleExiting, setBubbleExiting] = useState24(false);
-  const bubbleTextRef = useRef14(bubbleText);
+  const bubbleTextRef = useRef16(bubbleText);
   bubbleTextRef.current = bubbleText;
   const [displayText, setDisplayText] = useState24(null);
   const [isTyping, setIsTyping] = useState24(false);
-  const typingTimerRef = useRef14(null);
+  const typingTimerRef = useRef16(null);
   useEffect16(() => {
     if (notification) {
       setBubbleText(notification);
@@ -16238,7 +16372,7 @@ var FloatingFab = ({
     }, 300);
     return () => clearTimeout(timer);
   }, [notification]);
-  const notifContentRef = useRef14(null);
+  const notifContentRef = useRef16(null);
   const [needsMarquee, setNeedsMarquee] = useState24(false);
   useEffect16(() => {
     if (isTyping || !notification) {
@@ -16382,7 +16516,7 @@ var FloatingFab = ({
 };
 
 // src/react/components/floating/FloatingPanel.tsx
-import { useState as useState25, useEffect as useEffect17, useRef as useRef15 } from "react";
+import { useState as useState25, useEffect as useEffect17, useRef as useRef17 } from "react";
 import { jsxs as jsxs25 } from "react/jsx-runtime";
 var FloatingPanel = ({
   isOpen,
@@ -16411,7 +16545,7 @@ var FloatingPanel = ({
   }, []);
   const [shouldRender, setShouldRender] = useState25(isOpen);
   const [isVisible, setIsVisible] = useState25(isOpen);
-  const rafRef = useRef15(0);
+  const rafRef = useRef17(0);
   useEffect17(() => {
     if (isOpen) {
       setShouldRender(true);
@@ -16588,10 +16722,10 @@ var FloatingTabBar = ({
 };
 
 // src/react/components/floating/CompactChatView.tsx
-import { useState as useState27, useCallback as useCallback15 } from "react";
+import { useState as useState27, useCallback as useCallback17 } from "react";
 
 // src/react/components/floating/CompactSessionMenu.tsx
-import { useState as useState26, useRef as useRef16, useEffect as useEffect18 } from "react";
+import { useState as useState26, useRef as useRef18, useEffect as useEffect18 } from "react";
 import { jsx as jsx27, jsxs as jsxs27 } from "react/jsx-runtime";
 var CompactSessionMenu = ({
   sessions,
@@ -16603,9 +16737,9 @@ var CompactSessionMenu = ({
   onClose,
   isLoading = false
 }) => {
-  const menuRef = useRef16(null);
-  const inputRef = useRef16(null);
-  const onCloseRef = useRef16(onClose);
+  const menuRef = useRef18(null);
+  const inputRef = useRef18(null);
+  const onCloseRef = useRef18(onClose);
   onCloseRef.current = onClose;
   const [editingId, setEditingId] = useState26(null);
   const [editingTitle, setEditingTitle] = useState26("");
@@ -16934,15 +17068,15 @@ var CompactChatView = ({
     setInput(choice.text);
   };
   const [showSessionMenu, setShowSessionMenu] = useState27(false);
-  const handleSessionSelect = useCallback15((id) => {
+  const handleSessionSelect = useCallback17((id) => {
     selectSession(id);
     setShowSessionMenu(false);
   }, [selectSession]);
-  const handleNewSession = useCallback15(() => {
+  const handleNewSession = useCallback17(() => {
     newSession();
     setShowSessionMenu(false);
   }, [newSession]);
-  const handleCloseMenu = useCallback15(() => {
+  const handleCloseMenu = useCallback17(() => {
     setShowSessionMenu(false);
   }, []);
   const greeting = personalization?.userProfile?.nickname ? `${personalization.userProfile.nickname}\uB2D8, \uBB34\uC5C7\uC774\uB4E0 \uBB3C\uC5B4\uBCF4\uC138\uC694` : "\uBB34\uC5C7\uC774\uB4E0 \uBB3C\uC5B4\uBCF4\uC138\uC694";
@@ -17262,11 +17396,11 @@ var ChatFloatingWidget = ({
     maxWidth,
     minHeight
   });
-  const notifObj = useMemo7(() => {
+  const notifObj = useMemo8(() => {
     if (!notification) return null;
     return typeof notification === "string" ? { text: notification } : notification;
   }, [notification]);
-  const handleFabClick = useCallback16(() => {
+  const handleFabClick = useCallback18(() => {
     if (notifObj?.onClick) {
       notifObj.onClick();
       if (!isOpen) handleFabInteraction();
@@ -17280,7 +17414,7 @@ var ChatFloatingWidget = ({
     }
     handleFabInteraction();
   }, [notifObj, isOpen, handleFabInteraction, setTab, tabs]);
-  const allTabs = useMemo7(() => {
+  const allTabs = useMemo8(() => {
     const chatTab = {
       key: "chat",
       label: "\uCC44\uD305",
@@ -17295,7 +17429,7 @@ var ChatFloatingWidget = ({
     return [chatTab, ...customTabs];
   }, [tabs]);
   const [unreadBadge, setUnreadBadge] = useState28(0);
-  const seenMessageIdsRef = useRef17(/* @__PURE__ */ new Set());
+  const seenMessageIdsRef = useRef19(/* @__PURE__ */ new Set());
   useEffect19(() => {
     if (seenMessageIdsRef.current.size === 0 && chatState.messages.length > 0) {
       for (const m of chatState.messages) {
@@ -17328,11 +17462,11 @@ var ChatFloatingWidget = ({
       }
     }
   }, [isOpen, chatState.messages]);
-  const totalBadge = useMemo7(() => {
+  const totalBadge = useMemo8(() => {
     return tabs.reduce((sum, t) => sum + (t.badge || 0), 0) + unreadBadge;
   }, [tabs, unreadBadge]);
-  const isTalking = useMemo7(() => !!notification || chatState.isLoading, [notification, chatState.isLoading]);
-  const prevLoadingRef = useRef17(chatState.isLoading);
+  const isTalking = useMemo8(() => !!notification || chatState.isLoading, [notification, chatState.isLoading]);
+  const prevLoadingRef = useRef19(chatState.isLoading);
   const [isComplete, setIsComplete] = useState28(false);
   useEffect19(() => {
     const wasLoading = prevLoadingRef.current;
@@ -17450,7 +17584,7 @@ var ChatFloatingWidget = ({
 };
 
 // src/react/hooks/useDeepResearch.ts
-import { useState as useState29, useCallback as useCallback17, useRef as useRef18 } from "react";
+import { useState as useState29, useCallback as useCallback19, useRef as useRef20 } from "react";
 var REPORT_GENERATION_PROMPT2 = `\uB2F9\uC2E0\uC740 \uB9AC\uC11C\uCE58 \uBCF4\uACE0\uC11C \uC791\uC131 \uC804\uBB38\uAC00\uC785\uB2C8\uB2E4.
 
 <collected_sources>
@@ -17503,8 +17637,8 @@ var useDeepResearch = (options) => {
   const { onWebSearch, onExtractContent, apiEndpoint, apiKey, model, provider } = options;
   const [isResearching, setIsResearching] = useState29(false);
   const [progress, setProgress] = useState29(null);
-  const abortControllerRef = useRef18(null);
-  const callLLM2 = useCallback17(
+  const abortControllerRef = useRef20(null);
+  const callLLM2 = useCallback19(
     async (prompt, stream = false) => {
       const response = await fetch(apiEndpoint, {
         method: "POST",
@@ -17531,7 +17665,7 @@ var useDeepResearch = (options) => {
     },
     [apiEndpoint, apiKey, model, provider]
   );
-  const analyzeQuery2 = useCallback17(
+  const analyzeQuery2 = useCallback19(
     async (query) => {
       const prompt = QUERY_ANALYSIS_PROMPT2.replace("{question}", query);
       const response = await callLLM2(prompt);
@@ -17550,7 +17684,7 @@ var useDeepResearch = (options) => {
     },
     [callLLM2]
   );
-  const runSubAgent2 = useCallback17(
+  const runSubAgent2 = useCallback19(
     async (topic, queries, agentId, updateProgress) => {
       updateProgress({ status: "searching", searchCount: 0, resultsCount: 0 });
       const allResults = [];
@@ -17589,7 +17723,7 @@ var useDeepResearch = (options) => {
     },
     [onWebSearch, onExtractContent]
   );
-  const generateReport2 = useCallback17(
+  const generateReport2 = useCallback19(
     async (query, results, onStreamContent) => {
       const allSources = [];
       const sourcesForPrompt = [];
@@ -17647,7 +17781,7 @@ var useDeepResearch = (options) => {
     },
     [callLLM2]
   );
-  const runDeepResearch = useCallback17(
+  const runDeepResearch = useCallback19(
     async (query, onStreamContent) => {
       abortControllerRef.current = new AbortController();
       setIsResearching(true);
@@ -17750,7 +17884,7 @@ var useDeepResearch = (options) => {
     },
     [analyzeQuery2, runSubAgent2, generateReport2]
   );
-  const stopResearch = useCallback17(() => {
+  const stopResearch = useCallback19(() => {
     abortControllerRef.current?.abort();
     setIsResearching(false);
     setProgress(null);
@@ -17763,6 +17897,122 @@ var useDeepResearch = (options) => {
   };
 };
 
+// src/react/hooks/useContentParsers.ts
+import { useCallback as useCallback20 } from "react";
+var useContentParsers = ({
+  sessionsRef,
+  setSessions
+}) => {
+  const applyPollParsing = useCallback20(
+    (sessionId, messageId, content, skipParsing) => {
+      const { pollBlock, cleanContent } = parsePollFromContent(content);
+      setSessions(
+        (prev) => prev.map((s) => {
+          if (s.id !== sessionId) return s;
+          return {
+            ...s,
+            messages: s.messages.map((m) => {
+              if (m.id !== messageId) return m;
+              if (skipParsing) {
+                return { ...m, content: cleanContent };
+              }
+              if (pollBlock) {
+                return { ...m, content: cleanContent, pollBlock };
+              }
+              return m;
+            })
+          };
+        })
+      );
+      return skipParsing ? null : pollBlock;
+    },
+    [setSessions]
+  );
+  const applyChecklistParsing = useCallback20(
+    (sessionId, messageId, content, skipParsing) => {
+      if (skipParsing) return null;
+      const { checklistBlock, cleanContent } = parseChecklistFromContent(content);
+      if (!checklistBlock) return null;
+      setSessions(
+        (prev) => prev.map((s) => {
+          if (s.id !== sessionId) return s;
+          return {
+            ...s,
+            messages: s.messages.map((m) => {
+              if (m.id !== messageId) return m;
+              return { ...m, content: cleanContent, checklistBlock };
+            })
+          };
+        })
+      );
+      return checklistBlock;
+    },
+    [setSessions]
+  );
+  const applyArtifactParsing = useCallback20(
+    (sessionId, messageId, content) => {
+      if (!hasArtifactTag(content)) return false;
+      let found = false;
+      setSessions(
+        (prev) => prev.map((s) => {
+          if (s.id !== sessionId) return s;
+          return {
+            ...s,
+            messages: s.messages.map((m) => {
+              if (m.id !== messageId) return m;
+              const { artifacts, cleanContent } = parseArtifactsFromContent(m.content);
+              if (artifacts.length === 0) return m;
+              found = true;
+              const existingParts = m.contentParts || [];
+              const textPart = cleanContent.trim() ? [{ type: "text", content: cleanContent }] : [];
+              return {
+                ...m,
+                content: cleanContent,
+                contentParts: [
+                  ...textPart,
+                  ...existingParts.filter(
+                    (p) => p.type !== "text" && p.type !== "artifact"
+                  ),
+                  ...artifacts
+                ]
+              };
+            })
+          };
+        })
+      );
+      return found;
+    },
+    [setSessions]
+  );
+  const parseContextReferences = useCallback20(
+    (content, sessionContext) => {
+      const { refs, cleanContent } = parseContextRefs(content);
+      if (refs.length === 0 || !sessionContext) {
+        return { refs, cleanContent, refContents: null };
+      }
+      const assembled = refs.map((refId) => {
+        const item = sessionContext.references.find(
+          (r) => r.id === refId
+        );
+        return item ? `[${item.label || item.skillName}]
+${item.summary}` : null;
+      }).filter(Boolean).join("\n\n");
+      return {
+        refs,
+        cleanContent,
+        refContents: assembled || null
+      };
+    },
+    []
+  );
+  return {
+    applyPollParsing,
+    applyChecklistParsing,
+    applyArtifactParsing,
+    parseContextReferences
+  };
+};
+
 // src/react/utils/conversationSearchAdapter.ts
 var formatSearchResults = (results) => {
   if (results.length === 0) {
@@ -18290,8 +18540,52 @@ var MemoryPanel = ({
     }
   );
 };
+
+// src/react/utils/retry.ts
+var DEFAULT_RETRY_CONFIG = {
+  maxRetries: 3,
+  initialDelayMs: 1e3,
+  maxDelayMs: 3e4,
+  backoffMultiplier: 2
+};
+var calculateDelay = (attempt, config) => {
+  const exponential = config.initialDelayMs * Math.pow(config.backoffMultiplier, attempt);
+  const capped = Math.min(exponential, config.maxDelayMs);
+  const jitter = 0.5 + Math.random() * 0.5;
+  return Math.floor(capped * jitter);
+};
+var sleep = (ms, signal) => new Promise((resolve, reject) => {
+  if (signal?.aborted) {
+    reject(signal.reason ?? new DOMException("Aborted", "AbortError"));
+    return;
+  }
+  const timer = setTimeout(resolve, ms);
+  signal?.addEventListener("abort", () => {
+    clearTimeout(timer);
+    reject(signal.reason ?? new DOMException("Aborted", "AbortError"));
+  }, { once: true });
+});
+var withRetry = async (fn, config, signal) => {
+  const merged = { ...DEFAULT_RETRY_CONFIG, ...config };
+  let lastError;
+  for (let attempt = 0; attempt <= merged.maxRetries; attempt++) {
+    try {
+      return await fn();
+    } catch (error) {
+      lastError = error;
+      if (error instanceof DOMException && error.name === "AbortError") throw error;
+      if (error instanceof Error && error.name === "AbortError") throw error;
+      if (signal?.aborted) throw error;
+      if (attempt >= merged.maxRetries) throw error;
+      if (error instanceof ChatError && !error.retryable) throw error;
+      await sleep(calculateDelay(attempt, merged), signal);
+    }
+  }
+  throw lastError;
+};
 export {
   ArtifactCard,
+  ChatError,
   ChatFloatingWidget,
   ChatHeader,
   ChatInput,
@@ -18304,6 +18598,7 @@ export {
   ContentPartRenderer,
   DEFAULT_PROJECT_ID,
   DEFAULT_PROJECT_TITLE,
+  DEFAULT_RETRY_CONFIG,
   DeepResearchProgressUI,
   DevDiveAvatar,
   DevDiveFabCharacter,
@@ -18327,20 +18622,28 @@ export {
   ResizeHandles,
   SettingsModal,
   SkillProgressUI,
+  classifyFetchError,
   convertSkillsToOpenAITools,
   convertToolsToSkills,
   createAdvancedResearchSkill,
   createConversationSearchSkill,
   createDeepResearchSkill,
+  createTimeoutError,
   migrateSessionsToProjects,
+  parseSSELine,
+  parseSSEResponse,
   useChatUI,
+  useChecklist,
+  useContentParsers,
   useDeepResearch,
   useDragResize,
   useFloatingWidget,
   useImageError,
   useObserver,
   useProject,
-  useSkills
+  useSkills,
+  useStreamingFetch,
+  withRetry
 };
 /**
  * @description localStorage 기반 메모리 저장소 어댑터