@gendive/chatllm 0.16.1 → 0.17.1

package/dist/react/index.mjs

@@ -1133,7 +1133,7 @@ var useProject = (options) => {
   const currentProject = projects.find((p) => p.id === currentProjectId) || null;
   useEffect2(() => {
     if (!enabled || useExternalStorage || !initializedRef.current) return;
-    if (projects.length > 0) {
+    if (projects.length > 0 && typeof window !== "undefined") {
       localStorage.setItem(storageKey, JSON.stringify(projects));
     }
   }, [enabled, projects, storageKey, useExternalStorage]);
@@ -1167,7 +1167,7 @@ var useProject = (options) => {
         }
       } else {
         try {
-          const saved = localStorage.getItem(storageKey);
+          const saved = typeof window !== "undefined" ? localStorage.getItem(storageKey) : null;
           if (saved) {
             const parsed = JSON.parse(saved);
             if (!parsed.find((p) => p.id === DEFAULT_PROJECT_ID)) {
@@ -1469,9 +1469,12 @@ var convertToolsToSkills = (tools, onToolCall) => {
   for (const tool of tools) {
     skillMap[tool.name] = {
       description: tool.description,
-      trigger: "both",
+      /** @Todo vibecode - tool.trigger 지원 (기본 'both', 'attachment' 가능) */
+      trigger: tool.trigger || "both",
       label: tool.label || tool.name,
       icon: tool.icon,
+      acceptedTypes: tool.acceptedTypes,
+      autoConvertBase64: tool.autoConvertBase64,
       parameters: {
         type: "object",
         properties: Object.fromEntries(
@@ -1545,6 +1548,20 @@ var DEFAULT_KEEP_RECENT = 6;
 var DEFAULT_RECOMPRESSION_THRESHOLD = 10;
 var DEFAULT_TOKEN_LIMIT = 8e3;
 var generateId3 = (prefix) => `${prefix}_${Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
+var fileToBase64 = (file) => new Promise((resolve, reject) => {
+  const reader = new FileReader();
+  reader.onload = () => resolve(reader.result.split(",")[1] || "");
+  reader.onerror = reject;
+  reader.readAsDataURL(file);
+});
+var convertAttachmentsToBase64 = async (attachments) => Promise.all(
+  attachments.map(async (att) => ({
+    name: att.name,
+    mimeType: att.mimeType,
+    base64: await fileToBase64(att.file),
+    size: att.size
+  }))
+);
 var generateTitle = (messages) => {
   const firstUserMessage = messages.find((m) => m.role === "user");
   if (!firstUserMessage) return "\uC0C8 \uB300\uD654";
@@ -1596,7 +1613,12 @@ var useChatUI = (options) => {
     onUpdateProject,
     onDeleteProject,
     onAddProjectFile,
-    onDeleteProjectFile
+    onDeleteProjectFile,
+    // Stream control
+    continueAfterToolResult = true,
+    onSkillComplete,
+    // Dynamic model loading
+    onLoadModels
   } = options;
   const enableAutoExtraction = enableAutoExtractionProp ?? !useExternalStorage;
   const [sessions, setSessions] = useState5([]);
@@ -1620,6 +1642,8 @@ var useChatUI = (options) => {
   const [isSessionLoading, setIsSessionLoading] = useState5(false);
   const [isDeepResearchMode, setIsDeepResearchMode] = useState5(false);
   const [attachments, setAttachments] = useState5([]);
+  const [isModelsLoading, setIsModelsLoading] = useState5(false);
+  const [loadedModels, setLoadedModels] = useState5(null);
   const [deepResearchProgress, setDeepResearchProgress] = useState5(
     null
   );
@@ -1627,6 +1651,40 @@ var useChatUI = (options) => {
   useEffect3(() => {
     sessionsRef.current = sessions;
   }, [sessions]);
+  const onSendMessageRef = useRef4(onSendMessage);
+  const onSessionChangeRef = useRef4(onSessionChange);
+  const onErrorRef = useRef4(onError);
+  const onTitleChangeRef = useRef4(onTitleChange);
+  const generateTitleRef = useRef4(generateTitleCallback);
+  const onPersonalizationChangeRef = useRef4(options.onPersonalizationChange);
+  const onPersonalizationSaveRef = useRef4(options.onPersonalizationSave);
+  const onLoadSessionsRef = useRef4(onLoadSessions);
+  const onCreateSessionRef = useRef4(onCreateSession);
+  const onLoadSessionRef = useRef4(onLoadSession);
+  const onDeleteSessionCallbackRef = useRef4(onDeleteSessionCallback);
+  const onUpdateSessionTitleRef = useRef4(onUpdateSessionTitle);
+  const onSaveMessagesRef = useRef4(onSaveMessages);
+  const onToolCallRef = useRef4(onToolCall);
+  const onSkillCompleteRef = useRef4(onSkillComplete);
+  const onLoadModelsRef = useRef4(onLoadModels);
+  useEffect3(() => {
+    onSendMessageRef.current = onSendMessage;
+    onSessionChangeRef.current = onSessionChange;
+    onErrorRef.current = onError;
+    onTitleChangeRef.current = onTitleChange;
+    generateTitleRef.current = generateTitleCallback;
+    onPersonalizationChangeRef.current = options.onPersonalizationChange;
+    onPersonalizationSaveRef.current = options.onPersonalizationSave;
+    onLoadSessionsRef.current = onLoadSessions;
+    onCreateSessionRef.current = onCreateSession;
+    onLoadSessionRef.current = onLoadSession;
+    onDeleteSessionCallbackRef.current = onDeleteSessionCallback;
+    onUpdateSessionTitleRef.current = onUpdateSessionTitle;
+    onSaveMessagesRef.current = onSaveMessages;
+    onToolCallRef.current = onToolCall;
+    onSkillCompleteRef.current = onSkillComplete;
+    onLoadModelsRef.current = onLoadModels;
+  });
   const abortControllerRef = useRef4(null);
   const skipNextPollParsingRef = useRef4(false);
   const skipNextSkillParsingRef = useRef4(false);
@@ -1642,11 +1700,15 @@ var useChatUI = (options) => {
     [globalMemoryConfig, storageKey]
   );
   const globalMemory = useGlobalMemoryEnabled ? useGlobalMemory(memoryOptions) : null;
+  const stableToolCall = useCallback5(
+    (name, params) => onToolCallRef.current(name, params),
+    []
+  );
   const mergedSkills = useMemo2(() => {
     if (!tools || !onToolCall) return skills || {};
-    const toolSkills = convertToolsToSkills(tools, onToolCall);
+    const toolSkills = convertToolsToSkills(tools, stableToolCall);
     return { ...skills || {}, ...toolSkills };
-  }, [skills, tools, onToolCall]);
+  }, [skills, tools, !!onToolCall, stableToolCall]);
   const {
     buildSkillsPrompt,
     handleSkillCall,
@@ -1700,9 +1762,9 @@ var useChatUI = (options) => {
   }, [sessions, enableProjects, projectHook.currentProjectId]);
   useEffect3(() => {
     if (typeof window === "undefined") return;
-    if (useExternalStorage && onLoadSessions) {
+    if (useExternalStorage && onLoadSessionsRef.current) {
       setIsSessionsLoading(true);
-      onLoadSessions().then((sessionList) => {
+      onLoadSessionsRef.current().then((sessionList) => {
         const sessionsWithoutMessages = sessionList.map((s) => ({
           id: s.id,
           title: s.title,
@@ -1718,15 +1780,17 @@ var useChatUI = (options) => {
           setCurrentSessionId(targetId);
         }
       }).catch((error) => {
-        onError?.(error instanceof Error ? error : new Error("Failed to load sessions"));
+        onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to load sessions"));
       }).finally(() => {
         setIsSessionsLoading(false);
       });
-      const savedPersonalization2 = localStorage.getItem(`${storageKey}_personalization`);
-      if (savedPersonalization2) {
-        try {
-          setPersonalization(JSON.parse(savedPersonalization2));
-        } catch {
+      if (typeof window !== "undefined") {
+        const savedPersonalization2 = localStorage.getItem(`${storageKey}_personalization`);
+        if (savedPersonalization2) {
+          try {
+            setPersonalization(JSON.parse(savedPersonalization2));
+          } catch {
+          }
         }
       }
       return;
@@ -1734,6 +1798,7 @@ var useChatUI = (options) => {
     if (enableProjects) {
       migrateSessionsToProjects(storageKey);
     }
+    if (typeof window === "undefined") return;
     const saved = localStorage.getItem(storageKey);
     if (saved) {
       try {
@@ -1755,7 +1820,22 @@ var useChatUI = (options) => {
       } catch {
       }
     }
-  }, [storageKey, useExternalStorage, onLoadSessions, initialModel, models, onError]);
+  }, [storageKey, useExternalStorage, initialModel, models]);
+  useEffect3(() => {
+    if (!onLoadModelsRef.current) return;
+    setIsModelsLoading(true);
+    onLoadModelsRef.current().then((modelList) => {
+      setLoadedModels(modelList);
+      if (modelList.length > 0 && !modelList.find((m) => m.id === selectedModel)) {
+        setSelectedModel(modelList[0].id);
+      }
+    }).catch((error) => {
+      onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to load models"));
+    }).finally(() => {
+      setIsModelsLoading(false);
+    });
+  }, []);
+  const effectiveModels = loadedModels || models;
   useEffect3(() => {
     if (typeof window === "undefined") return;
     if (useExternalStorage) return;
@@ -1768,8 +1848,8 @@ var useChatUI = (options) => {
     localStorage.setItem(`${storageKey}_personalization`, JSON.stringify(personalization));
   }, [personalization, storageKey]);
   useEffect3(() => {
-    onSessionChange?.(currentSession);
-  }, [currentSession, onSessionChange]);
+    onSessionChangeRef.current?.(currentSession);
+  }, [currentSession]);
   const buildSystemPrompt = useCallback5(() => {
     const parts = [];
     const { userProfile, responseStyle, language } = personalization;
@@ -1975,10 +2055,10 @@ ${newConversation}
   }, []);
   const newSession = useCallback5(async () => {
     const projectId = enableProjects ? projectHook.currentProjectId || DEFAULT_PROJECT_ID : void 0;
-    if (useExternalStorage && onCreateSession) {
+    if (useExternalStorage && onCreateSessionRef.current) {
       setIsSessionLoading(true);
       try {
-        const created = await onCreateSession();
+        const created = await onCreateSessionRef.current();
         const now2 = Date.now();
         const newSess2 = {
           id: created.id,
@@ -1992,7 +2072,7 @@ ${newConversation}
         setSessions((prev) => [newSess2, ...prev]);
         setCurrentSessionId(newSess2.id);
       } catch (error) {
-        onError?.(error instanceof Error ? error : new Error("Failed to create session"));
+        onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to create session"));
       } finally {
         setIsSessionLoading(false);
       }
@@ -2010,12 +2090,12 @@ ${newConversation}
     };
     setSessions((prev) => [newSess, ...prev]);
     setCurrentSessionId(newSess.id);
-  }, [selectedModel, useExternalStorage, onCreateSession, onError, enableProjects, projectHook.currentProjectId]);
+  }, [selectedModel, useExternalStorage, enableProjects, projectHook.currentProjectId]);
   const selectSession = useCallback5(async (id) => {
-    if (useExternalStorage && onLoadSession) {
+    if (useExternalStorage && onLoadSessionRef.current) {
       setIsSessionLoading(true);
       try {
-        const sessionDetail = await onLoadSession(id);
+        const sessionDetail = await onLoadSessionRef.current(id);
         let loadedMessages = sessionDetail.messages.map((m, idx) => ({
           id: m.id || generateId3("msg"),
           role: typeof m.role === "string" ? m.role.toLowerCase() : m.role,
@@ -2061,7 +2141,7 @@ ${newConversation}
           setSelectedModel(existingSession.model);
         }
       } catch (error) {
-        onError?.(error instanceof Error ? error : new Error("Failed to load session"));
+        onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to load session"));
         const cached = readSessionCache(storageKey, id);
         if (cached && cached.messages.length > 0) {
           console.warn("[useChatUI] onLoadSession failed, using localStorage cache");
@@ -2086,11 +2166,11 @@ ${newConversation}
       setCurrentSessionId(id);
       setSelectedModel(session.model);
     }
-  }, [sessions, useExternalStorage, onLoadSession, onError, storageKey, initialModel, models]);
+  }, [sessions, useExternalStorage, storageKey, initialModel, models]);
   const deleteSession = useCallback5(async (id) => {
-    if (useExternalStorage && onDeleteSessionCallback) {
+    if (useExternalStorage && onDeleteSessionCallbackRef.current) {
       try {
-        await onDeleteSessionCallback(id);
+        await onDeleteSessionCallbackRef.current(id);
         removeSessionCache(storageKey, id);
         setSessions((prev) => {
           const filtered = prev.filter((s) => s.id !== id);
@@ -2100,7 +2180,7 @@ ${newConversation}
           return filtered;
         });
       } catch (error) {
-        onError?.(error instanceof Error ? error : new Error("Failed to delete session"));
+        onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to delete session"));
       }
       return;
     }
@@ -2114,20 +2194,20 @@ ${newConversation}
       }
       return filtered;
     });
-  }, [currentSessionId, storageKey, useExternalStorage, onDeleteSessionCallback, onError]);
+  }, [currentSessionId, storageKey, useExternalStorage]);
   const renameSession = useCallback5(async (id, newTitle) => {
     if (!newTitle.trim()) return;
-    if (useExternalStorage && onUpdateSessionTitle) {
+    if (useExternalStorage && onUpdateSessionTitleRef.current) {
       try {
-        await onUpdateSessionTitle(id, newTitle.trim());
+        await onUpdateSessionTitleRef.current(id, newTitle.trim());
         setSessions(
           (prev) => prev.map(
             (s) => s.id === id ? { ...s, title: newTitle.trim(), updatedAt: Date.now() } : s
           )
         );
-        onTitleChange?.(id, newTitle.trim());
+        onTitleChangeRef.current?.(id, newTitle.trim());
       } catch (error) {
-        onError?.(error instanceof Error ? error : new Error("Failed to update session title"));
+        onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to update session title"));
       }
       return;
     }
@@ -2136,8 +2216,8 @@ ${newConversation}
         (s) => s.id === id ? { ...s, title: newTitle.trim(), updatedAt: Date.now() } : s
       )
     );
-    onTitleChange?.(id, newTitle.trim());
-  }, [onTitleChange, useExternalStorage, onUpdateSessionTitle, onError]);
+    onTitleChangeRef.current?.(id, newTitle.trim());
+  }, [useExternalStorage]);
   const setModel = useCallback5((model) => {
     setSelectedModel(model);
     if (currentSessionId) {
@@ -2171,13 +2251,13 @@ ${newConversation}
   const updatePersonalization = useCallback5((config) => {
     setPersonalization((prev) => {
       const next = { ...prev, ...config };
-      options.onPersonalizationChange?.(next);
+      onPersonalizationChangeRef.current?.(next);
       return next;
     });
-  }, [options.onPersonalizationChange]);
+  }, []);
   const savePersonalization = useCallback5(() => {
-    options.onPersonalizationSave?.(personalization);
-  }, [options.onPersonalizationSave, personalization]);
+    onPersonalizationSaveRef.current?.(personalization);
+  }, [personalization]);
   const addAttachments = useCallback5((files) => {
     const newAttachments = files.map((file) => {
       const isImage = file.type.startsWith("image/");
@@ -2210,9 +2290,9 @@ ${newConversation}
     if (!messageContent.trim() || isLoading) return;
     let sessionId = currentSessionId;
     if (!sessionId) {
-      if (useExternalStorage && onCreateSession) {
+      if (useExternalStorage && onCreateSessionRef.current) {
         try {
-          const created = await onCreateSession();
+          const created = await onCreateSessionRef.current();
           const now = Date.now();
           const newSess = {
             id: created.id,
@@ -2226,7 +2306,7 @@ ${newConversation}
           sessionId = newSess.id;
           setCurrentSessionId(sessionId);
         } catch (error) {
-          onError?.(error instanceof Error ? error : new Error("Failed to create session"));
+          onErrorRef.current?.(error instanceof Error ? error : new Error("Failed to create session"));
           setIsLoading(false);
           return;
         }
@@ -2279,13 +2359,66 @@ ${finalContent}`;
       ...isHidden && { hidden: true },
       ...userContentParts && { contentParts: userContentParts }
     };
+    let attachmentResults = [];
+    if (currentAttachments.length > 0) {
+      const attachmentSkills = Object.entries(resolvedSkills).filter(
+        ([, config]) => config.trigger === "attachment"
+      );
+      for (const [skillName, skillConfig] of attachmentSkills) {
+        const matchedFiles = currentAttachments.filter((att) => {
+          if (!skillConfig.acceptedTypes || skillConfig.acceptedTypes.length === 0) return true;
+          return skillConfig.acceptedTypes.some((type) => {
+            if (type.startsWith(".")) return att.name.toLowerCase().endsWith(type.toLowerCase());
+            if (type.includes("*")) {
+              const regex = new RegExp("^" + type.replace("*", ".*") + "$");
+              return regex.test(att.mimeType);
+            }
+            return att.mimeType === type;
+          });
+        });
+        if (matchedFiles.length === 0) continue;
+        try {
+          const filesToPass = skillConfig.autoConvertBase64 ? await convertAttachmentsToBase64(matchedFiles) : matchedFiles;
+          const result = await skillConfig.execute({ files: filesToPass, userMessage: finalContent });
+          attachmentResults.push({
+            type: "tool_result",
+            toolName: skillName,
+            label: skillConfig.label,
+            icon: skillConfig.icon,
+            result: {
+              type: "text",
+              content: result.content,
+              metadata: result.metadata,
+              sources: result.sources
+            }
+          });
+        } catch (error) {
+          console.error(`[useChatUI] attachment skill ${skillName} failed:`, error);
+        }
+      }
+    }
+    let shouldContinueAfterAttachment = continueAfterToolResult;
+    if (attachmentResults.length > 0) {
+      for (const part of attachmentResults) {
+        if (part.type === "tool_result" && onSkillCompleteRef.current) {
+          const decision = onSkillCompleteRef.current(part.toolName, {
+            content: part.result.content,
+            metadata: part.result.metadata,
+            sources: part.result.sources
+          });
+          shouldContinueAfterAttachment = decision === "continue";
+          if (!shouldContinueAfterAttachment) break;
+        }
+      }
+    }
     const assistantMessageId = generateId3("msg");
     const assistantMessage = {
       id: assistantMessageId,
       role: "assistant",
       content: "",
       model: selectedModel,
-      timestamp: Date.now()
+      timestamp: Date.now(),
+      ...attachmentResults.length > 0 && { contentParts: attachmentResults }
     };
     setInput("");
     setQuotedText(null);
@@ -2312,19 +2445,23 @@ ${finalContent}`;
         return s;
       })
     );
-    if (isFirstMessage && generateTitleCallback) {
-      Promise.resolve(generateTitleCallback(finalContent)).then((generatedTitle) => {
+    if (isFirstMessage && generateTitleRef.current) {
+      Promise.resolve(generateTitleRef.current(finalContent)).then((generatedTitle) => {
         if (generatedTitle && generatedTitle.trim()) {
           setSessions(
             (prev) => prev.map(
               (s) => s.id === capturedSessionId ? { ...s, title: generatedTitle.trim(), updatedAt: Date.now() } : s
             )
           );
-          onTitleChange?.(capturedSessionId, generatedTitle.trim());
+          onTitleChangeRef.current?.(capturedSessionId, generatedTitle.trim());
         }
       }).catch(() => {
       });
     }
+    if (attachmentResults.length > 0 && !shouldContinueAfterAttachment) {
+      setIsLoading(false);
+      return;
+    }
     setIsLoading(true);
     abortControllerRef.current = new AbortController();
     try {
@@ -2384,6 +2521,20 @@ ${currentContextSummary}` },
       } else {
         chatMessages = messagesToSend.map((m) => ({ role: m.role, content: m.content }));
       }
+      if (attachmentResults.length > 0 && shouldContinueAfterAttachment) {
+        const attachmentContext = attachmentResults.filter((part) => part.type === "tool_result").map((part) => `[${part.label || part.toolName} \uACB0\uACFC]
+${part.result.content}`).join("\n\n");
+        if (attachmentContext) {
+          chatMessages.push({
+            role: "user",
+            content: `\uD30C\uC77C \uBD84\uC11D \uACB0\uACFC:
+
+${attachmentContext}
+
+\uC704 \uACB0\uACFC\uB97C \uCC38\uACE0\uD558\uC5EC \uB2F5\uBCC0\uD574\uC8FC\uC138\uC694.`
+          });
+        }
+      }
       console.log("[ChatUI] Messages to send:", chatMessages.length, chatMessages.map((m) => ({ role: m.role, content: m.content.slice(0, 50) })));
       const baseSystemPrompt = buildSystemPrompt();
       const combinedSystemPrompt = [baseSystemPrompt, actionPrompt].filter(Boolean).join("\n\n");
@@ -2648,6 +2799,16 @@ ${currentContextSummary}` },
                 abortControllerRef.current = null;
                 return;
               }
+              let shouldContinue = continueAfterToolResult;
+              if (onSkillCompleteRef.current) {
+                const decision = onSkillCompleteRef.current(toolName, result);
+                shouldContinue = decision === "continue";
+              }
+              if (!shouldContinue) {
+                setIsLoading(false);
+                abortControllerRef.current = null;
+                return;
+              }
               skipNextSkillParsingRef.current = true;
               const feedbackPrompt = resultType === "error" ? `\uB3C4\uAD6C "${toolName}" \uC2E4\uD589 \uC911 \uC624\uB958 \uBC1C\uC0DD: ${result.content}
 
@@ -2688,6 +2849,16 @@ ${result.content}
               abortControllerRef.current = null;
               return;
             }
+            let shouldContinueSkill = continueAfterToolResult;
+            if (onSkillCompleteRef.current) {
+              const decision = onSkillCompleteRef.current(detectedSkill.name, result);
+              shouldContinueSkill = decision === "continue";
+            }
+            if (!shouldContinueSkill) {
+              setIsLoading(false);
+              abortControllerRef.current = null;
+              return;
+            }
             skipNextSkillParsingRef.current = true;
             const resultPrompt = `\uC2A4\uD0AC "${detectedSkill.name}" \uC2E4\uD589 \uACB0\uACFC:
 
@@ -2727,7 +2898,7 @@ ${result.content}
       );
       if (useExternalStorage && capturedSessionId) {
         const assistantContentForSave = accumulatedContent;
-        if (assistantContentForSave && onSaveMessages) {
+        if (assistantContentForSave && onSaveMessagesRef.current) {
           const latestSession = sessionsRef.current.find((s) => s.id === capturedSessionId);
           const latestMessages = latestSession?.messages || [];
           const userMsg = latestMessages.find((m) => m.role === "user" && m.content === finalContent);
@@ -2736,7 +2907,7 @@ ${result.content}
             { role: "user", message: finalContent, ...userMsg?.contentParts && { contentParts: userMsg.contentParts } },
             { role: "assistant", message: assistantContentForSave, ...assistantMsg?.contentParts && { contentParts: assistantMsg.contentParts } }
           ];
-          onSaveMessages(capturedSessionId, messagesToSave).catch((saveError) => {
+          onSaveMessagesRef.current(capturedSessionId, messagesToSave).catch((saveError) => {
             console.error("[useChatUI] Failed to save messages:", saveError);
           });
         }
@@ -2764,7 +2935,7 @@ ${result.content}
         return;
       }
       const err = error instanceof Error ? error : new Error("Unknown error");
-      onError?.(err);
+      onErrorRef.current?.(err);
       setSessions(
         (prev) => prev.map((s) => {
           if (s.id === capturedSessionId) {
@@ -3037,11 +3208,11 @@ ${formattedParts.join("\n")}
         return;
       }
       console.error("[ChatUI] Regenerate error:", error);
-      onError?.(error instanceof Error ? error : new Error("Unknown error"));
+      onErrorRef.current?.(error instanceof Error ? error : new Error("Unknown error"));
     } finally {
       setIsLoading(false);
     }
-  }, [currentSession, currentSessionId, isLoading, selectedModel, models, apiEndpoint, apiKey, buildSystemPrompt, onError]);
+  }, [currentSession, currentSessionId, isLoading, selectedModel, models, apiEndpoint, apiKey, buildSystemPrompt]);
   const askOtherModel = useCallback5(async (messageId, targetModel) => {
     if (!currentSession || !currentSessionId || isLoading) return;
     const assistantIndex = currentSession.messages.findIndex((m) => m.id === messageId);
@@ -3193,7 +3364,7 @@ ${currentSession.contextSummary}` },
         return;
       }
       const err = error instanceof Error ? error : new Error("Unknown error");
-      onError?.(err);
+      onErrorRef.current?.(err);
     } finally {
       setIsLoading(false);
       setLoadingAlternativeFor(null);
@@ -3262,7 +3433,8 @@ ${currentSession.contextSummary}` },
     getActiveAlternative,
     updatePersonalization,
     savePersonalization,
-    models,
+    models: effectiveModels,
+    isModelsLoading,
     // Memory
     globalMemory,
     compressionState,
@@ -3350,7 +3522,25 @@ ${currentSession.contextSummary}` },
           systemPrompt: `\uC0AC\uC6A9\uC790\uAC00 "${toolConfig.label || skillName}" \uB3C4\uAD6C\uB97C \uC0AC\uC6A9\uD558\uB824\uACE0 \uD569\uB2C8\uB2E4. \uC0AC\uC6A9\uC790\uC758 \uBA54\uC2DC\uC9C0\uB97C \uBC14\uD0D5\uC73C\uB85C \uBC18\uB4DC\uC2DC <skill_use name="${skillName}"> \uD0DC\uADF8\uB97C \uC0AC\uC6A9\uD558\uC5EC \uC774 \uB3C4\uAD6C\uB97C \uD638\uCD9C\uD558\uC138\uC694. \uB3C4\uAD6C\uB97C \uC0AC\uC6A9\uD558\uC9C0 \uC54A\uACE0 \uD14D\uC2A4\uD2B8\uB85C\uB9CC \uB2F5\uBCC0\uD558\uC9C0 \uB9C8\uC138\uC694.`
         });
       } else {
-        executeManualSkill(skillName, { query: input });
+        const currentQuery = input;
+        executeManualSkill(skillName, { query: currentQuery }).then((result) => {
+          if (!result || !result.content) return;
+          let shouldContinue = continueAfterToolResult;
+          if (onSkillCompleteRef.current) {
+            const decision = onSkillCompleteRef.current(skillName, result);
+            shouldContinue = decision === "continue";
+          }
+          if (!shouldContinue) return;
+          skipNextSkillParsingRef.current = true;
+          const resultPrompt = `\uC2A4\uD0AC "${skillName}" \uC2E4\uD589 \uACB0\uACFC:
+
+${result.content}
+
+\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(() => {
+            sendMessage(resultPrompt, { hiddenUserMessage: true });
+          }, 100);
+        });
       }
     },
     // Project
@@ -3375,8 +3565,8 @@ ${currentSession.contextSummary}` },
       if (!enableProjects) return;
       const projectSessions = sessionsRef.current.filter((s) => s.projectId === projectId);
       for (const sess of projectSessions) {
-        if (useExternalStorage && onDeleteSessionCallback) {
-          await onDeleteSessionCallback(sess.id).catch(() => {
+        if (useExternalStorage && onDeleteSessionCallbackRef.current) {
+          await onDeleteSessionCallbackRef.current(sess.id).catch(() => {
           });
         }
         removeSessionCache(storageKey, sess.id);
@@ -3736,7 +3926,8 @@ var ChatSidebar = ({
   onNewProject,
   onProjectSettings,
   renderAfterHeader,
-  renderFooter
+  renderFooter,
+  isLoading = false
 }) => {
   const sidebarWidth = typeof widthProp === "number" ? `${widthProp}px` : widthProp || "288px";
   const [editingId, setEditingId] = useState7(null);
@@ -3780,6 +3971,7 @@ var ChatSidebar = ({
       className: `chatllm-sidebar chatllm-sidebar-transition ${theme ? `chatllm-root ${themeClass}` : ""}`,
       style: {
         width: isOpen ? sidebarWidth : "0",
+        height: "100%",
         flexShrink: 0,
         backgroundColor: "var(--chatllm-sidebar-bg)",
         borderRight: isOpen ? "1px solid var(--chatllm-border)" : "none",
@@ -3884,7 +4076,22 @@ var ChatSidebar = ({
                   display: "flex",
                   flexDirection: "column"
                 },
-                children: sessions.length === 0 ? (
+                children: isLoading ? (
+                  /* Skeleton Loading State */
+                  /* @__PURE__ */ jsx3("div", { style: { display: "flex", flexDirection: "column", gap: "8px", padding: "0 4px" }, children: [1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx3(
+                    "div",
+                    {
+                      className: "chatllm-skeleton-pulse",
+                      style: {
+                        height: "48px",
+                        borderRadius: "8px",
+                        backgroundColor: "var(--chatllm-bg-tertiary)",
+                        opacity: 1 - (i - 1) * 0.15
+                      }
+                    },
+                    i
+                  )) })
+                ) : sessions.length === 0 ? (
                   /* Empty State */
                   /* @__PURE__ */ jsxs2(
                     "div",
@@ -4827,6 +5034,16 @@ var ChatInput = ({
                               }
                             )
                           ] }),
+                          /* @__PURE__ */ jsx5(
+                            "button",
+                            {
+                              onClick: () => fileInputRef.current?.click(),
+                              style: iconButtonStyle,
+                              title: "\uD30C\uC77C \uCCA8\uBD80",
+                              "aria-label": "\uD30C\uC77C \uCCA8\uBD80",
+                              children: /* @__PURE__ */ jsx5(IconSvg, { name: "attachment-line", size: 22, color: "var(--chatllm-text-muted)" })
+                            }
+                          ),
                           /* @__PURE__ */ jsxs4("div", { ref: mainMenuRef, style: { position: "relative" }, children: [
                             /* @__PURE__ */ jsx5(
                               "button",
@@ -6812,6 +7029,7 @@ var PollCard = ({
     onSkip?.();
   }, [questions, onSubmit, onSkip]);
   useEffect7(() => {
+    if (typeof window === "undefined") return;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") handleSkip();
     };
@@ -7756,7 +7974,7 @@ var MessageBubble = ({
   const displaySources = isAssistant && relevantAlternatives && relevantAlternatives.length > 0 && relevantActiveIndex > 0 ? relevantAlternatives[relevantActiveIndex - 1]?.sources : message.sources;
   const handleMouseUp = () => {
     if (!onQuote) return;
-    const selection = window.getSelection();
+    const selection = typeof window !== "undefined" ? window.getSelection() : null;
     const text = selection?.toString().trim();
     if (text && text.length > 0) {
     }
@@ -8371,7 +8589,7 @@ var MessageList = ({
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages]);
   const handleMouseUp = useCallback8(() => {
-    const selection = window.getSelection();
+    const selection = typeof window !== "undefined" ? window.getSelection() : null;
     const text = selection?.toString().trim();
     if (text && text.length > 0) {
       const range = selection?.getRangeAt(0);
@@ -8387,7 +8605,7 @@ var MessageList = ({
       }
     } else {
       setTimeout(() => {
-        const currentSelection = window.getSelection()?.toString().trim();
+        const currentSelection = typeof window !== "undefined" ? window.getSelection()?.toString().trim() : void 0;
         if (!currentSelection) {
           setSelectionPosition(null);
         }
@@ -8399,7 +8617,9 @@ var MessageList = ({
       onQuote(selectedText);
       setSelectionPosition(null);
       setSelectedText("");
-      window.getSelection()?.removeAllRanges();
+      if (typeof window !== "undefined") {
+        window.getSelection()?.removeAllRanges();
+      }
     }
   };
   return /* @__PURE__ */ jsxs15(
@@ -9057,7 +9277,7 @@ var SettingsModal = ({
                   "button",
                   {
                     onClick: () => {
-                      if (window.confirm("\uBAA8\uB4E0 \uB300\uD654 \uAE30\uB85D\uC744 \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?")) {
+                      if (typeof window !== "undefined" && window.confirm("\uBAA8\uB4E0 \uB300\uD654 \uAE30\uB85D\uC744 \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?")) {
                         onClearAllData();
                       }
                     },
@@ -9328,7 +9548,7 @@ var MemoryTabContent = ({ items, contextSummary, onDelete, onClearAll, title = "
       "button",
       {
         onClick: () => {
-          if (window.confirm("\uBAA8\uB4E0 AI \uBA54\uBAA8\uB9AC\uB97C \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?")) {
+          if (typeof window !== "undefined" && window.confirm("\uBAA8\uB4E0 AI \uBA54\uBAA8\uB9AC\uB97C \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?")) {
             onClearAll();
           }
         },
@@ -9575,7 +9795,7 @@ var ProjectSettingsModal = ({
                     "button",
                     {
                       onClick: () => {
-                        if (window.confirm(`"${project.title}" \uD504\uB85C\uC81D\uD2B8\uC640 \uC18C\uC18D \uB300\uD654\uAC00 \uBAA8\uB450 \uC0AD\uC81C\uB429\uB2C8\uB2E4. \uACC4\uC18D\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?`)) {
+                        if (typeof window !== "undefined" && window.confirm(`"${project.title}" \uD504\uB85C\uC81D\uD2B8\uC640 \uC18C\uC18D \uB300\uD654\uAC00 \uBAA8\uB450 \uC0AD\uC81C\uB429\uB2C8\uB2E4. \uACC4\uC18D\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?`)) {
                           onDeleteProject(project.id);
                           onClose();
                         }
@@ -10080,7 +10300,8 @@ var ChatUIView = ({
     projectSettingsOpen,
     openProjectSettings,
     closeProjectSettings,
-    projectMemory
+    projectMemory,
+    isSessionsLoading
   } = state;
   const greeting = currentPersonalization.userProfile.nickname ? `\uC548\uB155\uD558\uC138\uC694, ${currentPersonalization.userProfile.nickname}\uB2D8` : "\uC548\uB155\uD558\uC138\uC694";
   const handleTemplateClick = (template) => {
@@ -10154,6 +10375,7 @@ var ChatUIView = ({
             currentProjectId,
             onSelectProject: projects.length > 0 ? selectProject : void 0,
             onNewProject: projects.length > 0 ? () => {
+              if (typeof window === "undefined") return;
               const title = window.prompt("\uD504\uB85C\uC81D\uD2B8 \uC774\uB984\uC744 \uC785\uB825\uD558\uC138\uC694");
               if (title?.trim()) {
                 createProject({ title: title.trim() });
@@ -10164,7 +10386,8 @@ var ChatUIView = ({
               openProjectSettings();
             } : void 0,
             renderAfterHeader: sidebarRenderAfterHeader,
-            renderFooter: sidebarRenderFooter
+            renderFooter: sidebarRenderFooter,
+            isLoading: isSessionsLoading
           }
         ),
         /* @__PURE__ */ jsxs19(
@@ -10336,6 +10559,9 @@ var ChatUIWithHook = ({
   skills,
   tools,
   onToolCall,
+  continueAfterToolResult,
+  onSkillComplete,
+  onLoadModels,
   // Project options
   enableProjects,
   onLoadProjects,
@@ -10375,6 +10601,9 @@ var ChatUIWithHook = ({
     skills,
     tools,
     onToolCall,
+    continueAfterToolResult,
+    onSkillComplete,
+    onLoadModels,
     enableProjects,
     onLoadProjects,
     onCreateProject,