KoliBri Angular Adapter (v21)

This package provides an Angular adapter for KoliBri components, making them easily usable in Angular applications.

Installation

npm install @public-ui/angular-v21
pnpm add @public-ui/angular-v21

Usage

With Standalone Components (Recommended)

import { Component } from '@angular/core';
import { KolButton } from '@public-ui/angular-v21';

@Component({
	selector: 'app-root',
	standalone: true,
	imports: [KolButton],
	template: ` <kol-button _label="Click me!"></kol-button> `,
})
export class AppComponent {}

Available Components

All KoliBri components are available as standalone components. Here's how to use them:

import { KolButton, KolInputText, KolHeading } from '@public-ui/angular-v21';

@Component({
  // ...
  imports: [KolButton, KolInputText, KolHeading],
})

Migration from NgModule to Standalone

If you're migrating from the NgModule approach to standalone components:

1. Remove the KoliBriModule import from your NgModule
2. Import the specific components you need directly
3. Add them to your component's imports array
4. Make sure your component is marked as standalone: true

Example migration:

// Before (NgModule)
import { KoliBriModule } from '@public-ui/angular-v21';

@NgModule({
	imports: [KoliBriModule],
})
export class AppModule {}

// After (Standalone)
import { KolButton } from '@public-ui/angular-v21';

@Component({
	standalone: true,
	imports: [KolButton],
})
export class AppComponent {}

Browser Support

This package supports all modern browsers that are supported by Angular 21.

Tokens can be customized with your own theme. See default theme README.

License

EUPL-1.2

References

• Architecture Concept
• Project Documentation