loading
logo

Library catalogue

Descarga el CV

Hub-UI: My Open Source Angular Library Ecosystem

Hub-UI, open source Angular component ecosystem

Hub-UI is the Angular library ecosystem I have been building since 2020. It was born from real needs in professional projects: instead of depending on monolithic frameworks or rewriting the same logic over and over, I chose to create independent, lightweight, production-ready components.

21Libraries
MITLicense
2020Since
npmPublished

Interface Components

ng-hub-ui-modal

Modal system independent of any CSS framework. Handles lifecycle, accessibility (focus traps, ARIA) and is fully customisable through templates.

ng-hub-ui-stepper

Step component for wizard-style flows. Supports linear and non-linear navigation, per-step validation and full design customisation.

ng-hub-ui-accordion

Collapsible panels with multiple or exclusive opening, smooth animations and full accessibility. Ideal for FAQs and settings panels.

ng-hub-ui-skeleton

Animated placeholders for loading states. They mirror the visual structure of the content being loaded, improving perceived performance.

ng-hub-ui-avatar

Avatars with automatic fallback: if the image fails to load, it falls back to initials, Gravatar or other sources. Multiple shapes and sizes.

ng-hub-ui-signature

Digital signature pad. Captures handwritten signatures on canvas, exports them as images and validates the signature. Useful in contract flows and legal forms.

Navigation & Layout

ng-hub-ui-nav

Flexible navigation system for menus, sidebars and nav bars. Decoupled from Angular's route configuration.

ng-hub-ui-breadcrumbs

Dynamic breadcrumbs generated automatically from the route configuration. Supports i18n and RTL reading.

ng-hub-ui-portal

Renders components and templates anywhere in the DOM. Internal foundation of other ecosystem components such as the modal.

Data & Interaction

ng-hub-ui-paginable

Tables and lists with built-in client and server pagination. Fully customisable headers, cells and filters.

ng-hub-ui-board

Kanban board with native drag & drop. Move cards between columns, reorder them and customise the design completely.

ng-hub-ui-sortable

Directive for sortable lists with drag & drop. Built on SortableJS, with FormArray support, animations and typed events.

ng-hub-ui-calendar

Calendar with month, week and day views. Supports events, date ranges and cell customisation.

Visualization

ng-hub-ui-charts

Declarative charting framework built on D3. Bars, lines, areas, pies and more, with animations and responsive design.

ng-hub-ui-graph

Visualisation of graphs and directed networks. For org charts, flow diagrams, dependency trees or any node structure.

Utilities

ng-hub-ui-utils

Cross-cutting pipes, directives and services shared across the ecosystem. DOM utilities, reactive helpers and formatting functions.

ES