VLLNT UI · Famille de composants

Composants Data

Data components turn records into something readable — sortable tables, lists, charts, metrics, gauges, and live status boards. Feed them your data and they handle filtering, formatting, and layout.

Charts & Graphs

Area, bar, line, pie, radar, gauge, sankey, and flow charts for visualizing any dataset.

Area Chart

Affiche un graphique en aires pour la visualisation de donnees. Installez Area Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
Voir le composant

Bar Chart

Affiche un graphique a barres pour la visualisation de donnees. Installez Bar Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
Voir le composant

Line Chart

Affiche un graphique en courbes pour la visualisation de donnees. Installez Line Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
Voir le composant

Pie Chart

Graphique circulaire ou en anneau proportionnel pour les comparaisons partie-tout. Installez Pie Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Radar Chart

Graphique en radar comparant plusieurs metriques sur des axes communs. Installez Radar Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Gauge Chart

Jauge semi-circulaire pour une valeur unique dans une plage. Installez Gauge Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Sankey Chart

Diagramme de flux montrant des liens ponderes entre les noeuds. Installez Sankey Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
1 storyVoir le composant

Flow Diagram

Diagramme de flux interactif avec noeuds, liens et controles. Installez Flow Diagram depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
1 storyVoir le composant

Market & Trading

Candlestick charts, order books, treemaps, ticker tapes, and watchlists for financial and market data.

Candlestick Chart

Graphique financier OHLC pour l'action des prix session par session. Installez Candlestick Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Order Book

Carnet de profondeur achat/vente de niveau II avec barres de taille cumulee et affichage du spread. Installez Order Book depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Market Treemap

Carte thermique de marche par secteur utilisant des tuiles ponderees et des couleurs de performance signees. Installez Market Treemap depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Ticker Tape

Bandeau defilant de style marquee avec badges de prix et de variation. Installez Ticker Tape depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Watchlist

Liste de symboles suivis avec prix, variation et resume des hausses et baisses. Installez Watchlist depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Tables & Lists

Sortable data tables, key-value lists, and side-by-side comparisons for structured records.

Data Table

Tableau de donnees ameliore avec des controles de tri, de filtrage, de selection et de pagination. Installez Data Table depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
1 storyVoir le composant

Table

Tableau de donnees stylise avec des sections d'en-tete, de corps et de pied de page. Installez Table depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
1 storyVoir le composant

Data List

Disposition semantique de metadonnees cle-valeur pour afficher des etiquettes avec des valeurs. Installez Data List depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Usage Breakdown

Liste classee de consommation des ressources avec part relative et indices de tendance. Installez Usage Breakdown depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Comparison

Disposition de comparaison cote a cote pour du contenu ou des fonctionnalites. Installez Comparison depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Metrics & KPIs

Stat cards, metric gauges, sparklines, progress bars, and overview boards for headline metrics and dashboards.

Stat Card

Carte de KPI principale pour les metriques, les tendances et le contexte associe. Installez Stat Card depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Metric Cluster

Pile compacte de metriques liees epinglee au coin d'un objet du canvas. Installez Metric Cluster depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

Metric Gauge

Affichage en arc et cadran en temps reel pour les pourcentages surveilles et l'utilisation. Installez Metric Gauge depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Sticky Metric

Pastille de metrique epinglee qui adhere au coin d'un objet du canvas. Installez Sticky Metric depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

Threshold Ring

Jauge circulaire compacte indiquant a quel point une valeur approche un seuil. Installez Threshold Ring depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
4 storiesVoir le composant

Sparkline Grid

Grille de KPI composee de tuiles de valeurs etiquetees, chacune associee a une tendance sparkline compacte. Installez Sparkline Grid depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Overview Board

Grille de cartes d'apercu pour des tableaux de bord en un coup d'oeil — une rangee de metriques cles avec un espacement et un ton coherents. Installez Overview Board depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
1 storyVoir le composant

Progress Bar

Indicateur de progression visuel avec etiquettes et etat d'achevement. Installez Progress Bar depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
1 storyVoir le composant

Progress Card

Carte affichant les metriques de progression et le statut. Installez Progress Card depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
1 storyVoir le composant

Status & Signals

Status boards, indicators, severity badges, alerts, and timers for real-time operational health.

Status Board

Grille de sante des services pour faire apparaitre l'etat de l'infrastructure, la pression des files d'attente et les incidents. Installez Status Board depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
3 storiesVoir le composant

Status Indicator

Etiquette de statut compacte avec options de ton, de variante et de point d'activite. Installez Status Indicator depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Severity Badge

Etiquette de gravite operationnelle avec variantes de ton et pulsation optionnelle pour les incidents critiques. Installez Severity Badge depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
5 storiesVoir le composant

Alert

Affiche un message d'alerte a l'utilisateur. Installez Alert depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Countdown Timer

Compte a rebours et minuteur SLA pour les echeances, les escalades et les fenetres de reponse. Installez Countdown Timer depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Presence Sync Indicator

Pastille compacte qui affiche l'etat de connexion et de synchronisation en direct pour un canvas collaboratif. Installez Presence Sync Indicator depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

Activity & Presence

Activity feeds, heatmaps, timelines, live streams, and presence avatars for monitoring what is happening and who is online.

Activity Heatmap

Grille de type contributions pour visualiser l'activite operationnelle dans le temps. Installez Activity Heatmap depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
3 storiesVoir le composant

Activity Log

Flux d'activite pagine pour l'historique d'audit et les changements analytiques. Installez Activity Log depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Contribution Graph

Carte thermique de style GitHub de l'activite quotidienne au fil du temps. Installez Contribution Graph depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
2 storiesVoir le composant

Live Feed

Flux d'activite continu pour faire remonter les incidents, les deploiements et les signaux operationnels en temps reel. Installez Live Feed depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Bottom Activity Strip

Rangee fine a defilement horizontal des evenements recents du canevas pour une activite en direct discrete. Installez Bottom Activity Strip depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
4 storiesVoir le composant

Run Timeline

Chronologie d'execution multi-voies montrant les phases d'execution au fil du temps, avec curseur optionnel. Installez Run Timeline depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
4 storiesVoir le composant

Heat Overlay

Surcouche de type carte de chaleur dessinant des taches radiales douces pour echantillons d'activite du canvas. Installez Heat Overlay depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
4 storiesVoir le composant

Gantt Chart

Chronologie de projet avec barres de taches, superpositions de progression, jalons et un indicateur du jour sur des echelles jour/semaine/mois/trimestre. Installez Gantt Chart depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
4 storiesVoir le composant

Mini Map Panel

Panneau d'apercu de la vue montrant les limites du canvas, les marqueurs et la fenetre de zoom actuelle. Installez Mini Map Panel depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:Web
1 storyVoir le composant

World Clock Bar

Affichage multi-fuseaux horaires pour les equipes en continu et les passations operationnelles. Installez World Clock Bar depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
3 storiesVoir le composant

Avatar Group

Pile d'avatars superposes pour les participants, les personnes assignees et les contextes collaboratifs. Installez Avatar Group depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
2 storiesVoir le composant

Presence Stack

Avatars de presence en direct qui se chevauchent, avec pastilles de statut et une puce de debordement raisonnable. Installez Presence Stack depuis le registre VLLNT UI avec la CLI shadcn.

Plateformes prises en charge:WebNatif
4 storiesVoir le composant

Questions frequentes

What's in the data family?
Tables and data tables, lists, charts, metrics, gauges, status boards, and activity feeds — the surfaces that read, filter, and summarize records.