npcts 0.1.0

package/dist/core/utils.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Core utility functions for npcts
+ */
+/**
+ * Generate a unique ID string
+ * @returns A random 9-character alphanumeric string
+ */
+export declare const generateId: () => string;
+/**
+ * Hash an array of context objects for caching/comparison
+ * @param contexts - Array of context objects with type, path/url, and content
+ * @returns Base64 encoded hash string
+ */
+export declare const hashContext: (contexts: Array<{
+    type: string;
+    path?: string;
+    url?: string;
+    content?: string;
+}>) => string;

package/dist/core/utils.js

@@ -0,0 +1,19 @@
+/**
+ * Core utility functions for npcts
+ */
+/**
+ * Generate a unique ID string
+ * @returns A random 9-character alphanumeric string
+ */
+export const generateId = () => Math.random().toString(36).substr(2, 9);
+/**
+ * Hash an array of context objects for caching/comparison
+ * @param contexts - Array of context objects with type, path/url, and content
+ * @returns Base64 encoded hash string
+ */
+export const hashContext = (contexts) => {
+    const contentString = contexts
+        .map(ctx => `${ctx.type}:${ctx.path || ctx.url}:${ctx.content?.substring(0, 100) || ''}`)
+        .join('|');
+    return btoa(contentString);
+};

package/dist/index.d.ts

@@ -0,0 +1,25 @@
+export * from "./core/chat";
+export * from "./core/types";
+export * from "./core/layout";
+export * from "./core/files";
+export * from "./core/utils";
+export * from "./core/database";
+export * from "./adapters/base";
+export { createElectronAdapter } from "./adapters/electron/bridge";
+export * from "./ui/hooks";
+export * from "./ui/primitives";
+export * from "./ui/chat";
+export * from "./ui/files";
+export { MessageItem } from "./ui/chat/components/MessageItem";
+export * from "./ui/viewers";
+export * from "./ui/dialogs";
+export * from "./ui/specialized";
+export { getFileIcon, convertFileToBase64 } from "./ui/utils";
+export * from "./ui/layout/components/modals";
+export * from "./ui/sql";
+export * from "./ui/memory";
+export * from "./ui/knowledge-graph";
+export * from "./ui/execution";
+export * from "./ui/models";
+export * from "./ui/dashboard";
+export * from "./ui/editors";

package/dist/index.js

@@ -0,0 +1,29 @@
+// Core modules
+export * from "./core/chat";
+export * from "./core/types";
+export * from "./core/layout";
+export * from "./core/files";
+export * from "./core/utils";
+export * from "./core/database";
+// Adapters
+export * from "./adapters/base";
+export { createElectronAdapter } from "./adapters/electron/bridge";
+// UI Hooks
+export * from "./ui/hooks";
+// UI Components
+export * from "./ui/primitives";
+export * from "./ui/chat";
+export * from "./ui/files";
+export { MessageItem } from "./ui/chat/components/MessageItem";
+export * from "./ui/viewers";
+export * from "./ui/dialogs";
+export * from "./ui/specialized";
+export { getFileIcon, convertFileToBase64 } from "./ui/utils";
+export * from "./ui/layout/components/modals";
+export * from "./ui/sql";
+export * from "./ui/memory";
+export * from "./ui/knowledge-graph";
+export * from "./ui/execution";
+export * from "./ui/models";
+export * from "./ui/dashboard";
+export * from "./ui/editors";

package/dist/ui/chat/components/ChatHeaderBar.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+export interface ConversationStats {
+    messageCount?: number;
+    tokenCount?: number;
+    models?: Set<string>;
+    agents?: Set<string>;
+    totalAttachments?: number;
+    totalToolCalls?: number;
+}
+export declare const ChatHeaderBar: React.FC<{
+    stats: ConversationStats;
+    isEmpty: boolean;
+}>;

package/dist/ui/chat/components/ChatHeaderBar.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { MessageSquare, Terminal, Code2, Users, Paperclip, Wrench } from "lucide-react";
+export const ChatHeaderBar = ({ stats, isEmpty }) => {
+    if (isEmpty)
+        return null;
+    return (React.createElement("div", { className: "p-2 flex flex-wrap gap-x-4 gap-y-1 text-gray-400 min-h-[20px] theme-bg-secondary border-b theme-border" },
+        React.createElement("span", null,
+            React.createElement(MessageSquare, { size: 12, className: "inline mr-1" }),
+            stats.messageCount || 0,
+            " Msgs"),
+        React.createElement("span", null,
+            React.createElement(Terminal, { size: 12, className: "inline mr-1" }),
+            "~",
+            stats.tokenCount || 0,
+            " Tokens"),
+        React.createElement("span", null,
+            React.createElement(Code2, { size: 12, className: "inline mr-1" }),
+            stats.models?.size || 0,
+            " Models"),
+        React.createElement("span", null,
+            React.createElement(Users, { size: 12, className: "inline mr-1" }),
+            stats.agents?.size || 0,
+            " Agents"),
+        stats.totalAttachments ? (React.createElement("span", null,
+            React.createElement(Paperclip, { size: 12, className: "inline mr-1" }),
+            stats.totalAttachments,
+            " Attachments")) : null,
+        stats.totalToolCalls ? (React.createElement("span", null,
+            React.createElement(Wrench, { size: 12, className: "inline mr-1" }),
+            stats.totalToolCalls,
+            " Tool Calls")) : null));
+};

package/dist/ui/chat/components/ChatInterface.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { AppServices } from "../../../adapters/base";
+import type { ModelInfo } from "../../../core/types";
+interface Props {
+    services: AppServices;
+    workspacePath?: string;
+    models?: ModelInfo[];
+}
+export declare const ChatInterface: React.FC<Props>;
+export {};

package/dist/ui/chat/components/ChatInterface.js

@@ -0,0 +1,19 @@
+import React from "react";
+import { ChatProvider } from "../context/ChatContext";
+import { ConversationList } from "./ConversationList";
+import { ChatView } from "./ChatView";
+import { InputArea } from "./InputArea";
+import { useChatContext } from "../context/ChatContext";
+export const ChatInterface = ({ services, workspacePath, models }) => {
+    return (React.createElement(ChatProvider, { services: services, workspacePath: workspacePath, models: models },
+        React.createElement("div", { className: "flex h-full min-h-0 theme-bg-primary theme-text-primary border theme-border rounded-lg overflow-hidden" },
+            React.createElement("div", { className: "w-72 min-w-[16rem] theme-bg-secondary theme-border border-r" },
+                React.createElement(ConversationListWrapper, null)),
+            React.createElement("div", { className: "flex-1 flex flex-col min-w-0" },
+                React.createElement(ChatView, null),
+                React.createElement(InputArea, { models: models })))));
+};
+const ConversationListWrapper = () => {
+    const { conversations, activeConversationId, setActiveConversation, createConversation, deleteConversation, loading, } = useChatContext();
+    return (React.createElement(ConversationList, { conversations: conversations, activeConversationId: activeConversationId, onConversationSelect: setActiveConversation, onRefresh: () => createConversation(), loading: loading }));
+};

package/dist/ui/chat/components/ChatMessage.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { ChatMessage as ChatMessageType } from "../../../core/chat";
+interface Props {
+    message: ChatMessageType;
+}
+export declare const ChatMessageBubble: React.FC<Props>;
+export {};

package/dist/ui/chat/components/ChatMessage.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { Markdown } from "../../markdown/Markdown";
+import { AttachmentList } from "./MessageAttachments";
+export const ChatMessageBubble = ({ message }) => {
+    const isUser = message.role === "user";
+    return (React.createElement("div", { className: `flex flex-col gap-1 ${isUser ? "items-end" : "items-start"}` },
+        React.createElement("div", { className: `max-w-3xl rounded-lg px-3 py-2 text-sm border theme-border ${isUser ? "theme-message-user" : "theme-message-assistant"}` },
+            React.createElement(Markdown, { content: message.content || "" })),
+        message.attachments?.length ? React.createElement(AttachmentList, { attachments: message.attachments }) : null));
+};

package/dist/ui/chat/components/ChatPane.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { ConversationStats } from "./ChatHeaderBar";
+export interface ChatPaneProps {
+    isEmpty: boolean;
+    stats: ConversationStats;
+    scrollRef?: React.Ref<HTMLDivElement> | null;
+    onScroll?: React.UIEventHandler<HTMLDivElement>;
+    renderMessages: () => React.ReactNode;
+    renderSelectionToolbar?: () => React.ReactNode;
+    renderInputArea: () => React.ReactNode;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
+    paneRef?: React.Ref<HTMLDivElement> | null;
+    ariaLabel?: string;
+    isStreaming?: boolean;
+    isLoadingMessages?: boolean;
+    onDragOver?: React.DragEventHandler<HTMLDivElement>;
+    onDrop?: React.DragEventHandler<HTMLDivElement>;
+}
+export declare const ChatPane: React.FC<ChatPaneProps>;

package/dist/ui/chat/components/ChatPane.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { ChatHeaderBar } from "./ChatHeaderBar";
+// Structural wrapper that mirrors the chat pane layout in ChatInterface.jsx
+export const ChatPane = ({ isEmpty, stats, scrollRef, onScroll, renderMessages, renderSelectionToolbar, renderInputArea, onClick, onKeyDown, paneRef, ariaLabel, isStreaming, isLoadingMessages, onDragOver, onDrop, }) => {
+    return (React.createElement("div", { className: "flex-1 flex flex-col min-h-0 overflow-hidden relative focus:outline-none", tabIndex: -1, ref: paneRef, onClick: onClick, onKeyDown: onKeyDown, "aria-label": ariaLabel || "Chat pane", onDragOver: onDragOver, onDrop: onDrop },
+        React.createElement(ChatHeaderBar, { stats: stats, isEmpty: isEmpty }),
+        isEmpty ? (React.createElement("div", { className: "flex-1 flex items-center justify-center theme-text-muted" },
+            React.createElement("div", { className: "text-center" },
+                React.createElement("div", { className: "text-lg mb-2" }, "No messages yet"),
+                React.createElement("div", { className: "text-sm" }, "Start a conversation by typing below")))) : (React.createElement(React.Fragment, null,
+            React.createElement("div", { className: "flex-1 overflow-y-auto theme-bg-primary custom-scrollbar relative", ref: scrollRef, onScroll: onScroll },
+                React.createElement("div", { className: "flex flex-col gap-4 p-4 pb-24", style: { userSelect: "auto" } },
+                    renderMessages(),
+                    (isStreaming || isLoadingMessages) && (React.createElement("div", { className: "flex justify-center py-4" },
+                        React.createElement("div", { className: "flex items-center gap-2 text-gray-400" },
+                            React.createElement("div", { className: "w-4 h-4 border-2 border-gray-500 rounded-full border-t-transparent animate-spin" }),
+                            React.createElement("span", null, "Loading..."))))),
+                renderSelectionToolbar ? renderSelectionToolbar() : null))),
+        renderInputArea()));
+};

package/dist/ui/chat/components/ChatView.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { Conversation } from "../../../core/chat";
+export type MessageListProps = {
+    renderHeader?: (args: {
+        conversation?: Conversation | undefined;
+        messageCount: number;
+    }) => React.ReactNode;
+    renderMessage?: (message: any) => React.ReactNode;
+};
+export declare const ChatView: React.FC<MessageListProps>;

package/dist/ui/chat/components/ChatView.js

@@ -0,0 +1,36 @@
+import React, { useEffect, useMemo, useRef } from "react";
+import { useChatContext } from "../context/ChatContext";
+import { ChatMessageBubble } from "./ChatMessage";
+import { useAutoScroll } from "../hooks/useAutoScroll";
+import { Spinner } from "../../primitives/Spinner";
+// Message list pane with header; defaults mimic ChatInterface.jsx message pane styling
+export const ChatView = ({ renderHeader, renderMessage, }) => {
+    const { messages, activeConversationId, streaming, loading, conversations } = useChatContext();
+    const currentMessages = useMemo(() => (activeConversationId ? messages[activeConversationId] || [] : []), [activeConversationId, messages]);
+    const listRef = useRef(null);
+    const scrollRef = useAutoScroll([currentMessages.length, streaming]);
+    useEffect(() => {
+        if (listRef.current) {
+            listRef.current.scrollTop = listRef.current.scrollHeight;
+        }
+    }, [currentMessages.length]);
+    const activeConversation = useMemo(() => conversations.find((c) => c.id === activeConversationId), [conversations, activeConversationId]);
+    const defaultHeader = (React.createElement("div", { className: "flex items-center justify-between px-4 py-2 border-b theme-border bg-gray-800/60 text-gray-300 text-xs" },
+        React.createElement("div", { className: "flex items-center gap-3" },
+            React.createElement("span", { className: "uppercase tracking-wide" },
+                "Conversation: ",
+                activeConversation?.id || "None"),
+            React.createElement("span", { className: "text-[11px] text-gray-400" },
+                "Msgs: ",
+                currentMessages.length)),
+        React.createElement("div", { className: "flex items-center gap-2" },
+            React.createElement("span", { className: "px-2 py-0.5 rounded bg-gray-700 text-gray-200 text-[11px]" }, "Auto"),
+            React.createElement("span", { className: "px-2 py-0.5 rounded bg-gray-700 text-gray-200 text-[11px]" }, "Select"))));
+    return (React.createElement("div", { className: "flex-1 flex flex-col theme-bg-primary" },
+        renderHeader
+            ? renderHeader({ conversation: activeConversation, messageCount: currentMessages.length })
+            : defaultHeader,
+        React.createElement("div", { ref: listRef, className: "flex-1 overflow-y-auto p-4 flex flex-col gap-3 custom-scrollbar" },
+            currentMessages.map((m) => renderMessage ? renderMessage(m) : React.createElement(ChatMessageBubble, { key: m.id, message: m })),
+            loading && React.createElement(Spinner, null))));
+};

package/dist/ui/chat/components/ConversationList.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import type { Conversation } from "../../../core/chat";
+type ConversationWithTimestamps = Conversation & {
+    timestamp?: string;
+    last_message_timestamp?: string;
+};
+type Props = {
+    conversations?: ConversationWithTimestamps[] | null;
+    activeConversationId?: string | null;
+    currentFile?: string | null;
+    conversationsCollapsed?: boolean;
+    onToggleCollapse?: (collapsed: boolean) => void;
+    selectedConvos?: Set<string> | null;
+    onSelectedConvosChange?: (set: Set<string>) => void;
+    lastClickedIndex?: number | null;
+    onLastClickedIndexChange?: (index: number | null) => void;
+    onConversationSelect?: (id: string) => void;
+    onRefresh?: () => void;
+    onConversationContextMenu?: (pos: {
+        x: number;
+        y: number;
+    }) => void;
+    onConversationDragStart?: (e: React.DragEvent, conversation: ConversationWithTimestamps) => void;
+    onConversationDragEnd?: (e: React.DragEvent, conversation: ConversationWithTimestamps) => void;
+    loading?: boolean;
+};
+export declare const ConversationList: React.FC<Props>;
+export {};

package/dist/ui/chat/components/ConversationList.js

@@ -0,0 +1,113 @@
+import React, { useMemo, useState } from "react";
+import { File, ChevronRight } from "lucide-react";
+import { cn } from "../../utils/cn";
+export const ConversationList = ({ conversations, activeConversationId = null, currentFile = null, conversationsCollapsed, onToggleCollapse, selectedConvos, onSelectedConvosChange, lastClickedIndex, onLastClickedIndexChange, onConversationSelect, onRefresh, onConversationContextMenu, onConversationDragStart, onConversationDragEnd, loading, }) => {
+    const [internalCollapsed, setInternalCollapsed] = useState(false);
+    const collapsed = conversationsCollapsed ?? internalCollapsed;
+    const toggleCollapsed = () => {
+        const next = !collapsed;
+        onToggleCollapse ? onToggleCollapse(next) : setInternalCollapsed(next);
+    };
+    const [localSelected, setLocalSelected] = useState(new Set());
+    const selected = selectedConvos ?? localSelected;
+    const setSelected = (s) => {
+        onSelectedConvosChange ? onSelectedConvosChange(s) : setLocalSelected(s);
+    };
+    const [localLastIndex, setLocalLastIndex] = useState(null);
+    const lastIndex = lastClickedIndex ?? localLastIndex;
+    const setLastIndex = (i) => {
+        onLastClickedIndexChange ? onLastClickedIndexChange(i) : setLocalLastIndex(i);
+    };
+    const convArray = useMemo(() => {
+        if (!Array.isArray(conversations))
+            return [];
+        return [...conversations].sort((a, b) => {
+            const aTimestamp = new Date(a.last_message_timestamp || a.timestamp || 0).getTime();
+            const bTimestamp = new Date(b.last_message_timestamp || b.timestamp || 0).getTime();
+            return bTimestamp - aTimestamp;
+        });
+    }, [conversations]);
+    const header = (React.createElement("div", { className: "flex items-center justify-between px-4 py-2 mt-4" },
+        React.createElement("div", { className: "text-xs text-gray-500 font-medium" },
+            "Conversations (",
+            convArray.length,
+            ")"),
+        React.createElement("div", { className: "flex items-center gap-1" },
+            onRefresh && (React.createElement("button", { onClick: (e) => {
+                    e.stopPropagation();
+                    onRefresh();
+                }, className: "p-1 theme-hover rounded-full transition-all", title: "Refresh conversations" },
+                React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" },
+                    React.createElement("path", { d: "M21.5 2v6h-6M2.5 22v-6h6M2 11.5a10 10 0 0 1 18.44-4.5M22 12.5a10 10 0 0 1-18.44 4.5" })))),
+            React.createElement("button", { onClick: (e) => {
+                    e.stopPropagation();
+                    toggleCollapsed();
+                }, className: "p-1 theme-hover rounded-full transition-all", title: collapsed ? "Expand conversations" : "Collapse conversations" },
+                React.createElement(ChevronRight, { size: 16, className: `transform transition-transform ${collapsed ? "" : "rotate-90"}` })))));
+    if (!convArray.length) {
+        return (React.createElement("div", { className: "mt-4" },
+            header,
+            React.createElement("div", { className: "px-4 py-2 text-xs text-gray-500" }, "No conversations.")));
+    }
+    if (collapsed) {
+        const activeConversation = activeConversationId ? convArray.find((c) => c.id === activeConversationId) : null;
+        return (React.createElement("div", { className: "mt-4" },
+            header,
+            activeConversation && !currentFile && (React.createElement("div", { className: "px-1 mt-1" },
+                React.createElement("button", { key: activeConversation.id, onClick: () => onConversationSelect?.(activeConversation.id), className: "flex items-center gap-2 px-4 py-2 w-full theme-hover text-left rounded-lg transition-all duration-200 conversation-selected border-l-2 border-blue-500" },
+                    React.createElement(File, { size: 16, className: "text-gray-400 flex-shrink-0" }),
+                    React.createElement("div", { className: "flex flex-col overflow-hidden" },
+                        React.createElement("span", { className: "text-sm truncate" }, activeConversation.title || activeConversation.id),
+                        React.createElement("span", { className: "text-xs text-gray-500" }, activeConversation.timestamp
+                            ? new Date(activeConversation.timestamp).toLocaleString()
+                            : "")))))));
+    }
+    return (React.createElement("div", { className: "mt-4" },
+        header,
+        React.createElement("div", { className: "px-1" }, convArray.map((conv, index) => {
+            const isSelected = selected?.has(conv.id);
+            const isActive = conv.id === activeConversationId && !currentFile;
+            return (React.createElement("button", { key: conv.id, draggable: "true", onDragStart: (e) => {
+                    e.dataTransfer.effectAllowed = "copyMove";
+                    onConversationDragStart?.(e, conv);
+                }, onDragEnd: (e) => onConversationDragEnd?.(e, conv), onClick: (e) => {
+                    if (e.ctrlKey || e.metaKey) {
+                        const next = new Set(selected || new Set());
+                        if (next.has(conv.id))
+                            next.delete(conv.id);
+                        else
+                            next.add(conv.id);
+                        setSelected(next);
+                        setLastIndex(index);
+                    }
+                    else if (e.shiftKey && lastIndex !== null) {
+                        const next = new Set();
+                        const start = Math.min(lastIndex, index);
+                        const end = Math.max(lastIndex, index);
+                        for (let i = start; i <= end; i++) {
+                            if (convArray[i])
+                                next.add(convArray[i].id);
+                        }
+                        setSelected(next);
+                    }
+                    else {
+                        setSelected(new Set([conv.id]));
+                        onConversationSelect?.(conv.id);
+                        setLastIndex(index);
+                    }
+                }, onContextMenu: (e) => {
+                    e.preventDefault();
+                    if (!selected?.has(conv.id)) {
+                        const next = new Set([conv.id]);
+                        setSelected(next);
+                    }
+                    onConversationContextMenu?.({ x: e.clientX, y: e.clientY });
+                }, className: cn("flex items-center gap-2 px-4 py-2 w-full theme-hover text-left rounded-lg transition-all duration-200", isSelected || isActive ? "conversation-selected" : "theme-text-primary", isActive ? "border-l-2 border-blue-500" : "") },
+                React.createElement(File, { size: 16, className: "text-gray-400 flex-shrink-0" }),
+                React.createElement("div", { className: "flex flex-col overflow-hidden" },
+                    React.createElement("span", { className: "text-sm truncate" }, conv.title || conv.id),
+                    React.createElement("span", { className: "text-xs text-gray-500" }, conv.timestamp
+                        ? new Date(conv.timestamp).toLocaleString()
+                        : ""))));
+        }))));
+};

package/dist/ui/chat/components/InPaneSearchBar.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+interface Props {
+    searchTerm: string;
+    onSearchTermChange: (value: string) => void;
+    onNext: () => void;
+    onPrevious: () => void;
+    onClose: () => void;
+    resultCount: number;
+    currentIndex: number;
+}
+export declare const InPaneSearchBar: React.FC<Props>;
+export {};

package/dist/ui/chat/components/InPaneSearchBar.js

@@ -0,0 +1,44 @@
+import React, { useEffect, useRef, useState } from "react";
+import { ChevronLeft, ChevronRight, X } from "lucide-react";
+export const InPaneSearchBar = ({ searchTerm, onSearchTermChange, onNext, onPrevious, onClose, resultCount, currentIndex, }) => {
+    const inputRef = useRef(null);
+    const [localInputTerm, setLocalInputTerm] = useState(searchTerm);
+    useEffect(() => {
+        if (inputRef.current) {
+            inputRef.current.focus();
+            inputRef.current.setSelectionRange(localInputTerm.length, localInputTerm.length);
+        }
+    }, [localInputTerm]);
+    useEffect(() => {
+        if (localInputTerm !== searchTerm) {
+            setLocalInputTerm(searchTerm);
+        }
+    }, [searchTerm, localInputTerm]);
+    const handleKeyDown = (e) => {
+        if (e.key === "Enter") {
+            e.preventDefault();
+            if (e.shiftKey) {
+                onPrevious();
+            }
+            else {
+                onNext();
+            }
+        }
+        if (e.key === "Escape") {
+            onClose();
+        }
+    };
+    return (React.createElement("div", { className: "flex items-center gap-2 w-full theme-bg-tertiary p-2 rounded-lg" },
+        React.createElement("input", { ref: inputRef, type: "text", value: localInputTerm, onChange: (e) => {
+                setLocalInputTerm(e.target.value);
+                onSearchTermChange(e.target.value);
+            }, className: "flex-1 theme-input text-xs rounded px-3 py-2 border-0 focus:ring-1 focus:ring-blue-500", placeholder: "Search messages...", onKeyDown: handleKeyDown }),
+        React.createElement("span", { className: "text-xs theme-text-muted min-w-[60px] text-center" }, resultCount > 0 ? `${currentIndex + 1} of ${resultCount}` : "No results"),
+        React.createElement("div", { className: "flex items-center gap-1" },
+            React.createElement("button", { onClick: onPrevious, disabled: resultCount === 0, className: "p-2 theme-hover rounded disabled:opacity-50", title: "Previous (Shift+Enter)" },
+                React.createElement(ChevronLeft, { size: 14 })),
+            React.createElement("button", { onClick: onNext, disabled: resultCount === 0, className: "p-2 theme-hover rounded disabled:opacity-50", title: "Next (Enter)" },
+                React.createElement(ChevronRight, { size: 14 })),
+            React.createElement("button", { onClick: onClose, className: "p-2 theme-hover rounded text-red-400", title: "Close search (Escape)" },
+                React.createElement(X, { size: 14 })))));
+};

package/dist/ui/chat/components/InputArea.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { ModelInfo } from "../../../core/types";
+interface Props {
+    models?: ModelInfo[];
+}
+export declare const InputArea: React.FC<Props>;
+export {};

package/dist/ui/chat/components/InputArea.js

@@ -0,0 +1,46 @@
+import React, { useMemo, useRef, useState } from "react";
+import { useChatContext } from "../context/ChatContext";
+export const InputArea = ({ models }) => {
+    const { send, streaming, attachments, setAttachments } = useChatContext();
+    const [value, setValue] = useState("");
+    const [selectedModelId, setSelectedModelId] = useState(models?.[0]?.id);
+    const fileInputRef = useRef(null);
+    const selectedModel = useMemo(() => models?.find((m) => m.id === selectedModelId) ?? selectedModelId ?? "", [models, selectedModelId]);
+    const onSend = async () => {
+        if (!value.trim())
+            return;
+        await send({
+            prompt: value,
+            model: selectedModel || "",
+            attachments,
+            stream: true,
+        });
+        setValue("");
+        setAttachments([]);
+    };
+    return (React.createElement("div", { className: "border-t theme-border p-3 space-y-2 theme-bg-tertiary" },
+        React.createElement("div", { className: "flex items-center gap-2" },
+            models?.length ? (React.createElement("select", { value: selectedModelId, onChange: (e) => setSelectedModelId(e.target.value), className: "text-xs px-2 py-1 rounded theme-input bg-transparent" }, models.map((m) => (React.createElement("option", { key: m.id, value: m.id }, m.displayName || m.id))))) : null,
+            React.createElement("button", { className: "px-2 py-1 text-xs theme-button theme-hover rounded", onClick: () => fileInputRef.current?.click() }, "Attach"),
+            React.createElement("input", { ref: fileInputRef, type: "file", multiple: true, onChange: (e) => {
+                    const files = e.target.files;
+                    if (!files)
+                        return;
+                    const next = Array.from(files).map((f) => ({
+                        id: `${f.name}-${f.size}-${f.lastModified}`,
+                        name: f.name,
+                        path: f.path || f.name,
+                        sizeBytes: f.size,
+                    }));
+                    setAttachments((prev) => [...prev, ...next]);
+                    e.target.value = "";
+                }, className: "hidden" }),
+            attachments.length > 0 && (React.createElement("div", { className: "text-[11px] theme-text-muted" },
+                attachments.length,
+                " file",
+                attachments.length > 1 ? "s" : "",
+                " attached"))),
+        React.createElement("textarea", { value: value, onChange: (e) => setValue(e.target.value), placeholder: streaming ? "Streaming response..." : "Type a message or drop files...", rows: 3, className: `chat-input-textarea w-full theme-input text-sm rounded-lg pl-4 pr-20 py-3 focus:outline-none border-0 resize-none ${streaming ? "opacity-70 cursor-not-allowed" : ""}`, disabled: streaming }),
+        React.createElement("div", { className: "flex items-center gap-2 justify-end" },
+            React.createElement("button", { onClick: onSend, disabled: streaming || !value.trim(), className: "px-3 py-1.5 rounded theme-button-primary text-sm font-semibold disabled:opacity-50" }, streaming ? "Sending..." : "Send"))));
+};

package/dist/ui/chat/components/MessageAttachments.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import type { Attachment } from "../../../core/types";
+export declare const AttachmentList: React.FC<{
+    attachments: Attachment[];
+}>;

package/dist/ui/chat/components/MessageAttachments.js

@@ -0,0 +1,6 @@
+import React from "react";
+export const AttachmentList = ({ attachments }) => {
+    if (!attachments.length)
+        return null;
+    return (React.createElement("div", { className: "flex flex-wrap gap-2 text-xs text-gray-600 dark:text-gray-300" }, attachments.map((att) => (React.createElement("a", { key: att.id, href: att.path, className: "px-2 py-1 rounded bg-gray-200 dark:bg-gray-700 hover:underline", target: "_blank", rel: "noreferrer" }, att.name)))));
+};

package/dist/ui/chat/components/MessageItem.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+type Message = {
+    id?: string;
+    timestamp?: string;
+    role: string;
+    content?: string;
+    npc?: string;
+    model?: string;
+    isStreaming?: boolean;
+    type?: string;
+    attachments?: any[];
+    tool_calls?: any[];
+    tool_use_history?: any[];
+};
+interface Props {
+    message: Message;
+    isSelected: boolean;
+    messageSelectionMode: boolean;
+    toggleMessageSelection: (id: string) => void;
+    handleMessageContextMenu: (e: React.MouseEvent, id: string) => void;
+    searchTerm: string;
+    isCurrentSearchResult: boolean;
+    onResendMessage?: (m: Message) => void;
+    onCreateBranch?: (idx: number) => void;
+    messageIndex: number;
+}
+export declare const MessageItem: React.FC<Props>;
+export {};