assistant-ui/tool-ui

해결하는 문제

대부분의 AI 채팅 인터페이스는 도구 호출을 원시 JSON 형태로 표시하는데, 이는 사용자가 읽기 어렵고 상호작용하기 어렵습니다. Tool UI는 이러한 원시 도구 페이로드를 차트, 양식, 지도와 같은 직관적이고 상호작용 가능한 시각적 요소로 변환하는 React 컴포넌트 라이브러리를 제공합니다.

작동 방식

shadcn/ui 스타일의 접근 방식을 따르며, 이러한 컴포넌트는 종속성으로 설치되는 것이 아니라 프로젝트 코드베이스에 직접 복사하여 붙여넣을 수 있도록 설계되었습니다. 각 컴포넌트는 도구 출력을 검증하기 위한 Zod 스키마와 짝을 이룹니다. 페이로드가 유효할 때만 UI가 렌더링되므로 앱이 안전하게 실패하도록 보장합니다.

대상 사용자

도구 호출 모델을 사용할 때 더 정교하고 상호작용 가능한 경험을 제공하고 싶은 개발자들로, 특정 디자인 시스템에 고정되지 않기를 원합니다.

주요 특징

• 복사-붙여넣기 아키텍처: 컴포넌트는 코드베이스 내에 존재하여 종속성 고정을 피합니다.
• 스키마 기반 검증: Zod 스키마를 사용하여 도구 출력이 올바르게 파싱되고 렌더링되도록 보장합니다.
• 상호작용 가능한 영수증: 컴포넌트 내에서 사용자가 선택한 내용은 어시스턴트로 다시 전달되며 영수증으로 유지됩니다.
• shadcn/ui 기반: Radix 프리미티브와 Tailwind CSS를 활용하여 스타일링과 테마 통합이 간편합니다.
• 풍부한 컴포넌트 라이브러리: 진행률 추적기, 데이터 테이블, 지리적 지도, 소셜 미디어 게시물 미리보기 등이 포함되어 있습니다.