NxtGen
NxtGen
Design v0
/
Components
Home
Components
Chat
Tokens
모든 컴포넌트
Actions
Button
IconButton
Inputs
TextField
Switch
Checkbox
RadioGroup
Select
Contents
Card
Badge
Feedback
Alert
Tooltip
Dialog
DropdownMenu
Toast
Loading
Spinner
Skeleton
Navigation
Tabs
AI-Native
AgentAvatar
MessageBubble
StreamingText
ThinkingIndicator
PromptInput
ModelSelector
TokenUsageBar
ToolCallBlock
CitationLink
Components
NxtGen 디자인 시스템의 모든 React 컴포넌트.
Actions
Button
사용자의 액션을 트리거하는 가장 기본 요소.
IconButton
아이콘만 있는 버튼.
Inputs
TextField
label + helper + error를 갖춘 텍스트 입력.
Switch
on/off 토글.
Checkbox
다중 선택 + indeterminate 상태.
RadioGroup
단일 선택 라디오 그룹.
Select
키보드 친화 단일 선택 드롭다운.
Contents
Card
Compound API 카드 컨테이너.
Badge
메타 정보 표시 라벨.
Feedback
Alert
인라인 알림 배너.
Tooltip
호버/포커스 보조 정보.
Dialog
모달 다이얼로그.
DropdownMenu
컨텍스트 메뉴 + 서브메뉴/체크/라디오.
Toast
일시적 알림 (Provider + hook).
Loading
Spinner
회전 로딩 인디케이터.
Skeleton
콘텐츠 placeholder.
Navigation
Tabs
언더라인 인디케이터 탭.
AI-Native
AgentAvatar
그라디언트 보더 + 상태 표시 아바타.
MessageBubble
user/assistant/system 채팅 말풍선.
StreamingText
토큰 단위 점진 출력 + 커서.
ThinkingIndicator
그라디언트 점 3개 펄스.
PromptInput
멀티라인 입력 + ⌘+Enter + 첨부.
ModelSelector
모델 선택 + tier 배지.
TokenUsageBar
컨텍스트 사용량 시각화.
ToolCallBlock
도구 호출 표시 + JSON I/O.
CitationLink
RAG 출처 위첨자 링크.