VLLNT UI · Famille de composants

Composants AI

Parcourez les composants AI actuellement implementes pour le renderer Natif.

Chat & Conversation

Message bubbles, threaded conversations, and assistant sidebars for building complete AI chat interfaces.

AI Message Bubble

Bulle de discussion pour les messages assistant, utilisateur, outil et systeme utilisant les surfaces du systeme de design actuel. Installez AI Message Bubble depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
3 storiesVoir le composant

Conversation Thread

Famille de composants composee pour les interfaces de chat IA qui orchestre le defilement automatique, les indicateurs de streaming, les etats vides et le rendu des messages. Installez Conversation Thread depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
3 storiesVoir le composant

Prompt Composition

Auto-growing prompt inputs, chat composers, and reusable prompt template galleries for capturing user instructions.

AI Chat Input

Compositeur d'invite pour interfaces conversationnelles avec texte d'aide, actions de barre d'outils et etats d'envoi. Installez AI Chat Input depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Prompt Input

Zone de texte de prompt a croissance automatique avec un bouton d'envoi et un emplacement de barre d'outils optionnel. Installez Prompt Input depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

Streaming & Reasoning

Live token streaming, chain-of-thought traces, and collapsible reasoning blocks that reveal how an AI model thinks.

AI Streaming Text

Bloc de texte lisible pour la sortie partielle de l'assistant avec un curseur en direct optionnel pendant que les jetons arrivent en flux. Installez AI Streaming Text depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Chain of Thought

Visualisation ordonnee et sensible au statut de la chaine de pensee d'un modele avec un etat par etape. Installez Chain of Thought depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
3 storiesVoir le composant

Reasoning

Trace de raisonnement IA repliable avec prise en charge du streaming et etapes ordonnees ou libres. Installez Reasoning depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
3 storiesVoir le composant

Thinking Block

Bloc repliable affichant le raisonnement de l'IA avec prise en charge du streaming. Installez Thinking Block depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
1 storyVoir le composant

Agent Tools & Citations

Agent activity chains, tool-call traces, and source citations that make AI agent execution transparent and verifiable.

Agent Activity

Affichage visuel de la chaine d'execution d'un agent IA — etapes, outils, decisions, progression. Installez Agent Activity depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

AI Tool Call Display

Carte structuree pour les traces d'invocation d'outils, les statuts, l'entree serialisee et la sortie retournee. Installez AI Tool Call Display depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

AI Source Citation

Carte de reference de source compacte pour les reponses IA avec un titre, une etiquette d'origine et un extrait optionnel. Installez AI Source Citation depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
1 storyVoir le composant

Artifacts & Models

Rendered AI artifacts, model selectors, and side-by-side model comparison for generated outputs and model choice.

AI Artifact

Zone de sortie rendue pour le contenu genere par IA avec barre d'outils, actions copier/editer/telecharger/plein ecran et puces de version. Installez AI Artifact depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

Model Selector

Selecteur deroulant pour choisir des modeles IA. Installez Model Selector depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
1 storyVoir le composant

Questions frequentes

What is an agent-first UI design system?
An agent-first design system gives you the UI primitives that AI products actually need — chat input, message bubbles, streaming text, tool-call displays, source citations, agent activity timelines, and artifacts — and also ships every component as machine-readable JSON so AI coding agents can install it without scraping HTML. VLLNT UI is open source (MIT) and installs with the shadcn CLI.
Which components do I need to build an AI chat app in React?
At minimum: AI Chat Input for the composer, AI Message Bubble to render each turn, and AI Streaming Text for token-by-token output. Add AI Tool Call Display and Agent Activity for agentic flows, AI Source Citation for RAG, and AI Artifact for canvas-style output.
How do AI agents consume VLLNT UI?
Three surfaces: /llms.txt (a concise index per the llmstxt.org spec), /llms-full.txt (the full registry context in one fetch), and /r/[name].json (a machine-readable descriptor per component with props, accessibility schema, and examples). Coding agents like Claude, Cursor, Cline, and Continue read these directly.
Is VLLNT UI free to use?
Yes. VLLNT UI is open source under the MIT license. You own the source after install, with no backend and no tracking.