{
	"$schema": "https://ui.shadcn.com/schema/registry-item.json",
	"name": "tool-invocation-demo",
	"type": "registry:example",
	"files": [
		{
			"path": "./src/registry/examples/tool-invocation-demo.tsx",
			"content": "\"use client\";\n\nimport type { UIMessage } from \"@ai-sdk/react\";\nimport type { InferUITools } from \"ai\";\nimport { tool } from \"ai\";\nimport z from \"zod\";\nimport {\n\tChatMessage,\n\tChatMessageAuthor,\n\tChatMessageAvatar,\n\tChatMessageAvatarFallback,\n\tChatMessageAvatarImage,\n\tChatMessageContainer,\n\tChatMessageContent,\n\tChatMessageHeader,\n\tChatMessageMarkdown,\n\tChatMessageTimestamp,\n} from \"@/registry/ui/chat-message\";\nimport {\n\tChatMessageArea,\n\tChatMessageAreaContent,\n\tChatMessageAreaScrollButton,\n} from \"@/registry/ui/chat-message-area\";\nimport {\n\tToolInvocation,\n\tToolInvocationContentCollapsible,\n\tToolInvocationHeader,\n\tToolInvocationName,\n\tToolInvocationRawData,\n} from \"@/registry/ui/tool-invocation\";\n\nconst searchDatabaseTool = tool({\n\tname: \"search-database\",\n\tdescription: \"Search the database for information\",\n\tinputSchema: z.object({\n\t\tquery: z.string(),\n\t}),\n\toutputSchema: z.string(),\n\texecute: () => {\n\t\treturn \"Result of searching the database\";\n\t},\n});\n\nconst toolSet = {\n\t\"search-database\": searchDatabaseTool,\n};\n\nconst messages: Array<\n\tUIMessage<\n\t\t{\n\t\t\tmember: {\n\t\t\t\timage: string;\n\t\t\t\tname: string;\n\t\t\t};\n\t\t},\n\t\tnever,\n\t\tInferUITools<typeof toolSet>\n\t>\n> = [\n\t{\n\t\tid: \"1\",\n\t\tparts: [\n\t\t\t{\n\t\t\t\ttype: \"text\",\n\t\t\t\ttext: \"Can you search for information about magical forests?\",\n\t\t\t},\n\t\t],\n\t\trole: \"user\",\n\t\tmetadata: {\n\t\t\tmember: {\n\t\t\t\timage: \"/avatar-1.png\",\n\t\t\t\tname: \"You\",\n\t\t\t},\n\t\t},\n\t},\n\t{\n\t\tid: \"2\",\n\t\tparts: [\n\t\t\t{\n\t\t\t\ttype: \"tool-search-database\",\n\t\t\t\ttoolCallId: \"search-tool-1\",\n\t\t\t\tstate: \"output-available\",\n\t\t\t\tinput: {\n\t\t\t\t\tquery: \"magical forest stories\",\n\t\t\t\t},\n\t\t\t\toutput: \"Found several stories about magical forests, including 'The Whispering Woods' - a tale about a magical forest where trees can talk and animals sing beautiful songs. The story follows Luna, a young fox with silver fur who can speak with ancient trees.\",\n\t\t\t},\n\t\t\t{\n\t\t\t\ttype: \"text\",\n\t\t\t\ttext: \"I found some great information! There's a wonderful story called 'The Whispering Woods' about a magical forest where trees can talk and animals sing. The main character is Luna, a young fox with silver fur who has the special ability to communicate with ancient trees.\",\n\t\t\t},\n\t\t],\n\t\trole: \"assistant\",\n\t\tmetadata: {\n\t\t\tmember: {\n\t\t\t\timage: \"/avatar-2.png\",\n\t\t\t\tname: \"Assistant\",\n\t\t\t},\n\t\t},\n\t},\n];\n\nexport default function ChatMessageAreaDemo() {\n\treturn (\n\t\t<ChatMessageArea>\n\t\t\t<ChatMessageAreaContent>\n\t\t\t\t{messages.map((message) => (\n\t\t\t\t\t<ChatMessage key={message.id}>\n\t\t\t\t\t\t<ChatMessageAvatar>\n\t\t\t\t\t\t\t<ChatMessageAvatarImage\n\t\t\t\t\t\t\t\tsrc={message.metadata?.member.image}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ChatMessageAvatarFallback>\n\t\t\t\t\t\t\t\t{message.metadata?.member.name\n\t\t\t\t\t\t\t\t\t.charAt(0)\n\t\t\t\t\t\t\t\t\t.toUpperCase()}\n\t\t\t\t\t\t\t</ChatMessageAvatarFallback>\n\t\t\t\t\t\t</ChatMessageAvatar>\n\n\t\t\t\t\t\t<ChatMessageContainer>\n\t\t\t\t\t\t\t<ChatMessageHeader>\n\t\t\t\t\t\t\t\t<ChatMessageAuthor>\n\t\t\t\t\t\t\t\t\t{message.metadata?.member.name}\n\t\t\t\t\t\t\t\t</ChatMessageAuthor>\n\t\t\t\t\t\t\t\t<ChatMessageTimestamp createdAt={new Date()} />\n\t\t\t\t\t\t\t</ChatMessageHeader>\n\n\t\t\t\t\t\t\t<ChatMessageContent>\n\t\t\t\t\t\t\t\t{message.parts.map((part) => {\n\t\t\t\t\t\t\t\t\tif (part.type === \"text\") {\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t<ChatMessageMarkdown\n\t\t\t\t\t\t\t\t\t\t\t\tkey={`${message.id}-text-${part.text.slice(0, 20)}`}\n\t\t\t\t\t\t\t\t\t\t\t\tcontent={part.text}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif (part.type === \"tool-search-database\") {\n\t\t\t\t\t\t\t\t\t\tconst hasInput =\n\t\t\t\t\t\t\t\t\t\t\tpart.input != null &&\n\t\t\t\t\t\t\t\t\t\t\tpart.input !== undefined;\n\t\t\t\t\t\t\t\t\t\tconst hasOutput =\n\t\t\t\t\t\t\t\t\t\t\tpart.output != null &&\n\t\t\t\t\t\t\t\t\t\t\tpart.output !== undefined;\n\n\t\t\t\t\t\t\t\t\t\tconst toolName = part.type.slice(5);\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t<ToolInvocation\n\t\t\t\t\t\t\t\t\t\t\t\tkey={part.toolCallId}\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"w-full\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<ToolInvocationHeader>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<ToolInvocationName\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tname={toolName}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttype={part.state}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisError={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpart.state ===\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"output-error\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t</ToolInvocationHeader>\n\t\t\t\t\t\t\t\t\t\t\t\t{(hasInput ||\n\t\t\t\t\t\t\t\t\t\t\t\t\thasOutput ||\n\t\t\t\t\t\t\t\t\t\t\t\t\tpart.errorText) && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<ToolInvocationContentCollapsible>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{hasInput && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ToolInvocationRawData\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpart.input\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle=\"Arguments\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{part.errorText && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ToolInvocationRawData\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\terror: part.errorText,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle=\"Error\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{hasOutput && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ToolInvocationRawData\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpart.output\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle=\"Result\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</ToolInvocationContentCollapsible>\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t</ToolInvocation>\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</ChatMessageContent>\n\t\t\t\t\t\t</ChatMessageContainer>\n\t\t\t\t\t</ChatMessage>\n\t\t\t\t))}\n\t\t\t</ChatMessageAreaContent>\n\t\t\t<ChatMessageAreaScrollButton />\n\t\t</ChatMessageArea>\n\t);\n}\n",
			"type": "registry:example"
		}
	]
}