@opendevstack/ngx-appshell 19.0.5
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 +131 -0
- package/fesm2022/opendevstack-ngx-appshell.mjs +727 -0
- package/fesm2022/opendevstack-ngx-appshell.mjs.map +1 -0
- package/index.d.ts +5 -0
- package/lib/components/appshell-breadcrumb/appshell-breadcrumb.component.d.ts +7 -0
- package/lib/components/appshell-chip/appshell-chip.component.d.ts +6 -0
- package/lib/components/appshell-filters/appshell-filters.component.d.ts +12 -0
- package/lib/components/appshell-header/appshell-header.component.d.ts +24 -0
- package/lib/components/appshell-icon/appshell-icon.component.d.ts +12 -0
- package/lib/components/appshell-layout/appshell-layout.component.d.ts +25 -0
- package/lib/components/appshell-page-header/appshell-page-header.component.d.ts +18 -0
- package/lib/components/appshell-platform-header/appshell-platform-header.component.d.ts +37 -0
- package/lib/components/appshell-platform-layout/appshell-platform-layout.component.d.ts +30 -0
- package/lib/components/appshell-product-card/appshell-product-card.component.d.ts +23 -0
- package/lib/components/appshell-product-card-v2/appshell-product-card-v2.component.d.ts +16 -0
- package/lib/components/appshell-select/appshell-select.component.d.ts +9 -0
- package/lib/components/appshell-sidebar-menu/appshell-sidebar-menu.component.d.ts +12 -0
- package/lib/components/appshell-toast/appshell-toast.component.d.ts +9 -0
- package/lib/components/appshell-toasts/appshell-toasts.component.d.ts +14 -0
- package/lib/components/index.d.ts +15 -0
- package/lib/directives/appshell-link.directive.d.ts +15 -0
- package/lib/directives/index.d.ts +1 -0
- package/lib/models/appshell-button.d.ts +5 -0
- package/lib/models/appshell-filter.d.ts +4 -0
- package/lib/models/appshell-link.d.ts +6 -0
- package/lib/models/appshell-links-group.d.ts +5 -0
- package/lib/models/appshell-notification.d.ts +10 -0
- package/lib/models/appshell-picker.d.ts +9 -0
- package/lib/models/appshell-product.d.ts +12 -0
- package/lib/models/appshell-tag.d.ts +4 -0
- package/lib/models/appshell-toast.d.ts +6 -0
- package/lib/models/appshell-user.d.ts +5 -0
- package/lib/models/index.d.ts +10 -0
- package/lib/screens/appshell-notifications-screen/appshell-notifications-screen.component.d.ts +23 -0
- package/lib/screens/appshell-product-catalog-screen/appshell-product-catalog-screen.component.d.ts +16 -0
- package/lib/screens/appshell-product-view-screen/appshell-product-view-screen.component.d.ts +19 -0
- package/lib/screens/index.d.ts +3 -0
- package/lib/services/appshell-toast.service.d.ts +12 -0
- package/lib/services/icon-registry.service.d.ts +14 -0
- package/lib/services/index.d.ts +2 -0
- package/opendevstack-ngx-appshell-19.0.5.tgz +0 -0
- package/package.json +44 -0
- package/public-api.d.ts +5 -0
- package/schematics/azure-login/files/app-config/config.json.template +12 -0
- package/schematics/azure-login/files/app-config-service/app-config.service.spec.ts.template +48 -0
- package/schematics/azure-login/files/app-config-service/app-config.service.ts.template +39 -0
- package/schematics/azure-login/files/azure-config/azure.config.ts.template +94 -0
- package/schematics/azure-login/files/azure-service/azure.service.spec.ts.template +311 -0
- package/schematics/azure-login/files/azure-service/azure.service.ts.template +161 -0
- package/schematics/azure-login/index.d.ts +2 -0
- package/schematics/azure-login/index.js +325 -0
- package/schematics/azure-login/index.js.map +1 -0
- package/schematics/azure-login/schema.json +8 -0
- package/schematics/collection.json +19 -0
- package/schematics/nats-notifications/files/nats-service/nats.service.spec.ts.template +473 -0
- package/schematics/nats-notifications/files/nats-service/nats.service.ts.template +255 -0
- package/schematics/nats-notifications/files/notifications-screen/notifications-screen.component.html.template +7 -0
- package/schematics/nats-notifications/files/notifications-screen/notifications-screen.component.spec.ts.template +152 -0
- package/schematics/nats-notifications/files/notifications-screen/notifications-screen.component.ts.template +61 -0
- package/schematics/nats-notifications/index.d.ts +2 -0
- package/schematics/nats-notifications/index.js +502 -0
- package/schematics/nats-notifications/index.js.map +1 -0
- package/schematics/nats-notifications/schema.json +8 -0
- package/schematics/ng-add/files/_fonts.scss +85 -0
- package/schematics/ng-add/files/styles.scss +47 -0
- package/schematics/ng-add/index.d.ts +2 -0
- package/schematics/ng-add/index.js +442 -0
- package/schematics/ng-add/index.js.map +1 -0
- package/styles/appshell-typography-config.scss +19 -0
- package/styles/appshell.theme.scss +75 -0
- package/styles/palette.css +92 -0
package/README.md
ADDED
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
# NgxAppShell
|
|
2
|
+
|
|
3
|
+
A comprehensive Angular library providing pre-built UI components, directives, and schematics for building modern enterprise applications with Material Design.
|
|
4
|
+
|
|
5
|
+
**Version:** 19.0.4
|
|
6
|
+
**Angular:** >=19.0.0
|
|
7
|
+
|
|
8
|
+
## Features
|
|
9
|
+
|
|
10
|
+
- 🎨 Pre-built components based on Material Design
|
|
11
|
+
- 🔧 Reusable directives for common patterns
|
|
12
|
+
- 🚀 Schematics for quick integration of authentication and notifications
|
|
13
|
+
- 📦 Dependencies: Angular Material, Azure MSAL, NATS.io, and ngx-markdown
|
|
14
|
+
- 🎯 Designed for enterprise applications
|
|
15
|
+
|
|
16
|
+
## Installation
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
ng add @appshell/ngx-appshell
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
Or install manually:
|
|
23
|
+
|
|
24
|
+
```bash
|
|
25
|
+
npm install @appshell/ngx-appshell
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
Take into account that the ng add command, prepares the project to work with the library, if you use npm install, you'll need to reproduce manually the steps from the ng-add schematics in your project.
|
|
29
|
+
|
|
30
|
+
## Components
|
|
31
|
+
|
|
32
|
+
The library provides the following components:
|
|
33
|
+
|
|
34
|
+
### Layout Components
|
|
35
|
+
- **appshell-layout** - Main application layout container
|
|
36
|
+
- **appshell-platform-layout** - Platform-specific layout wrapper
|
|
37
|
+
- **appshell-header** - Application header component
|
|
38
|
+
- **appshell-platform-header** - Platform-specific header
|
|
39
|
+
- **appshell-page-header** - Page-level header component
|
|
40
|
+
- **appshell-sidebar-menu** - Sidebar navigation menu
|
|
41
|
+
|
|
42
|
+
### Navigation Components
|
|
43
|
+
- **appshell-breadcrumb** - Breadcrumb navigation component
|
|
44
|
+
|
|
45
|
+
### UI Components
|
|
46
|
+
- **appshell-chip** - Material chip component wrapper
|
|
47
|
+
- **appshell-icon** - Icon display component
|
|
48
|
+
- **appshell-filters** - Filtering UI component
|
|
49
|
+
- **appshell-select** - Enhanced select dropdown
|
|
50
|
+
- **appshell-toast** - Toast notification component
|
|
51
|
+
- **appshell-toasts** - Toast notification container
|
|
52
|
+
|
|
53
|
+
### Product Components
|
|
54
|
+
- **appshell-product-card** - Product display card
|
|
55
|
+
- **appshell-product-card-v2** - Different product card (v2)
|
|
56
|
+
|
|
57
|
+
## Directives
|
|
58
|
+
|
|
59
|
+
- **appshell-link** - Enhanced link directive for navigation
|
|
60
|
+
|
|
61
|
+
## Schematics
|
|
62
|
+
|
|
63
|
+
The library includes the following schematics to quickly integrate common features:
|
|
64
|
+
|
|
65
|
+
### ng-add
|
|
66
|
+
```bash
|
|
67
|
+
ng add @appshell/ngx-appshell
|
|
68
|
+
```
|
|
69
|
+
Adds the AppShell module to your project with all necessary dependencies and configuration.
|
|
70
|
+
|
|
71
|
+
### azure-login
|
|
72
|
+
```bash
|
|
73
|
+
ng generate @appshell/ngx-appshell:azure-login
|
|
74
|
+
```
|
|
75
|
+
Integrates Azure Enterprise Login (MSAL) into your application. This schematic generates:
|
|
76
|
+
- Azure configuration files
|
|
77
|
+
- Azure authentication service
|
|
78
|
+
- App configuration service
|
|
79
|
+
- Required setup for MSAL authentication
|
|
80
|
+
|
|
81
|
+
### nats-notifications
|
|
82
|
+
```bash
|
|
83
|
+
ng generate @appshell/ngx-appshell:nats-notifications
|
|
84
|
+
```
|
|
85
|
+
Integrates NATS.io-based notifications into your application. This schematic generates:
|
|
86
|
+
- NATS service for message handling
|
|
87
|
+
- Notifications screen component
|
|
88
|
+
- Required setup for real-time notifications
|
|
89
|
+
|
|
90
|
+
## Dependencies
|
|
91
|
+
|
|
92
|
+
This library requires the following peer dependencies:
|
|
93
|
+
|
|
94
|
+
- `@angular/common` >= 19.0.0
|
|
95
|
+
- `@angular/core` >= 19.0.0
|
|
96
|
+
- `@angular/material` >= 19.0.0
|
|
97
|
+
- `@angular/animations` >= 19.0.0
|
|
98
|
+
|
|
99
|
+
Additional included dependencies:
|
|
100
|
+
|
|
101
|
+
- `@azure/msal-angular` - Azure authentication
|
|
102
|
+
- `@azure/msal-browser` - Azure MSAL browser support
|
|
103
|
+
- `@nats-io/nats-core` - NATS.io core functionality
|
|
104
|
+
- `@nats-io/jetstream` - NATS.io JetStream
|
|
105
|
+
- `@nats-io/kv` - NATS.io Key-Value store
|
|
106
|
+
- `marked` - Markdown parser
|
|
107
|
+
- `ngx-markdown` - Angular markdown component
|
|
108
|
+
|
|
109
|
+
## Development
|
|
110
|
+
|
|
111
|
+
### Code scaffolding
|
|
112
|
+
|
|
113
|
+
Run `ng generate component component-name --project ngx-appshell` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ngx-appshell`.
|
|
114
|
+
|
|
115
|
+
> Note: Don't forget to add `--project ngx-appshell` or else it will be added to the default project in your `angular.json` file.
|
|
116
|
+
|
|
117
|
+
### Build
|
|
118
|
+
|
|
119
|
+
Run `ng build ngx-appshell` to build the project. The build artifacts will be stored in the `dist/` directory.
|
|
120
|
+
|
|
121
|
+
### Publishing
|
|
122
|
+
|
|
123
|
+
After building your library with `ng build ngx-appshell`, go to the dist folder `cd dist/ngx-appshell` and run `npm publish`.
|
|
124
|
+
|
|
125
|
+
### Running unit tests
|
|
126
|
+
|
|
127
|
+
Run `ng test ngx-appshell` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
|
128
|
+
|
|
129
|
+
## Further help
|
|
130
|
+
|
|
131
|
+
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|