ActionIcon
Icon component for tool action types
ActionIcon renders the appropriate icon for a given action type. It maps Claude's tool calls to visual icons for better UX in tool call displays.
All Action Icons
Command Run
File Read
File Edit
File Write
Search
Glob
Web Fetch
Web Search
MCP Tool
Generic
Import
import
import { ActionIcon } from '@ash-cloud/ash-ui';Usage
ToolHeader.tsx
import { ActionIcon } from '@ash-cloud/ash-ui';
function ToolHeader({ toolCall }) {
return (
<div className="flex items-center gap-2">
<ActionIcon actionType={toolCall.actionType} />
<span>{toolCall.toolName}</span>
</div>
);
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
| actionType | ActionType | required | The action type to show icon for |
| className | string | undefined | Additional CSS classes |
Action Type Mapping
| Action Type | Icon | Description |
|---|---|---|
| command_run | Bash commands | |
| file_read | Reading files | |
| file_edit | Editing files | |
| file_write | Creating files | |
| search | Code search | |
| glob | File patterns | |
| web_fetch | HTTP requests | |
| web_search | Web searches | |
| mcp_tool | MCP server tools | |
| generic | Other tools |