import type React from 'react'; import type { StreamEndDetail } from './types.js'; export interface MessagePartRef extends HTMLElement { /** Initializes the streaming Markdown parser. */ startStream(): Promise; /** Appends a Markdown token chunk to the active stream. */ appendTokens(text: string): void; /** Finalizes and sanitizes the active stream. */ endStream(): Promise; } /** * In React, reach the imperative methods through a ref: * `const api = useRef(null)`, pass `ref={api}`, then `api.current?.startStream()`. * Available: startStream(), appendTokens(), endStream(). * * @csspart arguments, attachment, base, description, header, preview-frame, result, status, thinking, tool-name */ export interface MessagePartOwnProps { /** * Unique identifier for the element. * @example 'example-id' */ id?: string; /** * Part type: text, tool-call, tool-result, attachment, or markdown. Allowed values: `text`, `tool-call`, `tool-result`, `thinking`, `code-block`, `error`, `preview`. * @example 'text' */ kind?: 'text' | 'tool-call' | 'tool-result' | 'thinking' | 'code-block' | 'error' | 'preview'; /** * Visual connection style to adjacent parts (none, top, middle, bottom). Allowed values: `standalone`, `first`, `middle`, `last`. * @example 'standalone' */ connection?: 'standalone' | 'first' | 'middle' | 'last'; /** * Component size. Allowed values: `xs`, `sm`, `md`, `lg`, `xl`. * @example 'xs' */ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'; /** * Text content to display. * @example 'Example content' */ content?: string; /** * Pre-rendered HTML content injected into Shadow DOM. * @example 'example' */ htmlContent?: string; /** * Name of the tool being called (for tool-call parts). * @example 'example' */ toolName?: string; /** * JSON string of arguments passed to the tool call. * @example 'example' */ toolArguments?: string; /** * Execution status of the tool call (running, complete, error). Allowed values: `pending`, `success`, `error`. * @example 'pending' */ toolStatus?: 'pending' | 'success' | 'error'; /** * Pre-rendered HTML for a tool action button (e.g. approve, retry). Allowed values: `generic`, `read`, `write`, `edit`, `delete`, `search`. * @example 'generic' */ toolAction?: 'generic' | 'read' | 'write' | 'edit' | 'delete' | 'search'; /** * Description text for tool calls or attachments. * @example 'Additional context' */ description?: string; /** * Whether the part can be collapsed. * @defaultValue false * @example true */ collapsible?: boolean; /** * Whether the tool call or operation has finished. * @defaultValue false * @example true */ completed?: boolean; /** * Border treatment. `auto` follows the variant; `none` removes it; `subtle` renders a lighter rule. Allowed values: `auto`, `none`, `subtle`. * @example 'auto' */ border?: 'auto' | 'none' | 'subtle'; /** * Label text for the collapsible thinking section header. * @example 'example' */ thinkingLabel?: string; /** * Programming language for syntax-highlighted code parts. * @example 'example' */ language?: string; /** * Name of the file displayed in the header. * @example 'example.rs' */ filename?: string; /** * Whether to render content as Markdown. * @defaultValue false * @example true */ markdown?: boolean; /** * Emits `` elements for Shadow DOM content projection. * @defaultValue false * @example true */ slotted?: boolean; /** * Filename of the attachment. * @example 'example' */ attachmentName?: string; /** * Human-readable file size string (e.g. "2.4 MB"). * @example 1 */ attachmentSize?: number; /** * MIME type of the attachment. * @example 'example' */ attachmentType?: string; /** * URL for the attachment thumbnail image. * @example 'example' */ attachmentThumbnail?: string; /** * When present, enables imperative streaming mode: the streaming parser owns the DOM (via startStream/appendTokens/endStream) and WASM re-render is suppressed. Fires `cx-stream-end` when finalized. * @defaultValue false * @example true */ stream?: boolean; /** * Fires after streamed content is finalized and sanitized. Detail: `StreamEndDetail`. * @example (event) => console.log(event.detail) */ onStreamEnd?: (event: CustomEvent) => void; /** CSS class applied to the Custom Element host. * @example 'my-component' */ className?: string; /** Inline styles applied to the Custom Element host. * @example { marginTop: 8 } */ style?: React.CSSProperties; } /** * Props for ``: the component's own API plus every standard DOM * attribute and native React event handler, forwarded verbatim to the * `` host — `id`, `data-*`, `aria-*`, `title`, `tabIndex`, * `slot`, `onMouseEnter`, and the rest. Own props always win over a * same-named DOM attribute. */ export type MessagePartProps = MessagePartOwnProps & Omit, keyof MessagePartOwnProps | 'children' | 'dangerouslySetInnerHTML'>; export declare const MessagePart: React.ForwardRefExoticComponent, "children" | "dangerouslySetInnerHTML" | keyof MessagePartOwnProps> & React.RefAttributes>;