Activity message¶

Usage¶

Use activity messages to make multi-step AI activity transparent without exposing every internal event. Show one message for each user-relevant step or phase and arrange related messages in execution order.

• Use a concise heading that describes the activity.
• Set state to running or failed; omit it for a completed activity.
• Set icon to customize the completed activity marker. It defaults to element-record-filled.
• Project optional details such as Markdown, metadata, or tool output into the component. Users can expand and collapse this content from the activity header.
• Use expanded to control the initial disclosure state or to synchronize it with application state.

Avoid using activity messages for low-level implementation details that do not help users understand the AI's progress or result. Always provide activity message content so the disclosure control reveals useful details.

Choose icons based on the activity:

• Reasoning: element-self-learning
• Retrieval: element-search
• Computation: element-function
• Generation: element-generate
• System action: element-settings
• Workflow: element-maintenance
• Read: element-document
• Summary: element-checked
• Generic: use the default icon

Activity trace¶

Use si-activity-trace to group multiple related activity messages under a shared, collapsible heading.

Activity message¶

Use si-activity-message for an individual activity. It has a heading, an optional icon, and collapsible content, and can communicate running and failed states. Content can be added directly or organized into parts.

Activity messages can be used without a trace. Nesting activity messages is optional and should be reserved for niche, advanced cases where a step has meaningful intermediate activities.

Activity message part¶

Use si-activity-message-part only when an activity needs multiple titled parts. Parts are optional and can be made collapsible independently. Use either one input and one output part, or one part per input and one combined output part. If an input is short and fits on one line, use only the part heading, omit its content, and keep the part non-collapsible.

Code¶

SiActivityTraceComponent API Documentation¶

Collapsible container for grouping multiple activity messages.

Input Properties¶

Name	Type	Default	Description
expanded ¶	boolean	false	Whether the trace content is expanded.
heading ¶	TranslatableString		Trace heading.

Output Properties¶

SiActivityMessageComponent API Documentation¶

Collapsible activity message for displaying progress and intermediate steps in a chat.

Input Properties¶

Name	Type	Default	Description
expanded ¶	boolean	false	Whether the activity details are expanded.
heading ¶	TranslatableString		Activity heading.
icon ¶	string		Activity icon.
state ¶	("failed" | "running")		Current state of the activity.

Output Properties¶

SiActivityMessagePartComponent API Documentation¶

Titled content part for use inside an activity message.

Input Properties¶

Name	Type	Default	Description
collapsible ¶	boolean	false	Whether the part can be collapsed and expanded.
expanded ¶	boolean	true	Whether collapsible content is expanded.
heading ¶	TranslatableString		Part heading.

Output Properties¶