NxtGenNxtGenDesign v0/Components
HomeComponentsChatTokens
모든 컴포넌트
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 출처 위첨자 링크.