@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 +43 -9
- package/dist/components.d.ts +83 -197
- package/dist/components.js +399 -941
- package/dist/core.d.ts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -1,56 +1,90 @@
|
|
|
1
1
|
# KoliBri Angular Adapter (v20)
|
|
2
2
|
|
|
3
|
-
[](https://www.npmjs.com/package/@public-ui/components)
|
|
4
|
+
[](https://github.com/public-ui/kolibri/blob/main/LICENSE)
|
|
5
|
+
[](https://www.npmjs.com/package/@public-ui/angular-20)
|
|
6
6
|
[](https://github.com/public-ui/kolibri/issues)
|
|
7
7
|
[](https://github.com/public-ui/kolibri/pulls)
|
|
8
|
-
[](https://bundlephobia.com/result?p=@public-ui/angular-20)
|
|
9
9
|

|
|
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
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
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.
|
|
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)
|