Chat API
Chat components and types from @myco-dev/sdk/chat.
ChatPage
import { ChatPage } from "@myco-dev/sdk/chat";Full chat experience component with message list, composer, file upload, and conversation starters.
Props: ChatPageProps
| Prop | Type | Required | Description |
|---|---|---|---|
myco | MycoSDK | Yes | SDK instance |
session | { user: { id, name, email } } | null | Yes | Current user session |
chatId | string | null | No | Load an existing chat |
setChatId | (id: string) => void | No | Callback when a new chat is created |
onError | (error: Error) => void | No | Error handler |
onCopySuccess | () => void | No | Callback on successful copy |
onCopyError | (error: unknown) => void | No | Callback on copy failure |
conversationStarters | Array<{ label: string; message: string }> | No | Suggested prompts |
components | ChatComponents | No | Custom component overrides |
beforeComposer | ReactNode | No | Content above the input |
composerPlaceholder | string | No | Input placeholder text |
className | string | No | CSS class |
Example
import { ChatPage } from "@myco-dev/sdk/chat";
import { useAuth } from "@myco-dev/sdk/auth";
import { myco } from "@/lib/myco";
function MyChatPage() {
const { user } = useAuth();
return (
<ChatPage
myco={myco}
session={user ? { user: { id: user.id, name: user.name, email: user.email } } : null}
conversationStarters={[
{ label: "Help me", message: "What can you help me with?" },
]}
onError={(err) => console.error(err)}
/>
);
}getToolIcon
import { getToolIcon } from "@myco-dev/sdk/chat";Returns an icon component for a given tool name. Always returns a valid component (falls back to a default icon).
function getToolIcon(toolName: string): React.ComponentTypeChatComponents
Custom component overrides for ChatPage:
interface ChatComponents {
Loading?: React.ComponentType;
Message?: React.ComponentType<MessageSlotProps>;
ToolCall?: React.ComponentType<ToolCallSlotProps>;
Composer?: React.ComponentType<ComposerSlotProps>;
Greeting?: React.ComponentType<GreetingSlotProps>;
}Slot props
MessageSlotProps
Props passed to custom message components.
ToolCallSlotProps
Props passed to custom tool call display components.
ComposerSlotProps
Props passed to custom composer components.
GreetingSlotProps
Props passed to custom greeting/empty state components.
Types
import type { Chat, ChatMessage } from "@myco-dev/sdk/chat";Chat
Represents a chat conversation.
ChatMessage
Represents a single message in a chat.
These types are derived from the Myco backend schema.