--- title: "Composants — zenit Zig UI" description: "51 composants publics et 13 labos de capacités. Chaque clip est le drawable Metal d'une vraie fenêtre zenit Storybook pilotée par le harness E2E ; le code…" url: https://zenit.z.express/fr/components language: fr alternate_en: https://zenit.z.express/components.md alternate_zh: https://zenit.z.express/zh/components.md alternate_es: https://zenit.z.express/es/components.md alternate_ja: https://zenit.z.express/ja/components.md alternate_ko: https://zenit.z.express/ko/components.md alternate_de: https://zenit.z.express/de/components.md project: zenit v0.1.0-alpha (Zig 0.15.2, macOS) source: https://github.com/version-next/zenit --- # Composants 51 composants publics et 13 labos de capacités. Chaque clip est le drawable Metal d'une vraie fenêtre zenit Storybook pilotée par le harness E2E ; le code source et les props sont extraits directement du dépôt. [Button`ui.widgets.Button`Boutons principaux, secondaires, destructifs, de type lien et icône seule.](https://zenit.z.express/fr/components/button)[Checkbox`ui.widgets.Checkbox`Un booléen indépendant avec les états non coché, coché et indéterminé.](https://zenit.z.express/fr/components/checkbox)[Switch`ui.widgets.Switch`Un interrupteur pour les réglages qui s'appliquent immédiatement.](https://zenit.z.express/fr/components/switch)[Radio`ui.widgets.RadioGroup`Choisir exactement une valeur parmi des options mutuellement exclusives.](https://zenit.z.express/fr/components/radio)[Slider`ui.widgets.Slider`Choisir une valeur sur une plage continue ou par paliers.](https://zenit.z.express/fr/components/slider)[Rate`ui.widgets.Rate`Notes en étoiles ou sur un nombre borné d'éléments.](https://zenit.z.express/fr/components/rate)[NumberStepper`ui.widgets.NumberStepper`Incrément et décrément précis pour les quantités et les paramètres.](https://zenit.z.express/fr/components/stepper)[Input`ui.widgets.Input`Saisie sur une ligne pour texte, e-mail, mot de passe et recherche.](https://zenit.z.express/fr/components/input)[Textarea`ui.widgets.Textarea`Édition multiligne avec les états helper, error et disabled.](https://zenit.z.express/fr/components/textarea)[Select`ui.widgets.Select`Sélecteurs simples, multiples, effaçables et avec recherche.](https://zenit.z.express/fr/components/select)[Form Composition`Input · Select · Button`Input, Select et Button mélangés à une même taille : une barre de filtres et un formulaire métier.](https://zenit.z.express/fr/components/formcompose)[ComboBox`ui.widgets.ComboBox`Une saisie avec recherche et filtrage qui réécrit sa valeur.](https://zenit.z.express/fr/components/combobox)[TagsInput`ui.widgets.TagsInput`Saisir de nombreux tokens au clavier.](https://zenit.z.express/fr/components/tags)[FileUpload`ui.widgets.FileUpload`Sélection de fichiers et zone de dépôt.](https://zenit.z.express/fr/components/upload)[DatePicker`ui.widgets.DatePicker`Saisir une date ou la choisir dans un calendrier.](https://zenit.z.express/fr/components/datepicker)[DateRangePicker`ui.widgets.DateRangePicker`Choisir une date de début et une date de fin.](https://zenit.z.express/fr/components/daterange)[Form`ui.widgets.FormOf(T)`État de formulaire typé, métadonnées des champs et moment de validation.](https://zenit.z.express/fr/components/form)[Badge`ui.widgets.Badge`Statut discret, compteurs et étiquettes sémantiques.](https://zenit.z.express/fr/components/badge)[Tag`ui.widgets.Tag`Étiquettes de catégorie fermables ou en lecture seule.](https://zenit.z.express/fr/components/tag)[Chip`ui.widgets.Chip`Choix compacts, filtres ou tokens avec icône.](https://zenit.z.express/fr/components/chip)[Card`ui.widgets.Card`Regroupe un titre, un corps et une surface interactive en une seule unité.](https://zenit.z.express/fr/components/card)[Alert`ui.widgets.Alert`Retour persistant dans la page.](https://zenit.z.express/fr/components/alert)[Progress`ui.widgets.Progress`Progression déterminée et indéterminée.](https://zenit.z.express/fr/components/progress)[Spinner`ui.widgets.Spinner`Une animation compacte pour les attentes courtes.](https://zenit.z.express/fr/components/spinner)[Skeleton`ui.widgets.Skeleton`Structure provisoire pendant le chargement du contenu.](https://zenit.z.express/fr/components/skeleton)[Timeline`ui.widgets.Timeline`Événements verticaux par date ou par statut.](https://zenit.z.express/fr/components/timeline)[Breadcrumb`ui.widgets.Breadcrumb`Indique l'emplacement actuel et ses ancêtres.](https://zenit.z.express/fr/components/breadcrumb)[Steps`ui.widgets.Steps`États terminé, en cours et en attente d'une tâche en plusieurs étapes.](https://zenit.z.express/fr/components/steps)[Tree`ui.widgets.Tree`Hiérarchies, arborescences de fichiers et structures dépliables.](https://zenit.z.express/fr/components/tree)[Table`ui.widgets.Table`Un tableau de base avec colonnes fixes et cellules personnalisées.](https://zenit.z.express/fr/components/table)[DataTable`ui.widgets.DataTable`Un tableau de données avec filtrage, pagination et comportement de colonnes.](https://zenit.z.express/fr/components/datatable)[Calendar`ui.widgets.Calendar`Navigation et sélection de dates en vue mensuelle.](https://zenit.z.express/fr/components/calendar)[Markdown`ui.widgets.Markdown`Rend un sous-ensemble de Markdown pris en charge sous forme de nœuds natifs.](https://zenit.z.express/fr/components/markdown)[Icons`ui.system_icons`Rôles d'icônes sémantiques, tailles et teintes indépendants du fournisseur.](https://zenit.z.express/fr/components/icons)[Tabs`ui.widgets.Tabs`Basculer entre des vues sœurs dans un même contexte.](https://zenit.z.express/fr/components/tabs)[Accordion`ui.widgets.Accordion`Replier et déplier des sections.](https://zenit.z.express/fr/components/accordion)[Menu`ui.widgets.Menu`Actions contextuelles avec indications de raccourcis.](https://zenit.z.express/fr/components/menu)[DropdownMenu`ui.widgets.DropdownMenu`Un ensemble de commandes ouvert depuis un bouton.](https://zenit.z.express/fr/components/dropdown)[Notification`ui.widgets.Notifier`Notifications non bloquantes : neuf types, progression, actions, empilement et huit positions d'ancrage.](https://zenit.z.express/fr/components/notification)[Tooltip`ui.widgets.Tooltip`Indications brèves et complémentaires pour les contrôles.](https://zenit.z.express/fr/components/tooltip)[Popover`ui.widgets.Popover`Un contenu transitoire plus riche qu'un tooltip.](https://zenit.z.express/fr/components/popover)[Modal`ui.widgets.Modal`Tâches bloquantes, confirmations et contexte focalisé.](https://zenit.z.express/fr/components/modal)[Sheet`ui.widgets.Sheet`Un panneau latéral qui glisse depuis le bord de la fenêtre.](https://zenit.z.express/fr/components/sheet)[GlassBox`ui.widgets.GlassBox`Une surface de verre avec un vrai flou d'arrière-plan.](https://zenit.z.express/fr/components/glassbox)[Divider`ui.widgets.Divider`Séparateurs horizontaux, verticaux et avec libellé.](https://zenit.z.express/fr/components/divider)[Stack`ui.widgets.HStack / VStack`Disposition horizontale et verticale courante.](https://zenit.z.express/fr/components/stack)[Layout / Box Model`ui.box`Une matrice de couverture du modèle de boîte, des pourcentages, du positionnement absolu, de Flex / Grid et du rognage.](https://zenit.z.express/fr/components/layoutbox)[VirtualList`ui.widgets.VirtualList`Ne monte que la fenêtre visible des grandes listes uniformes.](https://zenit.z.express/fr/components/virtuallist)[VirtualList (Dynamic)`ui.widgets.VirtualList`Une liste virtuelle avec des hauteurs de ligne variables.](https://zenit.z.express/fr/components/virtuallistdynamic)[ScrollArea`ui.widgets.mountScrollArea`Défilement dessiné sur mesure, barres de défilement et positionnement programmatique.](https://zenit.z.express/fr/components/scrollarea)[Grid`ui.widgets.mountGrid`Lignes et colonnes en deux dimensions avec cellules personnalisées.](https://zenit.z.express/fr/components/grid)[GlassLab`ui.widgets.GlassBox`Un banc optique GlassBox : réfraction, largeur du biseau et grossissement.](https://zenit.z.express/fr/components/glasslab)[GlassIslands`ui.widgets.GlassBox`Plusieurs îlots de verre sur un même arrière-plan.](https://zenit.z.express/fr/components/glassislands)[GlassMotion`ui.widgets.GlassBox`Verre qui se déforme et barre d'outils flottante pendant le défilement.](https://zenit.z.express/fr/components/glassmotion)[GlassChrome`ui.widgets.GlassBox`Chrome d'application : barre de titre et barre d'outils en verre au-dessus d'un contenu qui défile.](https://zenit.z.express/fr/components/glasschrome)[CanvasEvents`ui.events`Événements au niveau du canevas : défilement, geste de zoom, glisser et aller-retour d'un PNG via le presse-papiers.](https://zenit.z.express/fr/components/canvasevents)[Drag`ui.interaction`Glisser-déposer et une poignée de redimensionnement horizontal.](https://zenit.z.express/fr/components/drag)[Gestures`ui.interaction`Arbitrage des gestes pour clic simple, double, triple et appui long.](https://zenit.z.express/fr/components/multiclick)[AnimControls`ui.fx`Contrôle d'animation : yoyo, timelines, keyframes et ressorts.](https://zenit.z.express/fr/components/animctl)[VectorPath`ui.path`Géométrie des tracés vectoriels : contour, remplissage et hit-testing.](https://zenit.z.express/fr/components/vectorpath)[BlendModes`ui.box`Modes de fusion et composition avec opacité.](https://zenit.z.express/fr/components/blend)[Emoji`ui.text`Emoji en couleur, séquences ZWJ et modificateurs de teint.](https://zenit.z.express/fr/components/emoji)[RTL`ui.text`Texte mêlant arabe, hébreu et latin.](https://zenit.z.express/fr/components/rtl)[WordNav`ui.widgets.Textarea`Déplacement du curseur mot par mot entre systèmes d'écriture.](https://zenit.z.express/fr/components/wordnav)