@eslamdevui/ui
Version:
A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.
127 lines (126 loc) • 3.71 kB
TypeScript
import type { AppConfig } from '@nuxt/schema';
import type { ComponentConfig } from '../types/utils';
import theme from '#build/ui/chat-message';
import type { AvatarProps, ButtonProps } from '../types';
export type ChatMessage = ComponentConfig<typeof theme, AppConfig, 'chatMessage'>;
export interface ChatMessageProps {
/**
* The element or component this component should render as.
* @defaultValue 'article'
*/
as?: any;
/**
* A unique identifier for the message.
*/
id?: string;
/**
* Text content of the message. Use parts when possible.
*/
content?: string;
/**
* The 'data' role is deprecated.
*/
role?: 'data' | 'user' | 'system' | 'assistant';
/**
* Icon to display next to the message.
*/
icon?: string;
/**
* Avatar to display next to the message.
*/
avatar?: AvatarProps & {
[key: string]: any;
};
/**
* @defaultValue 'naked'
*/
variant?: 'solid' | 'outline' | 'soft' | 'subtle' | 'naked';
/**
* @defaultValue 'left'
*/
side?: 'right' | 'left';
/**
* Display a list of actions under the message. The label will be used in a tooltip. { size: 'xs', color: 'neutral', variant: 'ghost' }
*/
actions?: (Omit<ButtonProps, 'onClick'> & {
onClick?: ((e: MouseEvent, message: any) => void) | undefined;
})[];
/**
* Render the message in a compact style. This is done automatically when used inside a UChatPalette.
* @defaultValue false
*/
compact?: boolean;
/**
* The timestamp of the message.
*/
createdAt?: Date;
/**
* Reasoning for the message.
*/
reasoning?: string;
/**
* Additional attachments to be sent along with the message.
*/
experimentalAttachments?: any[];
/**
* For data messages.
*/
data?: null | string | number | false | true | {
[value: string]: any;
} | any[];
/**
* Additional message-specific information added on the server via StreamData
*/
annotations?: any[];
/**
* Tool invocations (that can be tool calls or tool results, depending on whether or not the invocation has finished) that the assistant made as part of this message.
*/
toolInvocations?: any[];
/**
* The parts of the message. Use this for rendering the message in the UI.
*/
parts?: any[];
class?: any;
ui?: ChatMessage['slots'];
}
export interface ChatMessageSlots {
leading(props?: {
avatar: (AvatarProps & {
[key: string]: any;
}) | undefined;
}): any;
content(props?: {
content: string;
}): any;
actions(props?: {
actions: (Omit<ButtonProps, 'onClick'> & {
onClick?: ((e: MouseEvent, message: any) => void) | undefined;
})[] | undefined;
}): any;
}
declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ChatMessageProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ChatMessageProps> & Readonly<{}>, {
as: any;
variant: "solid" | "outline" | "soft" | "subtle" | "naked";
side: "right" | "left";
compact: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
leading?: (props: {
avatar: any;
}) => any;
} & {
content?: (props: {
content: any;
}) => any;
} & {
default?: (props: {}) => any;
} & {
actions?: (props: {
actions: any;
}) => any;
}>;
export default _default;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};