@gendive/chatllm 0.13.1 → 0.14.0

package/dist/react/index.d.mts

@@ -444,6 +444,12 @@ interface ThemeConfig {
     borderRadius?: 'none' | 'sm' | 'md' | 'lg' | 'xl';
 }
 interface ChatUIProps {
+    /**
+     * @description 외부에서 생성한 useChatUI 상태 주입
+     * @Todo vibecode - 레이아웃 수준에서 hook 초기화 후 ChatUI와 ChatSidebar에 공유할 때 사용
+     * 제공 시 ChatUI 내부에서 useChatUI를 호출하지 않고 이 상태를 직접 사용
+     */
+    chatState?: UseChatUIReturn;
     /** 사용 가능한 모델 목록 (기본값 제공) */
     models?: ModelConfig[];
     /** 사용 가능한 Actions */
@@ -452,6 +458,8 @@ interface ChatUIProps {
     templates?: PromptTemplate[];
     /** 개인화 설정 */
     personalization?: Partial<PersonalizationConfig>;
+    /** @Todo vibecode - 개인화 설정 변경 콜백 (백엔드 저장용) */
+    onPersonalizationChange?: (config: PersonalizationConfig) => void;
     /** API 키 (DevDive 등 외부 프로바이더용) */
     apiKey?: string;
     /** API 키 변경 핸들러 */
@@ -476,6 +484,8 @@ interface ChatUIProps {
     keepRecentMessages?: number;
     /** 스토리지 키 (로컬 저장용) */
     storageKey?: string;
+    /** @Todo vibecode - 초기 선택 세션 ID (미제공 시 sessions[0] 자동 선택) */
+    initialSessionId?: string;
     /** CSS 클래스 */
     className?: string;
     /** 메시지 전송 핸들러 (커스텀 API 사용 시) */
@@ -885,6 +895,10 @@ interface UseChatUIReturn {
  * 풀 기능 채팅 UI
  */
 
+/**
+ * @description ChatUI 메인 컴포넌트
+ * @Todo vibecode - chatState 제공 시 외부 상태 사용, 미제공 시 내부 useChatUI 호출
+ */
 declare const ChatUI: React$1.FC<ChatUIProps>;
 
 /**
@@ -899,6 +913,10 @@ interface UseChatUIOptions {
     actions?: ActionItem[];
     /** 초기 개인화 설정 */
     initialPersonalization?: Partial<PersonalizationConfig>;
+    /** @Todo vibecode - 개인화 설정 변경 콜백 (백엔드 저장용) */
+    onPersonalizationChange?: (config: PersonalizationConfig) => void;
+    /** @Todo vibecode - 초기 선택 세션 ID (미제공 시 sessions[0] 자동 선택) */
+    initialSessionId?: string;
     /** API 키 */
     apiKey?: string;
     /** API 엔드포인트 */

package/dist/react/index.d.ts

@@ -444,6 +444,12 @@ interface ThemeConfig {
     borderRadius?: 'none' | 'sm' | 'md' | 'lg' | 'xl';
 }
 interface ChatUIProps {
+    /**
+     * @description 외부에서 생성한 useChatUI 상태 주입
+     * @Todo vibecode - 레이아웃 수준에서 hook 초기화 후 ChatUI와 ChatSidebar에 공유할 때 사용
+     * 제공 시 ChatUI 내부에서 useChatUI를 호출하지 않고 이 상태를 직접 사용
+     */
+    chatState?: UseChatUIReturn;
     /** 사용 가능한 모델 목록 (기본값 제공) */
     models?: ModelConfig[];
     /** 사용 가능한 Actions */
@@ -452,6 +458,8 @@ interface ChatUIProps {
     templates?: PromptTemplate[];
     /** 개인화 설정 */
     personalization?: Partial<PersonalizationConfig>;
+    /** @Todo vibecode - 개인화 설정 변경 콜백 (백엔드 저장용) */
+    onPersonalizationChange?: (config: PersonalizationConfig) => void;
     /** API 키 (DevDive 등 외부 프로바이더용) */
     apiKey?: string;
     /** API 키 변경 핸들러 */
@@ -476,6 +484,8 @@ interface ChatUIProps {
     keepRecentMessages?: number;
     /** 스토리지 키 (로컬 저장용) */
     storageKey?: string;
+    /** @Todo vibecode - 초기 선택 세션 ID (미제공 시 sessions[0] 자동 선택) */
+    initialSessionId?: string;
     /** CSS 클래스 */
     className?: string;
     /** 메시지 전송 핸들러 (커스텀 API 사용 시) */
@@ -885,6 +895,10 @@ interface UseChatUIReturn {
  * 풀 기능 채팅 UI
  */
 
+/**
+ * @description ChatUI 메인 컴포넌트
+ * @Todo vibecode - chatState 제공 시 외부 상태 사용, 미제공 시 내부 useChatUI 호출
+ */
 declare const ChatUI: React$1.FC<ChatUIProps>;
 
 /**
@@ -899,6 +913,10 @@ interface UseChatUIOptions {
     actions?: ActionItem[];
     /** 초기 개인화 설정 */
     initialPersonalization?: Partial<PersonalizationConfig>;
+    /** @Todo vibecode - 개인화 설정 변경 콜백 (백엔드 저장용) */
+    onPersonalizationChange?: (config: PersonalizationConfig) => void;
+    /** @Todo vibecode - 초기 선택 세션 ID (미제공 시 sessions[0] 자동 선택) */
+    initialSessionId?: string;
     /** API 키 */
     apiKey?: string;
     /** API 엔드포인트 */

package/dist/react/index.js

@@ -1369,7 +1369,8 @@ var useChatUI = (options) => {
         }));
         setSessions(sessionsWithoutMessages);
         if (sessionsWithoutMessages.length > 0) {
-          setCurrentSessionId(sessionsWithoutMessages[0].id);
+          const targetId = options.initialSessionId && sessionsWithoutMessages.some((s) => s.id === options.initialSessionId) ? options.initialSessionId : sessionsWithoutMessages[0].id;
+          setCurrentSessionId(targetId);
         }
       }).catch((error) => {
         onError?.(error instanceof Error ? error : new Error("Failed to load sessions"));
@@ -1391,8 +1392,10 @@ var useChatUI = (options) => {
         const parsed = JSON.parse(saved);
         setSessions(parsed);
         if (parsed.length > 0) {
-          setCurrentSessionId(parsed[0].id);
-          setSelectedModel(parsed[0].model);
+          const targetSession = options.initialSessionId ? parsed.find((s) => s.id === options.initialSessionId) : null;
+          const selected = targetSession || parsed[0];
+          setCurrentSessionId(selected.id);
+          setSelectedModel(selected.model);
         }
       } catch {
       }
@@ -1798,8 +1801,12 @@ ${newConversation}
     abortControllerRef.current?.abort();
   }, []);
   const updatePersonalization = (0, import_react4.useCallback)((config) => {
-    setPersonalization((prev) => ({ ...prev, ...config }));
-  }, []);
+    setPersonalization((prev) => {
+      const next = { ...prev, ...config };
+      options.onPersonalizationChange?.(next);
+      return next;
+    });
+  }, [options.onPersonalizationChange]);
   const toggleDeepResearchMode = (0, import_react4.useCallback)(() => {
     setIsDeepResearchMode((prev) => !prev);
   }, []);
@@ -7884,74 +7891,23 @@ var injectStyles = () => {
   `;
   document.head.appendChild(style);
 };
-var ChatUI = ({
-  models = DEFAULT_MODELS,
-  actions = DEFAULT_ACTIONS,
-  templates = DEFAULT_TEMPLATES,
-  personalization,
+var ChatUIView = ({
+  state,
+  models,
+  actions,
+  templates,
+  showSidebar,
+  sidebarWidth,
+  showSettings,
+  showModelSelector,
+  showThinking,
+  thinkingDefaultOpen,
+  theme,
+  className,
   apiKey,
   onApiKeyChange,
-  apiEndpoint = "/api/chat",
-  theme,
-  showSidebar = true,
-  sidebarWidth,
-  showSettings = true,
-  showModelSelector = true,
-  systemPrompt,
-  contextCompressionThreshold = 20,
-  keepRecentMessages = 6,
-  storageKey = "chatllm_sessions",
-  className = "",
-  onSendMessage,
-  onSessionChange,
-  onError,
-  onTitleChange,
-  generateTitle: generateTitle2,
-  // External Storage Props
-  useExternalStorage = false,
-  onLoadSessions,
-  onCreateSession,
-  onLoadSession,
-  onDeleteSession,
-  onUpdateSessionTitle,
-  onSaveMessages,
-  // Thinking Block Props
-  showThinking = true,
-  thinkingDefaultOpen = false,
-  // Deep Research Props
-  deepResearch,
-  // Skills Props
-  skills
+  deepResearchEnabled
 }) => {
-  injectStyles();
-  const hookOptions = {
-    models,
-    actions,
-    initialPersonalization: personalization,
-    apiKey,
-    apiEndpoint,
-    initialModel: models[0]?.id,
-    storageKey,
-    contextCompressionThreshold,
-    keepRecentMessages,
-    onSendMessage,
-    onSessionChange,
-    onError,
-    onTitleChange,
-    generateTitle: generateTitle2,
-    // External Storage Options
-    useExternalStorage,
-    onLoadSessions,
-    onCreateSession,
-    onLoadSession,
-    onDeleteSession,
-    onUpdateSessionTitle,
-    onSaveMessages,
-    // Deep Research Options
-    deepResearch,
-    // Skills Options
-    skills
-  };
   const {
     sessions,
     currentSession,
@@ -7982,8 +7938,6 @@ var ChatUI = ({
     setSelectedAction,
     copyMessage,
     startEdit,
-    cancelEdit,
-    saveEdit,
     regenerate,
     askOtherModel,
     setActiveAlternative,
@@ -7991,19 +7945,15 @@ var ChatUI = ({
     loadingAlternativeFor,
     updatePersonalization,
     models: hookModels,
-    // Deep Research
     isDeepResearchMode,
     toggleDeepResearchMode,
-    // Poll
     handlePollSubmit,
-    // Memory
     globalMemory,
     compressionState,
-    // Skills
     manualSkills,
     activeSkillExecution,
     executeManualSkill
-  } = useChatUI(hookOptions);
+  } = state;
   const greeting = currentPersonalization.userProfile.nickname ? `\uC548\uB155\uD558\uC138\uC694, ${currentPersonalization.userProfile.nickname}\uB2D8` : "\uC548\uB155\uD558\uC138\uC694";
   const handleTemplateClick = (template) => {
     setInput(template.prompt);
@@ -8134,7 +8084,7 @@ var ChatUI = ({
                   actions,
                   onDeepResearch: toggleDeepResearchMode,
                   isDeepResearchMode,
-                  deepResearchEnabled: !!deepResearch?.onWebSearch,
+                  deepResearchEnabled,
                   manualSkills,
                   onSkillSelect: executeManualSkill,
                   activeSkillExecution
@@ -8167,6 +8117,134 @@ var ChatUI = ({
     }
   );
 };
+var ChatUIWithHook = ({
+  models = DEFAULT_MODELS,
+  actions = DEFAULT_ACTIONS,
+  templates = DEFAULT_TEMPLATES,
+  personalization,
+  onPersonalizationChange,
+  apiKey,
+  onApiKeyChange,
+  apiEndpoint = "/api/chat",
+  theme,
+  showSidebar = true,
+  sidebarWidth,
+  showSettings = true,
+  showModelSelector = true,
+  systemPrompt,
+  contextCompressionThreshold = 20,
+  keepRecentMessages = 6,
+  storageKey = "chatllm_sessions",
+  initialSessionId,
+  className = "",
+  onSendMessage,
+  onSessionChange,
+  onError,
+  onTitleChange,
+  generateTitle: generateTitle2,
+  useExternalStorage = false,
+  onLoadSessions,
+  onCreateSession,
+  onLoadSession,
+  onDeleteSession,
+  onUpdateSessionTitle,
+  onSaveMessages,
+  showThinking = true,
+  thinkingDefaultOpen = false,
+  deepResearch,
+  skills
+}) => {
+  const hookOptions = {
+    models,
+    actions,
+    initialPersonalization: personalization,
+    onPersonalizationChange,
+    initialSessionId,
+    apiKey,
+    apiEndpoint,
+    initialModel: models[0]?.id,
+    storageKey,
+    contextCompressionThreshold,
+    keepRecentMessages,
+    onSendMessage,
+    onSessionChange,
+    onError,
+    onTitleChange,
+    generateTitle: generateTitle2,
+    useExternalStorage,
+    onLoadSessions,
+    onCreateSession,
+    onLoadSession,
+    onDeleteSession,
+    onUpdateSessionTitle,
+    onSaveMessages,
+    deepResearch,
+    skills
+  };
+  const state = useChatUI(hookOptions);
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    ChatUIView,
+    {
+      state,
+      models,
+      actions,
+      templates,
+      showSidebar,
+      sidebarWidth,
+      showSettings,
+      showModelSelector,
+      showThinking,
+      thinkingDefaultOpen,
+      theme,
+      className,
+      apiKey,
+      onApiKeyChange,
+      deepResearchEnabled: !!deepResearch?.onWebSearch
+    }
+  );
+};
+var ChatUI = (props) => {
+  injectStyles();
+  if (props.chatState) {
+    const {
+      models = DEFAULT_MODELS,
+      actions = DEFAULT_ACTIONS,
+      templates = DEFAULT_TEMPLATES,
+      showSidebar = true,
+      sidebarWidth,
+      showSettings = true,
+      showModelSelector = true,
+      showThinking = true,
+      thinkingDefaultOpen = false,
+      theme,
+      className = "",
+      apiKey,
+      onApiKeyChange,
+      deepResearch
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      ChatUIView,
+      {
+        state: props.chatState,
+        models,
+        actions,
+        templates,
+        showSidebar,
+        sidebarWidth,
+        showSettings,
+        showModelSelector,
+        showThinking,
+        thinkingDefaultOpen,
+        theme,
+        className,
+        apiKey,
+        onApiKeyChange,
+        deepResearchEnabled: !!deepResearch?.onWebSearch
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChatUIWithHook, { ...props });
+};
 
 // src/react/hooks/useDeepResearch.ts
 var import_react16 = require("react");