@public-ui/angular-v20 3.0.1-rc.0 → 3.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,56 +1,90 @@
1
1
  # KoliBri Angular Adapter (v20)
2
2
 
3
- [![npm](https://img.shields.io/npm/v/@public-ui/angular-v20)](https://www.npmjs.com/package/@public-ui/components)
4
- [![license](https://img.shields.io/npm/l/@public-ui/angular-v20)](https://github.com/public-ui/kolibri/blob/main/LICENSE)
5
- [![downloads](https://img.shields.io/npm/dt/@public-ui/angular-v20)](https://www.npmjs.com/package/@public-ui/angular-v20)
3
+ [![npm](https://img.shields.io/npm/v/@public-ui/angular-20)](https://www.npmjs.com/package/@public-ui/components)
4
+ [![license](https://img.shields.io/npm/l/@public-ui/angular-20)](https://github.com/public-ui/kolibri/blob/main/LICENSE)
5
+ [![downloads](https://img.shields.io/npm/dt/@public-ui/angular-20)](https://www.npmjs.com/package/@public-ui/angular-20)
6
6
  [![issues](https://img.shields.io/github/issues/public-ui/kolibri)](https://github.com/public-ui/kolibri/issues)
7
7
  [![pull requests](https://img.shields.io/github/issues-pr/public-ui/kolibri)](https://github.com/public-ui/kolibri/pulls)
8
- [![size](https://img.shields.io/bundlephobia/min/@public-ui/angular-v20)](https://bundlephobia.com/result?p=@public-ui/angular-v20)
8
+ [![size](https://img.shields.io/bundlephobia/min/@public-ui/angular-20)](https://bundlephobia.com/result?p=@public-ui/angular-20)
9
9
  ![contributors](https://img.shields.io/github/contributors/public-ui/kolibri)
10
10
 
11
11
  This package provides an Angular adapter for KoliBri components, making them easily usable in Angular applications.
12
12
 
13
13
  ## Installation
14
+
14
15
  ```bash
15
16
  npm install @public-ui/angular-v20
16
17
  ```
17
18
 
19
+ ## Usage
20
+
18
21
  ### With Standalone Components (Recommended)
22
+
19
23
  ```typescript
20
24
  import { Component } from '@angular/core';
21
25
  import { KolButton } from '@public-ui/angular-v20';
22
26
 
23
27
  @Component({
24
- selector: 'app-root',
25
- standalone: true,
26
- imports: [KolButton],
27
- template: ` <kol-button _label="Click me!"></kol-button> `,
28
+ selector: 'app-root',
29
+ standalone: true,
30
+ imports: [KolButton],
31
+ template: ` <kol-button _label="Click me!"></kol-button> `,
28
32
  })
29
33
  export class AppComponent {}
30
34
  ```
31
35
 
32
36
  ## Available Components
37
+
33
38
  All KoliBri components are available as standalone components. Here's how to use them:
39
+
34
40
  ```typescript
35
41
  import { KolButton, KolInputText, KolHeading } from '@public-ui/angular-v20';
36
42
 
37
43
  @Component({
44
+ // ...
38
45
  imports: [KolButton, KolInputText, KolHeading],
39
46
  })
40
47
  ```
41
48
 
42
49
  ## Migration from NgModule to Standalone
50
+
51
+ If you're migrating from the NgModule approach to standalone components:
52
+
43
53
  1. Remove the `KoliBriModule` import from your NgModule
44
54
  2. Import the specific components you need directly
45
55
  3. Add them to your component's `imports` array
46
- 4. Ensure your component is marked `standalone: true`
56
+ 4. Make sure your component is marked as `standalone: true`
57
+
58
+ Example migration:
59
+
60
+ ```typescript
61
+ // Before (NgModule)
62
+ import { KoliBriModule } from '@public-ui/angular-v20';
63
+
64
+ @NgModule({
65
+ imports: [KoliBriModule],
66
+ })
67
+ export class AppModule {}
68
+
69
+ // After (Standalone)
70
+ import { KolButton } from '@public-ui/angular-v20';
71
+
72
+ @Component({
73
+ standalone: true,
74
+ imports: [KolButton],
75
+ })
76
+ export class AppComponent {}
77
+ ```
47
78
 
48
79
  ## Browser Support
80
+
49
81
  This package supports all modern browsers that are supported by Angular 20.
50
82
 
51
83
  ## License
84
+
52
85
  EUPL-1.2
53
86
 
54
87
  ## References
88
+
55
89
  - [Architecture Concept](https://public-ui.github.io/docs/concepts/architecture)
56
90
  - [Project Documentation](https://public-ui.github.io/docs)