Skip to content
Chat

ChatToolCalls

Tool/function call display from an LLM response.

ChatToolCalls

Displays tool/function call invocations from an LLM response. A single call renders inline; two or more collapse into an expandable summary group.

Examples

Default

There is no @var-ui/astro ChatToolCalls — Astro and HTML show a static collapsed group; expand/collapse is React-only.

Demo.tsxtsx
import { ChatToolCalls } from '@var-ui/react';

<ChatToolCalls
  calls={[
    { name: 'read_file', status: 'complete', target: 'App.tsx', duration: '0.3s' },
    { name: 'run_tests', status: 'complete', resultDetail: <span>42 passed</span> },
  ]}
/>

ChatToolCallItem

FieldTypeDefault
namestring(required)
status'pending' | 'running' | 'complete' | 'error''complete'
targetstring
durationstring
resultDetailReactNode

Props

Accessibility

Expandable groups use aria-expanded on the toggle button.