Tous les composants

Explorez les 308 composants Lyra UI. Filtrez par famille, recherchez par nom, essayez les aperçus disponibles ou ouvrez un exemple documenté.

Conversation et chat

Espace de travail d'agent — Structure de conversation IA contrôlée et responsive, qui assemble la transcription, le compositeur de message et un panneau de détails optionnel pour l'exécution, les outils, la récupération, l'étayage et le contexte.
Visualiseur audio — Visualisation de l'activité vocale dessinée sur canvas, reflétant l'état inactif, à l'écoute, en réflexion ou en train de parler d'un agent.
Sélecteur de variante — Navigateur contrôlé « ‹ n / m › » entre les variantes régénérées ou modifiées d'un même message de chat.
Compositeur de message — Champ de saisie de message avec redimensionnement automatique et contrôles d'envoi et d'arrêt intégrés
Message de chat — Bulle de discussion basée sur le rôle, avec avatar, badges et pied de page sensible au statut
Zone de défilement du chat — Conteneur de défilement de la transcription, gérant l'ancrage en bas, une pastille « aller au dernier message » et un séparateur des messages non lus.
Point de restauration — Point de restauration inline de la conversation, avec confirmation avant restauration pour revenir à un état antérieur du chat.
Bloc de code — Affichage de code délimité avec coloration syntaxique différée optionnelle et bouton de copie.
Bloc de code de base — Affichage de code optimisé pour un build léger, qui n'effectue la coloration syntaxique qu'à partir d'une table de grammaire fournie à la compilation.
Élément de conversation — Ligne d'historique de conversation sélectionnable affichant le titre, l'aperçu et l'horodatage d'une session.
Statut de génération — Affiche le temps écoulé, les tokens et le débit pendant la diffusion en continu d'une réponse IA.
Séparateur de transfert — Séparateur étiqueté marquant le transfert de contrôle entre agents dans une transcription.
Markdown — Rendu Markdown vers HTML assaini avec tableaux GFM, code et liens
Markdown de base — Rendu Markdown optimisé pour un build léger, qui ne met en couleur les blocs de code que via une table de grammaire fournie à la compilation.
Actions de message — Barre d'actions par message pour un message de chat, avec copier, régénérer, modifier et retour intégrés.
Retour sur message — Évaluation pouce levé/baissé pour un message de l'assistant, avec un panneau de détail optionnel motif et commentaire.
Sélecteur de modèle — Sélecteur de fournisseur et de modèle avec catalogue prédéfini ou saisie libre personnalisée.
Panneau de paramètres du modèle — Sélecteur de modèle associé à un curseur de température pour configurer un agent.
Appuyer pour parler — Bouton de capture micro qui gère l'intégralité du cycle de vie de la demande de permission, de l'enregistrement et de l'arrêt, pour un usage en pression maintenue ou en bascule.
Statut du flux — Affiche la phase d'une connexion de streaming unique, avec détection des blocages sensible au heartbeat.
Texte en streaming — Affiche progressivement le texte de l'assistant en streaming, en regroupant les mises à jour rapides de tokens.
Texte en streaming de base — Rendu de texte en streaming optimisé pour un build léger, dont le mode Markdown ne met en couleur les blocs de code qu'à partir d'une table de grammaire fournie à la compilation.
Puces de suggestion — Ligne défilante de puces d'invites de démarrage ou de relance, transmettant le texte choisi à l'hôte.
Liste des conversations — Barre latérale de conversations groupées et consultables, avec actions d'épingler, archiver, supprimer et renommer par ligne.
Flux de transcription — Flux de sous-titres en direct pour une session vocale en cours, avec passage du provisoire au définitif et défilement ancré en bas.
Indicateur de saisie — Indice de présence purement visuel signalant que l'assistant rédige une réponse
Badge d'utilisation — Bandeau compact tokens/coût/latence pour un message ou une exécution, avec détail dans une infobulle au survol.
Sélecteur de voix — Sélecteur de voix TTS parmi un catalogue fourni, avec aperçu audio intégré et gestion des valeurs obsolètes.
Moteur de rendu de widgets — Restitue une arborescence de widgets JSON déclarative diffusée par un agent, via un registre autorisé associant types et composants.
Parties de message — Affiche des parties de message IA ordonnées et entrelacées avec des primitives de texte, raisonnement, outil, citation, pièce jointe et média.
Saisie de prompt — Réunit la rédaction du prompt, les pièces jointes, le choix du modèle, de la voix et des sources, les mentions, les commandes et les tours en attente.
File de prompts — Gère une file contrôlée de prompts de suivi pouvant être modifiés, réordonnés, supprimés ou envoyés immédiatement.
Session en temps réel — Fournit une enveloppe de session vocale indépendante du fournisseur pour la connexion, l’activité, la transcription, la capture, le mode muet et l’interruption.
Barre d’outils de sélection — Place les actions demander, citer, référencer et copier près du texte sélectionné tout en conservant son ancre documentaire.

Outils d'agent et observabilité

Flux d'activité — Journal d'activité en flux continu (ajout uniquement) des actions détaillées d'un agent, se résumant en un récapitulatif des étapes terminées une fois l'exécution finie.
Tableau de bord d'évaluation d'agent — Vue d'ensemble contrôlée des évaluations, associant des cartes de métriques à un graphique de tendance et à l'historique des statuts par exécution.
Question de l’agent — Recueille une réponse structurée à une question d’un agent ou d’un serveur MCP, avec des actions pour accepter, refuser ou annuler.
Exécutions en arrière-plan — Affiche les tâches d’agent en attente, en cours ou terminées, gérées par l’application, avec des demandes d’ouverture et d’annulation.
Jauge de budget — Affiche l’utilisation fournie par rapport à une limite, y compris les états indisponible et dépassé.
Révision des modifications — Présente les modifications de fichiers fournies par l’application et demande de conserver ou d’écarter chaque fragment.
Gestionnaire de connecteurs — Affiche l’état des connexions et demande des actions de connexion, déconnexion ou nouvelle tentative pour les connecteurs gérés par l’application.
Autorisation ciblée — Présente une demande d’autorisation limitée et transmet à l’application le choix d’autoriser ou de refuser.
Règles d’autorisation — Affiche les règles d’autorisation définies par l’application et demande de modifier leurs décisions : autoriser, demander ou refuser.
Exécution d'agent — Conteneur de haut niveau pour une exécution d'agent, affichant le statut, le temps écoulé, l'étape en cours et le coût, avec des actions d'annulation et de nouvelle tentative.
Trace d'agent — Vue hiérarchique de la trace agent/LLM, avec filtres par type de span et raccourcis de saut vers les transferts, sur un tableau de spans partagé.
File d'attente d'approbation — File accessible au clavier des appels d'outil en attente, chacun étant examiné puis approuvé ou refusé au moyen d'une seule et même boîte de dialogue.
Panneau d'artefact — Structure autour d'un artefact généré par un agent, avec bascule aperçu/code, navigation entre versions et actions de copie/téléchargement.
Cadre de navigateur — Fenêtre d'affichage de type « ordinateur d'agent », présentant un flux de captures d'écran, une URL en lecture seule et des contrôles de reprise en main.
Carte de commit — Résumé compact d'un commit avec statistiques de diff et modifications par fichier, avec lien vers une vue diff.
Panneau de comparaison — Comparaison côte à côte de deux réponses (A/B) avec vote du gagnant, pour l'évaluation de modèles façon arène.
Barre de confirmation — Bloc d'approbation/refus inline et non modal pour une action d'agent proposée, intégré à la transcription plutôt que dans une boîte de dialogue.
Inspecteur de contexte — Vue d'inspection des segments de contexte d'un appel de modèle, avec estimations de tokens, citations, marqueurs de masquage et contrôles de copie/export.
Jeu de données d'évaluation — Liste d'exemples d'évaluation filtrable et étiquetable, avec des actions d'ajout, de suppression, d'import et d'export.
Résultat d'évaluation — Surface de notation par grille d'évaluation et de revue humaine pour comparer les exécutions d'un exemple d'évaluation.
Exécution d'évaluation — Vue de progression en direct pour un lot d'évaluation, avec une progression globale et un panneau réductible par exemple, incluant l'étayage et les traces d'outils.
Résumé des politiques — Liste en lecture seule des décisions de garde-fou, de permission, de confidentialité et de politique d'outil, avec des explications accessibles indiquant l'autorisation, le refus ou la nécessité d'examen.
Cascade des spans — Chronologie horizontale des spans d'une trace d'agent, sous forme de barres teintées par statut sur un axe temporel commun.
Trace de pile — Analyse les traces de pile JS/TS, navigateur et Python en cadres activables, avec repliage des cadres internes.
Liste de tâches — Suivi en direct et réductible du plan d'un agent, avec statut de cycle de vie par étape et sous-étapes imbriquées.
Terminal — Console ANSI en lecture seule affichant la sortie diffusée d'un agent ou d'un outil, avec recherche et ancrage en bas.
Résultats de tests — Résumé réussite/échec d'une suite de tests avec comptages par statut, filtres à bascule et détail des échecs qui se déplie automatiquement.
Panneau de raisonnement — Panneau réductible pour la transcription du raisonnement d'un agent IA, en direct ou relue.
Boîte de dialogue d'approbation d'outil — Point de contrôle humain pour approuver, refuser ou modifier un appel d'outil proposé avant son exécution.
Bloc d'appel d'outil — Bloc repliable en ligne pour un appel d'outil de l'agent, qui se déplie pour afficher ses arguments, son erreur et son résultat.
Puce d'appel d'outil — Pastille compacte en ligne résumant le nom, le statut et la durée d'un appel d'outil de l'agent.
Formulaire de paramètres d'outil — Génère un formulaire modifiable à partir du schéma JSON plat d'un outil pour ajuster les arguments d'appel.
Boîte de dialogue de résultat d'outil — Fenêtre modale affichant le statut, la durée et le détail complet du résultat d'un appel d'outil.
Vue de résultat d'outil — Affiche le résultat d'un appel d'outil via un moteur de rendu enregistré, avec repli sur JSON.
Boîte de dialogue de sélection d'outils — Boîte de dialogue consultable, regroupée par catégorie, pour choisir les outils activés pour l'agent.
Chronologie des outils — Liste chronologique des appels d'outil d'une exécution d'agent, avec compteurs de nouvelles tentatives, validation humaine obligatoire et masquage des champs sensibles.
Arborescence de trace — Hiérarchie réductible des spans d'une trace agent/LLM, avec barre de durée et colonnes optionnelles de tokens et de coût.
Carte de résultat — Structure de carte avec bordure donnant aux rendus de résultats d'outils personnalisés une apparence uniforme de petite carte
Champ de résultat — Ligne compacte libellé/valeur pour les cartes de résultat d'outil et les bandeaux de métadonnées denses
Application MCP — Héberge une ressource MCP App exécutable dans un bac à sable isolé et expose les requêtes de l’hôte sous forme d’événements typés.
Studio de prompts — Fournit un atelier indépendant du fournisseur pour modifier, prévisualiser, versionner, enregistrer et exécuter des prompts structurés.
Visionneuse de schéma — Inspecte des arbres JSON Schema sélectionnables avec contraintes, champs obligatoires, branches de composition et problèmes de validation.
Panneau des sous-agents — Affiche une hiérarchie contrôlée d’exécutions de sous-agents avec statut, tâche, modèle, progression et actions de cycle de vie.

Recherche et graphes de connaissances

Carte de communauté — Carte récapitulative d'une communauté de graphe de connaissances, avec puces de membres et action d'exploration détaillée.
Explorateur d'embeddings — Vue en nuage de points 2D accessible des coordonnées d'embedding projetées par l'hôte, avec, en option, une coloration par cluster et une sélection de points.
Carte d'entité — Fiche descriptive d'une entité du graphe de connaissances, avec badge de type, propriétés, degré et action de focus dans le graphe.
Puce d'entité — Mention @entité en ligne pour le texte généré par l'agent, avec infobulle d'aperçu au survol ou au focus.
Dossier d'entité — Surface de détail d'entité avec un en-tête, une statistique de confiance et des onglets pour les relations, les fragments à l'appui et la provenance.
Graphe — Représente des relations sous forme de diagramme nœuds-liens à disposition par forces, déplaçable et zoomable.
Légende de graphe — Légende des types de nœuds pour un graphe associé, servant aussi de filtre de visibilité.
File d'attente d'ingestion — Liste contrôlée de documents progressant dans un pipeline d'ingestion, affichant l'étape, la progression, les comptages et les demandes de nouvelle tentative ou d'annulation.
Base de connaissances — Liste des sources d'une base de connaissances pour la récupération, avec statut de synchronisation, santé de l'indexation, permissions et demandes de gestion par ligne.
Administration de base de connaissances — Structure d'exploitation à onglets associant les sources d'une base de connaissances à la file d'attente d'ingestion, et transmettant les actions de gestion à l'hôte.
Explorateur de graphe de connaissances — Conteneur d'exploration du graphe de connaissances combinant rendu du graphe, recherche d'entités, filtres de type, expansion du voisinage et recherche de chemins.
Carte mentale — Arborescence radiale de sujets dépliable pour parcourir une hiérarchie dans l'espace et approfondir un sujet.
Liste des voisins — Lignes de relation d'une entité, avec navigation et expansion dans le graphe par ligne.
Palette de nœuds — Bibliothèque de nœuds consultable et catégorisée pour glisser ou placer des nœuds sur un canevas de flux.
Bandeau de chemin — Chaîne compacte et défilante nœud-relation-nœud représentant un chemin de raisonnement GraphRAG.
Inspecteur de fragments — Liste classée des fragments RAG récupérés, avec barres de pertinence et lien direct vers une visionneuse de document.
Badge de citation — Marqueur de citation [n] en ligne avec aperçu au survol et coloration selon la confiance/vérification.
Résumé d'étayage — Bilan d'étayage par affirmation, indiquant le nombre de justificatifs, la couverture des citations, la confiance, les avertissements et les citations à l'appui.
Panneau de mémoire — Surface de mémoire de travail de l'agent pour le contexte à court terme et les souvenirs à long terme, avec des actions conditionnées par le niveau de confiance et soumises à confirmation.
Panneau de provenance — Affiche les sources ayant étayé une réponse sous forme de décomposition réductible en entités, relations, communautés et fragments.
Réponse RAG — Surface de réponse étayée combinant du Markdown assaini, des badges de citation, un bilan d'étayage et des aperçus de sources dépliables.
Progression de la recherche — Affiche les étapes de recherche et le nombre de sources fournis par l’application, ainsi que la progression globale.
Résultats de récupération — Liste classée de fragments récupérés, avec déduplication, regroupement par source, sélection et modes de présentation compacts ou étendus.
Recherche de récupération — Barre de requête pour une surface de récupération ou de RAG, avec des puces de filtre et de portée, un sélecteur de mode vectoriel/mot-clé/hybride, et un retour de statut.
Trace de récupération — Chronologie des étapes du pipeline de récupération, avec des preuves dépliables pour chaque étape de reformulation, vectorisation, récupération, reclassement et filtrage.
Carte de source — Entrée de citation affichant le titre, la page, l'extrait et le texte intégral extensible d'une source.
Liste des sources — Panneau Sources réductible regroupant les cartes de citation d'un message de chat sous un seul en-tête.
Sélecteur de sources — Arborescence à cases à cocher déterminant les sources qui étayeront la prochaine réponse, avec dossiers tri-état, sélection globale et recherche.
Preuves des affirmations — Audite les affirmations générées à partir de citations, avec statut de validation, niveau de confiance et éléments probants.
Tableau de bord d’évaluation RAG — Présente les métriques de qualité RAG, leurs tendances, les segments d’évaluation et l’historique des exécutions calculés par l’hôte.
Comparaison de recherche — Compare côte à côte des ensembles classés de recherche et de reclassement, avec chevauchement et détail des scores.

Formulaires et champs de saisie

Bouton — Bouton d'action piloté par des tokens, avec variantes de ton, tailles et état de chargement.
Case à cocher — Contrôle de formulaire booléen avec états coché, décoché et indéterminé.
Groupe de cases à cocher — Regroupe des cases à cocher apparentées en un champ de sélection multiple, associé au formulaire et validé.
Éditeur de code — Surface d'édition de code multiligne sans dépendance, avec gouttière de numéros de ligne optionnelle.
Sélecteur de couleur — Champ de couleur natif associé au formulaire, avec label, indice et habillage d'erreurs de validation.
Combobox — Sélection simple ou multiple filtrable, associant un champ de texte à une listbox en popover.
Champ de date — Champ de date avec popover calendrier associé et valeur au format ISO-8601.
Sélecteur de date — Calendrier en grille mensuelle intégré, pour choisir une date unique ou une plage de dates.
Sélecteur d'émojis — Sélecteur d'émoji consultable, navigable au clavier et associé à un formulaire.
Bouton icône — Déclenche une action via un bouton compact et accessible, composé uniquement d'une icône.
Champ de saisie — Champ de texte sur une ligne, avec label, indice et habillage de validation en ligne optionnels.
Sélecteur de pays — Sélectionne des codes de pays et territoires avec des noms traduits, des drapeaux et une recherche facultative.
Sélecteur de devise — Sélectionne des codes de devises avec des noms traduits, des symboles et une recherche facultative.
Sélecteur de fuseau horaire — Sélectionne des identifiants de fuseaux horaires dans une liste ordonnée, avec une recherche facultative.
Sélecteur d’unité — Sélectionne des unités de mesure avec des noms traduits, des symboles et une recherche facultative.
Sélecteur de locale — Liste déroulante fermée pour changer la locale active, à partir du registre de locales propre à la bibliothèque.
Champ numérique — Champ numérique avec contraintes min, max et step, plus validation native des contraintes.
Option — Option sélectionnable transmettant valeur, label, regroupement et statut à une combobox.
Champ téléphone — Champ téléphonique sensible au pays, dont la valeur de formulaire est au format E.164 canonique
Bouton radio — Contrôle à choix unique associé au formulaire, pour sélectionner une option parmi un ensemble
Groupe de boutons radio — Groupe étiqueté et navigable au clavier de boutons radio à choix unique.
Formulaire de grille d'évaluation — Grille de notation, catégorie et commentaire configurable, avec un enchaînement valider-puis-suivant pour parcourir une file d'évaluation des réponses IA.
Liste déroulante — Liste déroulante fermée pour choisir une option parmi un ensemble fixe de choix.
Signature pad — Accessible form control for drawing a signature with pointer or keyboard input.
Curseur — Contrôle numérique de plage pour des réglages comme la température d'un LLM ou un niveau de volume.
Sélecteur de nuances — Sélecteur à choix unique parmi un petit ensemble fixe de nuances de couleur, avec un contrat radiogroup intégré.
Interrupteur — Contrôle de formulaire à interrupteur booléen, avec une sémantique marche/arrêt pour les formulaires natifs.
Zone de texte — Champ de texte brut multiligne avec redimensionnement automatique, validation et habillage de contrôle de formulaire.
Champ horaire — Champ horaire segmenté et adapté à la locale, avec un sélecteur à colonnes attaché ; l'expérience native du navigateur (input[type=time]) est lr-native-time-input.
Plage horaire — Sélecteur à deux poignées pour choisir une plage de début et de fin sur un domaine numérique.
Bouton bascule — Bouton à deux états autonome qui active ou désactive une option, avec la sémantique aria-pressed.
Groupe de boutons bascules — Regroupe des boutons bascules derrière un seul arrêt de tabulation, en sélection multiple ou unique annulable.
Champ horaire natif — Champ de sélection d'heure natif, enveloppé dans le label, l'indice et la validation Lyra, à utiliser à la place du champ segmenté lr-time-input quand on préfère le sélecteur natif du navigateur.
Code OTP — Champ segmenté pour saisir un code de vérification à usage unique, avec autocomplétion SMS intégrée.
Bouton radio segmenté — Contrôle à choix unique qui prend l'apparence d'un bouton plutôt que d'un cercle, généralement regroupé avec lr-radio-group pour former un contrôle segmenté.
Champ à jetons — Champ associé au formulaire qui collecte une liste de jetons supprimables, comme des étiquettes ou des destinataires.

Affichage des données

Générateur de requêtes de graphe — Éditeur associé au formulaire pour une requête typée de relation ou de chemin dans un graphe, avec ancres d'entité, filtres de type, limites de sauts et requêtes enregistrées.
Calendrier — Calendrier mensuel responsive avec marqueurs d'événements et vue agenda accessible au clavier.
Jauge de contexte — Jauge d'occupation segmentée, en barre ou en anneau, pour un budget de tokens ou une fenêtre de contexte.
Bibliothèque de documents — Inventaire de documents consultable et filtrable, avec versions, tags, propriétaires, fraîcheur, tri et sélection groupée.
Liste de variables d'environnement — Liste clé/valeur masquée pour les variables d'environnement et les secrets, avec révélation et copie par ligne.
Arborescence de fichiers — Préréglage d'explorateur de fichiers basé sur le composant arborescence, avec badges d'état Git et chargement paresseux des répertoires.
Canevas de flux — Canevas déplaçable et zoomable pour construire et exécuter des workflows visuels en DAG.
Contrôles de flux — Groupe de boutons zoom, ajustement et verrouillage pour un canevas de flux associé.
Mini-carte de flux — Carte de vue d'ensemble en coin avec un rectangle de zone visible déplaçable pour un canevas de flux associé.
Nœud de flux — Carte de nœud de workflow avec en-tête, teinte de statut et points de connexion pour un canevas de flux.
Superposition d'exécution de flux — Applique des décorations de statut d'exécution sur un canevas de flux et affiche un résumé compact des étapes.
Entonnoir — Affiche la déperdition de conversion étape par étape sous forme de barres normalisées sur la première étape.
Jauge — Affiche une valeur unique sous forme de jauge radiale, circulaire ou linéaire.
Carte de chaleur — Affiche une matrice ou une grille de type calendrier sous forme de carte de chaleur canvas, réactive au redimensionnement.
Pagination — Navigation par pages contrôlée avec saut de page modifiable et résumé de la plage d'éléments
Générateur de requêtes — Générateur de requêtes structurées composables pour des données tabulaires ou de tableau de bord, combinant des lignes de condition champ/opérateur/valeur avec un combinateur ET/OU.
Bandeau de séquence — Bandeau compact par élément visualisant une séquence d'états catégoriels sous forme de cellules colorées, avec marqueur optionnel.
Mini-graphique — Trace une tendance compacte en SVG inline, sous forme de ligne, de zone remplie ou de barres, pour une série de données.
Statistique — Présente un KPI unique avec unité, pastille de tendance, lignes de ventilation et mini-graphique optionnel.
Tableau — Tableau de données de présentation avec en-têtes triables, sélection, filtrage et pagination.
Chronologie — Séquence reliée de lignes d'événements passés, pour les pistes d'audit, historiques d'agents et changelogs.
Élément de chronologie — Une ligne d'événement pour une chronologie, avec marqueur codé par couleur, titre, horodatage et description.
Arborescence — Hiérarchie dépliable/repliable pour naviguer dans des graphes, documents ou arborescences de fichiers
Nœud d'arborescence — Générateur récursif de lignes treeitem pour un nœud et ses enfants au sein d'une arborescence.
Nuage de mots — Nuage de mots SVG sans dépendance qui dimensionne chaque mot selon son poids
Grille de données — Grille de données virtualisée pour de grands jeux de données, côté client ou serveur, avec tri, filtrage, regroupement, pagination et sélection.

Graphiques

Graphique à barres — Compare des valeurs entre catégories à l'aide de barres verticales ou horizontales.
Boîte à moustaches — Résume des distributions à partir de résumés statistiques à cinq nombres précalculés.
Graphique à bulles — Représente trois dimensions par point à l'aide de la position x, y et du rayon des bulles.
Graphique — Wrapper Chart.js de base qui alimente les visualisations en courbes, barres, secteurs et autres.
Graphique en anneau — Représente des proportions partie-tout sous forme de segments d'anneau.
Histogramme — Regroupe des valeurs numériques en classes de largeur égale pour révéler leur distribution.
Graphique en courbes — Suit des tendances sur un axe continu à l'aide d'une ou plusieurs séries connectées.
Graphique léger — Graphique à barres et en courbes sans dépendances, rendu en SVG pur, sans besoin de Chart.js
Graphique en secteurs — Graphique en secteurs proportionnel montrant la part d'une série dans un tout
Graphique en aires polaires — Graphique en aires polaires représentant chaque catégorie sous forme de secteur dont la taille est proportionnelle à sa valeur
Graphique radar — Graphique radar comparant plusieurs métriques d'une série sur une grille radiale
Nuage de points — Nuage de points affichant des paires de points x/y bruts sur des axes linéaires

Mise en page et navigation

Accordéon — Coordonne un groupe de panneaux repliables, en autorisant éventuellement plusieurs panneaux ouverts simultanément.
Élément d'accordéon — Panneau repliable conçu pour s'intégrer dans un groupe d'accordéon.
Rail de navigation — Rail de navigation responsive qui passe d'un affichage complet à des icônes seules, puis à une superposition sur mobile.
Groupe de rail de navigation — Section titrée, repliable en option, qui regroupe des éléments de navigation au sein d'un rail de navigation.
Élément de rail de navigation — Élément de navigation avec icône et libellé pour un rail de navigation, doté d'un état replié en icônes seules.
Fil d'Ariane — Fil de navigation responsive indiquant la position de l'utilisateur dans la hiérarchie des pages
Élément de fil d'Ariane — Un lien ou le libellé de la page courante au sein d'un fil d'Ariane
Groupe de boutons — Regroupe des boutons d'action associés en un ensemble responsive et étiqueté
Carte — Surface de contenu bordée avec emplacements pour en-tête, média, pied de page et actions.
Carrousel — Carrousel accessible à diapositive unique avec navigation au clavier, indicateurs, bouclage et lecture automatique.
Élément de carrousel — Enveloppe sémantique optionnelle pour une diapositive, appliquant un style d'élément cohérent à un enfant du carrousel.
Palette de commandes — Menu de commandes d'application consultable, avec navigation au clavier et raccourcis.
Groupe de contrôles — Regroupe des contrôles de formulaire hétérogènes et des boutons d'action en une rangée d'outils responsive et centrée.
Grille de tableau de bord — Grille de widgets contrôlée, responsive et accessible au clavier, qui positionne les entrées de mise en page et émet des demandes de déplacement, de redimensionnement et de collision.
Détails — Panneau repliable accessible qui se déplie pour révéler du contenu sous un résumé.
Panneau ancrable — Panneau redimensionnable et repliable, ancré sur un bord de votre mise en page existante.
Panneau d'exploration détaillée — Conteneur de navigation contrôlée qui relie une donnée de graphique ou de tableau à des éléments de preuve, documents, entités ou exécutions d'agent associés, avec un fil d'Ariane.
Élément de menu déroulant — Alias compatible Web Awesome pour une ligne d'action unique au sein d'un menu déroulant.
Barre de filtres — Ligne de filtres de tableau de bord composée de champs Lyra et de puces supprimables, avec états de réinitialisation et de chargement.
Menu — Menu sémantique intégré listant des actions, avec navigation au clavier et sous-menus imbriqués.
Élément de menu — Ligne d'action unique pour un menu, avec icône, case à cocher ou style destructif optionnels.
Élément réorganisable — Ligne unique d'une liste réorganisable, associant des boutons de déplacement vers le haut/bas à un contenu projeté quelconque.
Liste réorganisable — Liste générique de lignes réorganisables, déplacées via des boutons par ligne ou le raccourci Ctrl/Cmd+Flèche.
Intitulé de menu — Ajoute un intitulé non interactif pour regrouper des éléments apparentés dans un menu.
Barre de menus — Barre de menus d'application horizontale, composée de menus déroulants titrés, entièrement navigable au clavier.
Élément de barre de menus — Titre de premier niveau d'une barre de menus, qui ouvre le menu qu'il contient ou agit comme une simple action.
Menu de navigation — Navigation d'en-tête de site composée de liens et de panneaux déroulants, qui se replie derrière un bouton de menu quand la place manque.
Élément de menu de navigation — Entrée d'un menu de navigation : un lien vers une page ou un bouton de divulgation qui ouvre un panneau déroulant.
Page — Structure sémantique d'application dont la navigation passe d'une colonne fixe à un tiroir modal mobile selon l'espace qui lui est réellement alloué, et non selon la fenêtre.
Panneau responsive — Ancre le contenu en ligne sur ordinateur de bureau, ou le présente sous forme de panneau superposé sur mobile
Défileur — Surface de défilement responsive avec contrôles précédent/suivant optionnels pour les rangées de cartes et d'onglets.
Segmenté — Rangée de boutons à sélection unique pour choisir en un coup d'œil l'une de plusieurs options étiquetées.
Division — Divise un tableau de bord en panneaux redimensionnables par glissement, avec repli responsive optionnel.
Panneau divisé — Divise le contenu en deux volets redimensionnables par glissement avec un séparateur unique, une alternative plus simple au lr-multi-split multi-panneaux.
Étapes — Guide les utilisateurs à travers un assistant multi-étapes ordonné, avec état par étape et accès direct par clic.
Onglets — Barre d'onglets qui affiche un seul panneau du DOM léger à la fois, avec une navigation au clavier complète.
Onglet — Descripteur d'onglet compatible Web Awesome/Shoelace, associé à son panneau dans une barre d'onglets via les attributs panel et name.
Panneau d'onglet — Descripteur de panneau compatible Web Awesome/Shoelace, associé à son onglet dans une barre d'onglets via les attributs name et panel.
Liste virtuelle — Conteneur de liste fenêtré qui ne rend que les lignes visibles à l'écran pour de grandes collections défilantes
Widget — Conteneur de panneau titré, doté de bascules optionnelles de repli et de passage en plein écran

Superpositions et retours

Toast — Zone d'empilement qui ancre les notifications toast à un coin de l'écran.
Élément toast — Toast unique et fermable, avec un accent de sévérité, une icône optionnelle et une temporisation de fermeture automatique.
Puce — Petite pastille pour un tag, un filtre ou une portée, pouvant être supprimable ou activable.
Groupe de puces — Enveloppe un ensemble de puces avec un bouton de dépassement +N optionnel lorsqu'elles dépassent une limite.
Alerte — Message d'alerte fermé par défaut, avec fermeture automatique programmable et bascule optionnelle vers la pile de notifications toast partagée.
Badge — Étiquette de statut compacte pour signaler un état, un nombre ou une catégorie directement dans le texte
Encart — Surface de message intégrée au contenu pour des textes de statut, d'avertissement et d'erreur, pouvant être fermée.
Menu contextuel — Transforme n'importe quelle zone en cible de clic droit, d'appui long ou de Maj+F10 qui ouvre un menu d'actions.
Boîte de dialogue — Superposition modale qui capture le focus, pour les confirmations, les formulaires et autres tâches interruptives.
Tiroir — Fait glisser un panneau modal depuis n'importe quel bord du viewport, pour des filtres ou des contrôles contextuels.
Menu déroulant — Fenêtre contextuelle à rôle de menu qui ancre une liste d'actions à un déclencheur fourni par le consommateur
État vide — Communique un état vide ou une absence de données à l'aide d'une icône, d'un message et d'actions facultatives.
Kbd — Puce adaptée à la plateforme qui affiche un raccourci clavier sous forme de touches
Fenêtre contextuelle — Surface flottante déclenchée au clic, à fermeture légère, pour du contenu et des contrôles contextuels
Popup — Primitive de positionnement bas niveau qui maintient un panneau flottant aligné sur son ancre, le même moteur qu'utilisent la fenêtre contextuelle et l'infobulle.
Barre de progression — Indicateur de progression horizontal déterminé ou indéterminé, avec valeur facultative.
Anneau de progression — Indicateur de progression circulaire déterminé ou indéterminé, avec libellé central.
Notation — Notation par étoiles accessible au clavier, avec remplissage partiel à précision fractionnaire
Squelette — Espace réservé animé qui tient lieu de contenu pendant son chargement.
Indicateur de chargement — Signale une tâche de fond en cours à l'aide d'un indicateur d'activité animé et indéterminé.
Étiquette — Alias sémantique du style badge, pour étiqueter des mots-clés ou des catégories
Infobulle — Infobulle déclenchée au survol ou au focus, qui décrit un déclencheur fourni par le consommateur

Visionneuses de documents et fichiers

Visionneuse d'archive — Liste les noms de fichiers et les tailles non compressées d'une archive ZIP sans en extraire le contenu.
Visionneuse de calendrier — Analyse un fichier calendrier .ics et affiche ses événements sous forme de résumés, horaires et lieux.
Visionneuse de contact — Récupère un document vCard et affiche une carte accessible par contact.
Visionneuse CSV — Récupère un fichier CSV et affiche ses lignes dans une feuille virtualisée et défilable.
Visionneuse de jeu de données — Récupère du texte délimité et l'affiche sous forme de tableau de données typé et accessible.
Comparaison de documents — Comparaison côte à côte ou en ligne de deux versions d'un document, combinant une vue diff textuelle avec des aperçus de documents rendus.
Aperçu de document — Affiche un aperçu intégré d'un document ou d'une pièce jointe selon son type MIME, avec repli sur le téléchargement.
Visionneuse de document — Affiche un document dans une boîte de dialogue, avec un registre extensible de moteurs de rendu par type MIME.
Visionneuse DOCX — Affiche un fichier DOCX sous forme de HTML sémantique nettoyé, via le convertisseur mammoth.
Visionneuse de livre numérique — Affiche un EPUB avec navigation par chapitres, à l'aide de la dépendance facultative epub.js.
Visionneuse d'e-mail — Analyse un message .eml et l'affiche avec ses en-têtes, son corps nettoyé et ses pièces jointes.
Visionneuse GeoJSON — Récupère, valide et affiche les entités d'un fichier GeoJSON sur une carte.
Couche de surbrillance — Superposition qui dessine des rectangles de surbrillance activables sur un contenu de document positionné.
Visionneuse HTML — Récupère une URL et affiche son HTML en toute sécurité après nettoyage.
Inclusion — Récupère un fragment HTML et le transclut comme contenu de page nettoyé dans le light DOM.
Visionneuse de notebook — Moteur de rendu de notebook Jupyter en lecture seule, composant Markdown, code et sorties de cellule enrichies.
Rail de pages — Rail de vignettes vertical virtualisé pour parcourir un document paginé.
Visionneuse PDF — Récupère et affiche des pages PDF avec zoom, pagination et une couche de texte sélectionnable
Visionneuse PPTX — Visionneuse côté client en mode best-effort pour les présentations PowerPoint PPTX.
Visionneuse de feuille de calcul — Récupère et affiche des classeurs .xlsx et .xls (format hérité) avec onglets de feuilles et lignes virtualisées.
Visionneuse SVG — Récupère et affiche en toute sécurité un document SVG intégré et nettoyé à partir d'une URL.
Visionneuse XML — Vue arborescente repliable et copiable pour inspecter des documents XML.

Médias et fichiers

Puce de pièce jointe — Puce compacte pour un fichier joint à un message, avec statut d'envoi, progression et nouvelle tentative.
Avatar — Petit marqueur d'identité affichant une icône, une image ou des initiales de repli pour une personne ou une entité
Image animée — Lit un GIF/APNG/WebP animé avec un contrôle lecture/pause qui respecte la préférence de mouvement réduit.
Animation — Anime de façon déclarative un enfant placé dans un slot, à l'aide de préréglages nommés ou de keyframes personnalisées.
Déclencheur de pièce jointe — Commande compacte d'ajout de pièce jointe qui ouvre un sélecteur de fichiers ou un menu de fonctionnalités dans une zone de composition de chat.
Lecteur audio/vidéo — Lecteur audio/vidéo avec transcription synchronisée, forme d'onde et contrôle de la vitesse de lecture.
Groupe d'avatars — Empile des avatars superposés dans une rangée compacte qui regroupe les avatars excédentaires dans un badge +N
Zone de dépôt — Conteneur par glisser-déposer qui transforme n'importe quelle zone en cible de dépôt de fichiers, sans sélecteur de fichiers intégré.
Icône de fichier — Badge de type de fichier localisé, déterminé à partir d'un type MIME ou d'un nom de fichier.
Champ de fichier — Zone de dépôt par glisser-déposer ou clic pour parcourir, qui émet les fichiers sélectionnés.
Drapeau — Drapeau de pays ou de langue affiché dans un cadre thématisable, circulaire en option.
Comparateur d'images — Fait glisser un séparateur accessible au clavier pour comparer côte à côte des surfaces avant/après.
Visionneuse d'image — Visionneuse d'image raster complète avec zoom et déplacement, surbrillances de zones étiquetées et annotation optionnelle.
Lightbox — Visionneuse d'image modale plein écran avec navigation précédent/suivant et zoom
Carte — Wrapper de carte MapLibre GL avec légende déclarative, choroplèthe et marqueurs
Carte média — Aperçu intégré d'une image, d'une vidéo ou d'une pièce jointe dans un message de chat.
Zoom et déplacement — Zone défilable pour inspecter avec zoom un contenu en slot ou une image, à un niveau de zoom borné.
Lecture — Commande de lecture/pause qui fait progresser un index sur une plage à intervalle fixe.
Code QR — Encode n'importe quelle valeur sous forme d'un symbole QR scannable, dessiné sur un canvas.
Vidéo — Lecteur vidéo intégré avec commandes personnalisées, sous-titres sélectionnables et aperçus en vignettes.
Liste de lecture vidéo — Enchaîne une liste de vidéos dans une liste de lecture navigable, avec passage automatique à la vidéo suivante.
Cadre zoomable — Aperçu en iframe sandboxée avec des contrôles de zoom discrets ; l'ancienne surface d'inspection de contenu en slot ou d'image est désormais lr-pan-zoom.

Utilitaires

Intersection Observer — Émet les entrées d'intersection natives lorsque les cibles placées dans un slot entrent dans la fenêtre d'affichage ou en sortent.
Observateur de mutations — Surveille le DOM projeté dans un slot pour détecter les changements d'éléments et d'attributs, et transmet les enregistrements de mutation natifs
Observateur de redimensionnement — Surveille les éléments d'un slot et émet des entrées de redimensionnement typées, sans habillage visuel
Bouton de copie — Bouton à icône seule qui copie une valeur texte dans le presse-papiers, avec confirmation visuelle par coche.
Vue diff — Calcule une diff ligne à ligne entre deux chaînes et l'affiche sous forme de sortie unified-diff colorée.
Séparateur — Séparateur sémantique thématisable, pour diviser le contenu horizontalement ou verticalement.
Bouton d'export — Télécharge les données d'un tableau au format CSV ou JSON, en un seul format ou via un menu de sélection.
Format d'octets — Formatage de taille en octets adapté à la locale, avec un pas d'unité et une précision ajustables.
Format de date — Formatage de date et heure adapté à la locale via Intl.DateTimeFormat.
Format de nombre — Formatage de nombres, devises et notation compacte adapté à la locale via Intl.NumberFormat.
Icône — Affiche des glyphes SVG inline nets à partir d'un jeu de tracés nommés intégré, sans aucune dépendance.
Visionneuse JSON — Vue arborescente repliable et copiable pour inspecter n'importe quelle charge JSON
Date connue — Saisie en trois champs jour/mois/année pour une date que l'utilisateur connaît déjà
Région dynamique — Région dynamique ARIA masquée visuellement qui limite le débit des annonces aux lecteurs d'écran
Popover de mention — Autocomplétion ancrée au point d'insertion pour les mentions @ et les commandes slash dans un champ de texte.
État d'interrogation — Compte à rebours jusqu'à la prochaine actualisation programmée, avec contrôle intégré de pause et reprise.
Contenu aléatoire — Fait défiler le contenu placé en slot de façon aléatoire ou séquentielle, pour des textes A/B et témoignages
Temps relatif — Affiche un horodatage relatif adapté à la locale qui se rafraîchit automatiquement.
Visite guidée — Parcours guidé étape par étape avec mise en surbrillance, pour la prise en main initiale des nouveaux utilisateurs.
Masqué visuellement — Masque du contenu à l'écran tout en le gardant accessible aux lecteurs d'écran, puis le réaffiche au focus.