N-ISI Design System

Supporting UI component library for the N-ISI project
(Novi informacijski sistem inšpektorjev — New Information System for Inspectors)

📦 About

This package contains shared, reusable standalone Angular components and UI building blocks for all N-ISI frontend applications.
It is based on PrimeNG and fully supports Angular 19+, Module Federation, and lazy-loaded microfrontends.

🚀 Usage

Install the package via npm:

npm install @n-isi-platform/design-system

Then import and use the components in your Angular module or standalone component:

import { FancyButtonComponent } from '@n-isi-platform/design-system';

🧩 Features

• ✅ Angular 19+ support
• ✅ PrimeNG-based standalone components
• ✅ Module Federation compatible (singleton, strictVersion)
• ✅ Lazy-loadable components
• ✅ Custom theming integration (optional)

🛠️ Development

To build the package locally:

npm run build:design-system

Or directly via ng-packagr:

npx ng-packagr -p projects/design-system/ng-package.json

To test the local build in another Angular project:

npm install file:../dist/design-system

📁 Project Structure

projects/
└── design-system/
    ├── src/
    │   ├── lib/
    │   │   └── [components]/
    │   └── public-api.ts
    ├── package.json
    ├── ng-package.json
    └── README.md

🔒 Dependencies

This package defines Angular, PrimeNG and others as peerDependencies.
The host application must provide matching versions:

"peerDependencies": {
  "@angular/core": "19.2.6",
  "@angular/common": "19.2.6",
  "primeng": "19.1.3"
}

📦 Publishing

After building the package:

cd dist/design-system
npm publish --access public

For scoped or private registry publishing, make sure .npmrc is configured accordingly.

👨‍💻 Authors

• Endava (@marko.kovacic)