Tool

Overview

Tool renders a tool call from the AI SDK tool-* parts. The header names the tool and carries a tonal status pill (pending → running → completed / error); the collapsible body shows the JSON input and the output — or an error on the error tone — through CodeBlock.

Parameters

Result

$ npx morpha-ui add tool

Examples

States

The status pill reflects every point in the tool lifecycle.

Usage with the AI SDK

{message.parts.map((part, i) =>
  part.type.startsWith("tool-") ? (
    <Tool key={i}>
      <ToolHeader type={part.type} state={part.state} />
      <ToolContent>
        <ToolInput input={part.input} />
        <ToolOutput output={part.output} errorText={part.errorText} />
      </ToolContent>
    </Tool>
  ) : null,
)}

Installation

Distributed via the Morpha CLI: npx morpha-ui add tool. Ported from AI Elements onto the kit's Collapsible + CodeBlock.

npx morpha-ui add tool

API Reference

Prop

Type