Component registry

UI Components

Like shadcn/ui, but for the query side of RAG. Copy the component into your project — no install — and point it at your pipeline's endpoint. Every component is React + Tailwind with zero extra dependencies.

Chat

RagChat

<RagChat />

Drop-in chat UI with grounded answers and inline source chips.

React · Next.js + routeView
Search

RagSearchBox

<RagSearchBox />

Debounced search with highlighted result snippets.

React · Next.js + routeView
Ingestion

RagUpload

<RagUpload />

Drag-and-drop ingestion with live per-file progress.

React · Next.js + routeView
Display

SourceCitation

<SourceCitation />

Render the source chunks behind an answer, expandable.

React · Next.jsView
Display

StreamingText

<StreamingText />

Token-by-token rendering with a blinking cursor.

React · Next.jsView
Display

StreamingMarkdown

<StreamingMarkdown />

Stream markdown — headings, lists, code — token by token.

React · Next.jsView
Display

InlineCitation

<InlineCitation />

Turn [1] markers into hover-to-preview source popovers.

React · Next.jsView
Feedback

FeedbackBar

<FeedbackBar />

👍/👎 rating with an optional comment on thumbs-down.

React · Next.js + routeView
Dev

RetrievalInspector

<RetrievalInspector />

Debug panel — which chunks were retrieved, with scores.

React · Next.jsView
Chat

FollowUpSuggestions

<FollowUpSuggestions />

Clickable chips of suggested next questions.

React · Next.jsView
Ingestion

IngestStatus

<IngestStatus />

Live status pill — is the pipeline online and indexed?

React · Next.js + routeView
Chat

AnswerActions

<AnswerActions />

Copy, regenerate, and rate an answer.

React · Next.jsView
Chat

ConversationHistory

<ConversationHistory />

A sidebar list of past chat threads.

React · Next.jsView
Display

RagSkeleton

<RagSkeleton />

Loading placeholders shaped like chat, search, or answers.

React · Next.jsView
Display

ConfidenceBadge

<ConfidenceBadge />

A colored badge for an answer's groundedness score.

React · Next.jsView