Aperçu à venir
Motion
Les jetons, les règles et les primitives d'animation partagés par tous les composants de `@whoa-studio/ui`.
EssayerActivity
pnpm dlx shadcn@latest add https://ugolin-olle.com/r/activity.json0137 éléments
Composants
Des éléments d'interface unitaires, prêts à copier-coller dans vos projets.
Headers
Composants d'en-tête pour afficher des titres hiérarchisés.
Input
Un composant d'entrée de texte avec icônes et états de validation.
Shortcut
Affiche des raccourcis clavier composables, avec touches de modification adaptées à la plateforme.
Button
Un composant de bouton pour afficher des éléments interactifs.
Gandi Button
Un bouton inspiré du design de Gandi.net.
Apple Button
Un bouton inspiré des Human Interface Guidelines d'Apple.
Shopify Button
Un bouton inspiré du design system Polaris de Shopify.
Accordion
Sections repliables, une ou plusieurs ouvertes à la fois.
Alert
Un message en ligne, avec une icône, un titre et une description.
Alert Dialog
Une modale qui demande une confirmation avant une action destructive.
Avatar
Une image de profil avec un repli sur les initiales.
Button
Le bouton de base, en plusieurs variantes.
Checkbox
Une case à cocher accessible.
Collapsible
Un panneau qui se déplie sous son déclencheur.
Combobox
Un champ avec suggestions filtrées pendant la frappe.
Context Menu
Un menu ouvert par clic droit.
Dialog
Une modale pour un formulaire ou un contenu ciblé.
Dropdown Menu
Un menu d’actions ouvert depuis un bouton.
Empty
Un état vide avec icône, titre et description.
Field
Un champ de formulaire avec libellé, aide et erreur.
Hover Card
Un aperçu affiché au survol d’un lien.
Input OTP
Un champ pour saisir un code à usage unique.
Menubar
Une barre de menus à la manière d’une application de bureau.
Navigation Menu
Une navigation principale avec panneaux déroulants.
Popover
Un panneau flottant ancré à son déclencheur.
Progress
Une barre de progression.
Radio Group
Un choix unique parmi plusieurs options.
Select
Une liste déroulante pour choisir une valeur.
Sheet
Un panneau qui glisse depuis un bord de l’écran.
Skeleton
Des blocs de remplacement pendant un chargement, et un spinner.
Switch
Un interrupteur entre deux états.
Tabs
Des onglets pour basculer entre des vues.
Toggle
Un bouton à deux états.
Tooltip
Une info-bulle affichée au survol ou au focus.
Dream Sky
Fond WebGL onirique, avec ciel dégradé, nuages, cercles concentriques et traînées prismatiques.
ASCII Black Hole
Fond plein cadre de glyphes ASCII qui tournent en spirale vers un trou noir, dessiné sur un seul canvas.
029 éléments
Blocks
Des sections de page complètes (hero, blog, footer...) pour composer rapidement.
Activity
Une heatmap annuelle premium avec tabs dynamiques, statistiques et légende.
Status Card
Une carte de statut de déploiement avec compteur, jauge segmentée et journal de build.
Calendar Sync
Une carte d'événement avec tuile de date et action de synchronisation animée.
Usage Card
Une carte de consommation de crédits avec répartition, graphique journalier et limites.
Command Search
Une recherche de commande en ligne avec onglets, filtres en direct et navigation au clavier.
World Clock
Une horloge mondiale avec cadran radial de 24 heures, liste de villes et chiffres qui défilent.
Blog
Une grille de cartes d'articles avec image, badge et lien de lecture.
Kanban
Un tableau Kanban avec glisser-déposer, limites WIP, tiroir de détail, filtres et annuler/rétablir.
Hero Sky
Une section d'accueil plein cadre sur le fond Dream Sky, avec navigation, badge, titre, texte et bouton.
033 éléments
Templates
Des pages entières prêtes à déployer pour lancer votre prochain projet.
App Shell 1
Un shell d'application responsive avec sidebar repliable, navigation groupée et header collant.
Dashboard 1
Un dashboard d'approbations avec navigation, liste filtrable et panneau de détail.
Dashboard 2
Un dashboard CRM sombre avec un graphique de prévisions animé par des ressorts.
