Angular 22 · Standalone · Paquets indépendants

Bibliothèque de composants Angular pour applications standalone

Composants UI Angular réutilisables pour applications standalone, flux avec Angular Signals, accessibilité, variables CSS et documentation prête pour la production couvrant les modales, les tableaux de données, la navigation, les calendriers et bien plus.

npm install ng-hub-ui-modal
De vrais composants, en direct.
Ce n’est pas une capture d’écran.
<hub-panels />
AL
GH
AT
<hub-avatar />
<hub-skeleton />
--hub-sys-color-primarynpm i ng-hub-ui-*
19Composants
80+Variables CSS
7Thèmes
v22Angular

Une seule bibliothèque, toutes les marques

Chaque composant est piloté par des variables CSS. Choisissez un thème et regardez tout le site se redessiner — sans rebuild, sans CSS supplémentaire.

Essayez — cela change le thème en direct de tout le site.

AL
GH
AT
Variables CSS

Pourquoi Hub UI ?

Entièrement accessible

Tous les composants respectent les recommandations WCAG 2.1 avec une navigation complète au clavier et la prise en charge des lecteurs d’écran.

Piloté par les variables CSS

Chaque composant expose des propriétés CSS personnalisées. Remplacez n’importe quel token pour l’adapter à votre marque — les changements se propagent instantanément sur tous les thèmes.

TypeScript d’abord

Typage strict de bout en bout. Profitez d’une autocomplétion complète, d’une sécurité à la compilation et d’une expérience développeur de premier ordre.

Architecture standalone

Construit sur le modèle de composants standalone moderne d’Angular. Importez uniquement ce dont vous avez besoin et gardez vos bundles légers.

Du vrai code, un vrai composant

Quelques lignes de template suffisent. Le snippet à gauche affiche le composant en direct à droite.

Template
Résultat en direct
The first enabled panel is activated automatically.
Switch panels with a click or the arrow keys.
Each panel projects its own content.

Tous les composants

Explorez des composants Angular conçus pour de vraies équipes produit, des design systems réutilisables et des applications standalone maintenables.

Modal

Composant modale Angular accessible avec empilement, mode plein écran et modèles.

Paginable

Tableau de données et liste paginée Angular avec filtrage, tri et opérations côté serveur.

Sortable

Utilitaires de liste triable Angular pour les tableaux, les contrôles FormArray et les constructeurs glisser-déposer.

Calendar

Composant calendrier Angular pour la planification, les événements et les interfaces de planning.

Avatar

Composant avatar Angular avec initiales, images de repli et indicateurs de statut.

Board

Composant tableau Kanban Angular avec glisser-déposer pour les interfaces de flux de travail.

Breadcrumbs

Fil d’Ariane Angular avec intégration du routeur et modèles personnalisés.

History

Store d’annulation et de rétablissement Angular pour éditeurs, formulaires et outils low-code.

Nav

Menus de navigation Angular pour barres latérales, menus déroulants, panneaux drill-down et mises en page responsives.

Portal

Rendu portal et overlay Angular pour tiroirs, panneaux flottants et conteneurs dynamiques.

Skeleton

Espaces réservés skeleton Angular avec presets, modèles DSL en ligne et effets shimmer responsives.

Stepper

Composant stepper Angular pour les formulaires assistants, l’onboarding et les flux de validation multi-étapes.

Toast

Composant Angular de toasts et notifications avec positionnement, empilement et fermeture automatique.

Buttons

Boutons, FAB, speed dial et directives dropdown Angular pour des interfaces riches en actions.

Badges

Composant Angular de badges pour étiquettes, compteurs et indicateurs d'état, entièrement personnalisable.

Panels

Composant Angular de panneaux et accordéon avec expansion simple ou multiple et thématisation complète.

Forms

Bibliothèque Angular de formulaires avec champs avancés, select, validation et rendu dynamique.

Milestones

Composant Angular de timeline et d'étapes de progression en disposition verticale, horizontale et animée.

Utils

Bibliothèque utilitaire Angular avec overlays, gestion du focus, pipes et helpers de traduction.

Démarrez en quelques secondes

1

Installez un composant

npm install ng-hub-ui-modal
2

Importez-le en standalone

import { HubModalModule } from 'ng-hub-ui-modal';
3

Personnalisez avec les variables CSS

--hub-modal-border-radius: 1rem;
Lire la documentation

Construisez votre prochaine UI Angular avec Hub UI

Open source, modulaire et prêt pour la production. Installez votre premier composant dès aujourd’hui.