@vibe-forge/tsconfigs 0.7.2 → 0.9.0

package/dist/apps/client/src/components/chat/messages/MessageItem.d.ts

@@ -0,0 +1,10 @@
+import './MessageItem.scss';
+import type { ChatMessage } from '@vibe-forge/core';
+import React from 'react';
+interface MessageItemProps {
+    msg: ChatMessage;
+    isFirstInGroup: boolean;
+}
+declare function MessageItemComponent({ msg, isFirstInGroup }: MessageItemProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const MessageItem: React.MemoExoticComponent<typeof MessageItemComponent>;
+export {};

package/dist/apps/client/src/components/chat/messages/MessageItem.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './MessageItem.scss';
+import { MarkdownContent } from '#~/components/MarkdownContent';
+import React from 'react';
+import { ToolRenderer } from '../tools/core/ToolRenderer';
+import { MessageFooter } from './MessageFooter';
+function MessageItemComponent({ msg, isFirstInGroup }) {
+    const isUser = msg.role === 'user';
+    const renderContent = () => {
+        if (msg.content == null)
+            return null;
+        if (typeof msg.content === 'string') {
+            return (_jsx(MarkdownContent, { content: msg.content }));
+        }
+        if (!Array.isArray(msg.content))
+            return null;
+        const hasContent = msg.content.some((c) => c.type === 'text' || c.type === 'image') ||
+            msg.toolCall != null;
+        if (!hasContent)
+            return null;
+        return (_jsxs("div", { className: 'message-contents', children: [msg.content.map((item, i) => {
+                    if (item.type === 'text') {
+                        return (_jsx(MarkdownContent, { content: item.text }, i));
+                    }
+                    if (item.type === 'image') {
+                        return (_jsx("a", { className: 'message-image', href: item.url, target: '_blank', rel: 'noreferrer', children: _jsx("img", { src: item.url, alt: item.name ?? 'image' }) }, i));
+                    }
+                    return null;
+                }), msg.toolCall != null && (_jsx(ToolRenderer, { item: {
+                        type: 'tool_use',
+                        id: msg.toolCall.id ?? 'legacy',
+                        name: msg.toolCall.name,
+                        input: msg.toolCall.args
+                    }, resultItem: msg.toolCall.output != null
+                        ? {
+                            type: 'tool_result',
+                            tool_use_id: msg.toolCall.id ?? 'legacy',
+                            content: msg.toolCall.output,
+                            is_error: msg.toolCall.status === 'error'
+                        }
+                        : undefined }))] }));
+    };
+    const content = renderContent();
+    if (content == null)
+        return null;
+    return (_jsx("div", { className: `${isUser ? 'chat-message-user' : 'chat-message-assistant'} ${!isFirstInGroup ? 'consecutive' : ''}`, children: _jsxs("div", { className: 'message-body-container', children: [_jsx("div", { className: 'bubble', children: content }), _jsx(MessageFooter, { msg: msg, isUser: isUser })] }) }));
+}
+const areMessageItemPropsEqual = (prev, next) => {
+    return prev.isFirstInGroup === next.isFirstInGroup &&
+        prev.msg.id === next.msg.id &&
+        prev.msg.role === next.msg.role &&
+        prev.msg.createdAt === next.msg.createdAt &&
+        prev.msg.model === next.msg.model &&
+        prev.msg.content === next.msg.content &&
+        prev.msg.toolCall === next.msg.toolCall &&
+        prev.msg.usage === next.msg.usage;
+};
+export const MessageItem = React.memo(MessageItemComponent, areMessageItemPropsEqual);

package/dist/apps/client/src/components/chat/messages/message-utils.d.ts

@@ -0,0 +1,26 @@
+import type { ChatMessage, ChatMessageContent } from '@vibe-forge/core';
+export interface ToolGroupItem {
+    type: 'tool-group';
+    id: string;
+    items: {
+        item: Extract<ChatMessageContent, {
+            type: 'tool_use';
+        }>;
+        resultItem?: Extract<ChatMessageContent, {
+            type: 'tool_result';
+        }>;
+    }[];
+    footer?: {
+        model?: string;
+        usage?: ChatMessage['usage'];
+        createdAt: number;
+        originalMessage: ChatMessage;
+    };
+}
+export interface MessageRenderItem {
+    type: 'message';
+    message: ChatMessage;
+    isFirstInGroup: boolean;
+}
+export type ChatRenderItem = MessageRenderItem | ToolGroupItem;
+export declare function processMessages(messages: ChatMessage[]): ChatRenderItem[];

package/dist/apps/client/src/components/chat/messages/message-utils.js

@@ -0,0 +1,124 @@
+export function processMessages(messages) {
+    const result = [];
+    const findResult = (toolId, startIndex, allMsgs) => {
+        for (let i = startIndex; i < allMsgs.length; i++) {
+            const msg = allMsgs[i];
+            if (Array.isArray(msg.content)) {
+                const found = msg.content.find((c) => c.type === 'tool_result' && c.tool_use_id === toolId);
+                if (found) {
+                    return found;
+                }
+            }
+        }
+        return undefined;
+    };
+    let i = 0;
+    while (i < messages.length) {
+        const msg = messages[i];
+        if (!msg || !msg.content) {
+            // If content is null/empty but legacy toolCall exists, we should render it
+            if (msg && msg.toolCall) {
+                result.push({
+                    type: 'message',
+                    message: msg,
+                    isFirstInGroup: i === 0 || (i > 0 && messages[i - 1]?.role !== msg.role)
+                });
+            }
+            i++;
+            continue;
+        }
+        const prevMsg = i > 0 ? messages[i - 1] : null;
+        const isFirstInGroup = i === 0 || (prevMsg != null && prevMsg.role !== msg.role);
+        if (typeof msg.content === 'string') {
+            result.push({
+                type: 'message',
+                message: msg,
+                isFirstInGroup
+            });
+            i++;
+            continue;
+        }
+        if (Array.isArray(msg.content)) {
+            const content = msg.content;
+            const textParts = [];
+            let currentToolGroup = [];
+            let producedCount = 0;
+            const flushTools = () => {
+                if (currentToolGroup.length > 0) {
+                    result.push({
+                        type: 'tool-group',
+                        id: `group-${msg.id}-${producedCount}`,
+                        items: [...currentToolGroup],
+                        footer: undefined
+                    });
+                    currentToolGroup = [];
+                    producedCount++;
+                }
+            };
+            const flushText = () => {
+                if (textParts.length > 0) {
+                    result.push({
+                        type: 'message',
+                        message: {
+                            ...msg,
+                            id: `${msg.id}-text-${producedCount}`,
+                            content: [...textParts]
+                        },
+                        isFirstInGroup: isFirstInGroup && producedCount === 0
+                    });
+                    textParts.length = 0;
+                    producedCount++;
+                }
+            };
+            for (const item of content) {
+                if (item.type === 'text' || item.type === 'image') {
+                    flushTools();
+                    textParts.push(item);
+                }
+                else if (item.type === 'tool_use') {
+                    flushText();
+                    const resultItem = findResult(item.id, i, messages);
+                    currentToolGroup.push({ item, resultItem });
+                }
+            }
+            flushText();
+            flushTools();
+            // Handle legacy toolCall if no other content was produced
+            if (producedCount === 0 && msg.toolCall) {
+                result.push({
+                    type: 'message',
+                    message: msg,
+                    isFirstInGroup
+                });
+                producedCount++;
+            }
+            if (producedCount > 0) {
+                const lastItem = result[result.length - 1];
+                if (lastItem.type === 'tool-group') {
+                    lastItem.footer = {
+                        model: msg.model,
+                        usage: msg.usage,
+                        createdAt: msg.createdAt,
+                        originalMessage: msg
+                    };
+                }
+            }
+        }
+        i++;
+    }
+    const mergedResult = [];
+    for (const item of result) {
+        if (item.type === 'tool-group') {
+            const prev = mergedResult[mergedResult.length - 1];
+            if (prev && prev.type === 'tool-group') {
+                prev.items.push(...item.items);
+                if (item.footer) {
+                    prev.footer = item.footer;
+                }
+                continue;
+            }
+        }
+        mergedResult.push(item);
+    }
+    return mergedResult;
+}

package/dist/apps/client/src/components/chat/sender/CompletionMenu.d.ts

@@ -0,0 +1,15 @@
+import './CompletionMenu.scss';
+export interface CompletionItem {
+    label: string;
+    value: string;
+    description?: string;
+    icon?: string;
+}
+interface CompletionMenuProps {
+    items: CompletionItem[];
+    onSelect: (item: CompletionItem) => void;
+    onClose: () => void;
+    selectedIndex: number;
+}
+export declare function CompletionMenu({ items, onSelect, selectedIndex }: CompletionMenuProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/apps/client/src/components/chat/sender/CompletionMenu.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './CompletionMenu.scss';
+import { useEffect, useRef } from 'react';
+export function CompletionMenu({ items, onSelect, selectedIndex }) {
+    const menuRef = useRef(null);
+    useEffect(() => {
+        const activeItem = menuRef.current?.querySelector('.active');
+        if (activeItem) {
+            activeItem.scrollIntoView({ block: 'nearest' });
+        }
+    }, [selectedIndex]);
+    if (items.length === 0)
+        return null;
+    return (_jsx("div", { ref: menuRef, className: 'completion-menu', children: _jsx("div", { className: 'completion-menu-content', children: items.map((item, index) => (_jsxs("div", { className: `completion-item ${index === selectedIndex ? 'active' : ''}`, onClick: () => onSelect(item), children: [item.icon != null && item.icon !== '' &&
+                        _jsx("span", { className: 'material-symbols-rounded icon', children: item.icon }), _jsxs("div", { className: 'item-info', children: [_jsx("span", { className: 'label', children: item.label }), item.description != null && item.description !== '' &&
+                                _jsx("span", { className: 'description', children: item.description })] })] }, item.value))) }) }));
+}

package/dist/apps/client/src/components/chat/sender/Sender.d.ts

@@ -0,0 +1,49 @@
+import './Sender.scss';
+import React from 'react';
+import type { PermissionMode } from '#~/hooks/chat/use-chat-permission-mode';
+import type { SessionInfo } from '@vibe-forge/types';
+import type { AskUserQuestionParams, ChatMessageContent, SessionStatus } from '@vibe-forge/core';
+interface ModelSelectOption {
+    value: string;
+    label: React.ReactNode;
+    searchText: string;
+    displayLabel: string;
+}
+interface ModelSelectGroup {
+    label: React.ReactNode;
+    options: ModelSelectOption[];
+}
+export declare function Sender({ onSend, onSendContent, adapterLocked, sessionStatus, onInterrupt, onClear, sessionInfo, connectionError, onRetryConnection, interactionRequest, onInteractionResponse, placeholder, modelOptions, selectedModel, onModelChange, permissionMode, permissionModeOptions, onPermissionModeChange, selectedAdapter, adapterOptions, onAdapterChange, modelUnavailable }: {
+    onSend: (text: string) => void;
+    onSendContent: (content: ChatMessageContent[]) => void;
+    adapterLocked?: boolean;
+    sessionStatus?: SessionStatus;
+    onInterrupt: () => void;
+    onClear?: () => void;
+    sessionInfo?: SessionInfo | null;
+    connectionError?: string | null;
+    onRetryConnection?: () => void;
+    interactionRequest?: {
+        id: string;
+        payload: AskUserQuestionParams;
+    } | null;
+    onInteractionResponse?: (id: string, data: string | string[]) => void;
+    placeholder?: string;
+    modelOptions?: ModelSelectGroup[];
+    selectedModel?: string;
+    onModelChange?: (model: string) => void;
+    permissionMode: PermissionMode;
+    permissionModeOptions: Array<{
+        value: PermissionMode;
+        label: React.ReactNode;
+    }>;
+    onPermissionModeChange: (mode: PermissionMode) => void;
+    selectedAdapter?: string;
+    adapterOptions?: Array<{
+        value: string;
+        label: React.ReactNode;
+    }>;
+    onAdapterChange?: (adapter: string) => void;
+    modelUnavailable?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export {};