VLLNT UI · Famille de composants
Composants Core
Core components are the primitives every interface is built from — buttons, inputs, labels, switches, badges, and the layout atoms underneath them. They're unopinionated, accessible, and the foundation the rest of the library composes on.
Buttons & Actions
Buttons, copy-to-clipboard controls, toggles, and toolbars for triggering and grouping primary user actions.
Button
Bouton React accessible avec variantes, tailles et support clavier complet — installez-le depuis le registre VLLNT UI avec la CLI shadcn.
Copy Button
Utilitaire de copie en un clic avec retour de confirmation et un hook useCopyToClipboard. Installez Copy Button depuis le registre VLLNT UI avec la CLI shadcn.
Toggle
Bouton bascule a deux etats. Installez Toggle depuis le registre VLLNT UI avec la CLI shadcn.
Toggle Group
Groupe de boutons bascule pour une selection simple ou multiple. Installez Toggle Group depuis le registre VLLNT UI avec la CLI shadcn.
Toolbar
Groupe de controles horizontal (role=toolbar) avec focus mobile par fleches et separateurs. Installez Toolbar depuis le registre VLLNT UI avec la CLI shadcn.
Form Inputs
Core input primitives including text fields, checkboxes, radios, switches, sliders, and labels for capturing user data.
Input
Champ de saisie de texte pour formulaires. Installez Input depuis le registre VLLNT UI avec la CLI shadcn.
Textarea
Champ de saisie de texte multiligne. Installez Textarea depuis le registre VLLNT UI avec la CLI shadcn.
Checkbox
Controle a bascule pour une saisie booleenne. Installez Checkbox depuis le registre VLLNT UI avec la CLI shadcn.
Radio Group
Groupe de boutons radio pour une saisie a selection unique. Installez Radio Group depuis le registre VLLNT UI avec la CLI shadcn.
Switch
Interrupteur a bascule pour un etat binaire active/desactive. Installez Switch depuis le registre VLLNT UI avec la CLI shadcn.
Slider
Curseur de plage pour selectionner des valeurs numeriques. Installez Slider depuis le registre VLLNT UI avec la CLI shadcn.
Label
Etiquette de formulaire accessible qui associe un texte descriptif a un controle de saisie. Installez Label depuis le registre VLLNT UI avec la CLI shadcn.
Status & Feedback
Badges, banners, meters, skeleton loaders, empty states, and cookie consent for surfacing status and system feedback.
Badge
Petite etiquette de statut avec des styles de variantes. Installez Badge depuis le registre VLLNT UI avec la CLI shadcn.
Banner
Barre d'annonce pleine largeur avec variantes, fermeture et un emplacement d'action optionnel. Installez Banner depuis le registre VLLNT UI avec la CLI shadcn.
Meter
Barre de mesure statique (role=meter) pour une plage connue, avec des segments optionnels. Installez Meter depuis le registre VLLNT UI avec la CLI shadcn.
Skeleton
Animation de chargement de substitution pour le contenu. Installez Skeleton depuis le registre VLLNT UI avec la CLI shadcn.
Empty State
Espace reserve centre pour listes, tableaux et resultats de recherche vides avec tailles sm/md/lg. Installez Empty State depuis le registre VLLNT UI avec la CLI shadcn.
Cookie Consent
Banniere de consentement aux cookies masquable avec des variantes de position et des actions accepter/refuser pour la conformite a la vie privee. Installez Cookie Consent depuis le registre VLLNT UI avec la CLI shadcn.
Layout & Surfaces
Structural primitives like grids, panels, and separators for composing page layout and content surfaces.
Grid
Primitive de mise en page grille CSS responsive avec props de colonnes et d'espacement par point de rupture. Installez Grid depuis le registre VLLNT UI avec la CLI shadcn.
Panel
Surface de contenu bordee et titree avec emplacements d'en-tete, de corps et de pied de page. Installez Panel depuis le registre VLLNT UI avec la CLI shadcn.
Separator
Diviseur visuel entre les sections de contenu. Installez Separator depuis le registre VLLNT UI avec la CLI shadcn.
Content & Display
Avatars, typography, links, QR codes, and keyboard hints for presenting content and identity.
Avatar
Affiche une image d'avatar utilisateur avec des initiales de repli. Installez Avatar depuis le registre VLLNT UI avec la CLI shadcn.
Typography
Primitives de texte semantiques : titres, paragraphe, chapeau, texte attenue, citation, code en ligne et liste. Installez Typography depuis le registre VLLNT UI avec la CLI shadcn.
Link
Lien stylise avec des variantes d'emphase et une indication de lien externe. Installez Link depuis le registre VLLNT UI avec la CLI shadcn.
QR Code
Genere un QR code a partir d'une valeur de chaine sous forme de SVG adapte au theme. Installez QR Code depuis le registre VLLNT UI avec la CLI shadcn.
Kbd
Indicateur de touche clavier avec expansion des modificateurs selon la plateforme via la prop shortcut. Installez Kbd depuis le registre VLLNT UI avec la CLI shadcn.
Typography
Text, heading, display, and prose primitives with token-driven font family, weight, and type scale for consistent typography.
Text
Primitive de texte de corps avec une famille sans-serif pilotee par des tokens et une echelle de taille/ton/graisse ; polymorphe via `as`. Installez Text depuis le registre VLLNT UI avec la CLI shadcn.
Heading
Titre semantique (h1-h6) avec tokens de design de police, graisse et taille surchargeables par theme. Installez Heading depuis le registre VLLNT UI avec la CLI shadcn.
Display
Texte d'affichage surdimensionne pilote par les tokens d'affichage, avec une revelation optionnelle respectant la reduction des animations. Installez Display depuis le registre VLLNT UI avec la CLI shadcn.
Prose
Conteneur de contenu long qui stylise les descendants HTML bruts avec l'echelle typographique pilotee par les tokens. Installez Prose depuis le registre VLLNT UI avec la CLI shadcn.
Lisible par les agents
Votre agent IA peut aussi les installer.
Le registre est expose comme donnees structurees, afin que les agents de code choisissent le bon composant sans scraper le HTML.
Questions frequentes
- What counts as a core component?
- The foundational, unopinionated primitives — Button, Input, Label, Switch, Badge, Kbd, Separator, and the layout atoms — that every other component composes from.
- Do I have to install all of them?
- No. Every @vllnt/ui component installs independently with the shadcn CLI — add only the ones you use.