ngx-gaia

Common Gaia UI components for Angular.

• 🔥 Uses storybook;
• 🔥 Follows semantic versioning;
• 🔥 Uses conventional commits together with standard version for a better changelog;
• 🔥 Accessibility in mind;

Demo & documentation

https://super-barnacle-7kqz8r2.pages.github.io/

Disclaimer

The Tailwind CSS utility classes (e.g. flex gap-2) used in these storybook examples are used for demo purposes only, they represent UI structure rather than specific design choices. Your application will need to include its own Tailwind CSS setup or alternative solution.

Installation

ng add @vsn-ux/ngx-gaia

Manual installation

1. Install this package:

   npm i @vsn-ux/ngx-gaia @vsn-ux/gaia-styles lucide-angular

2. Import the required styles inside your global (e.g. style.css) file:

   // load inter font faces, you can skip this if you already have it in your project or want to use CDN
   @import '@vsn-ux/gaia-styles/font/inter.css';
   
   // One import that includes both global `@vsn-ux/gaia-styles` styles and extensions needed for the library
   @import '@vsn-ux/ngx-gaia';
   
   // In case you want to have a more granual control, import these prebuilt files manully:
   // @import '@angular/cdk/overlay-prebuilt.css';
   // @import '@vsn-ux/gaia-styles/all.css';

Browser support

Follows PDAB Compatibility Policy:
the latest major stable version of Firefox, Chrome, Safari and Edge are supported. No support for IE.

Contributing to the library

You are more than welcome to open an issue or create a pull-request.
In the latter case, please make sure the changes follows the same coding principles,
is covered with unit tests and meets the official Gaia Design guidelines. 🙏