@aegov/designsystem-angular 0.2.12 → 0.2.14
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/.editorconfig +17 -0
- package/.prettierrc +12 -0
- package/.vscode/extensions.json +4 -0
- package/.vscode/launch.json +20 -0
- package/.vscode/tasks.json +42 -0
- package/README.md +16 -21
- package/angular.json +36 -0
- package/package.json +31 -21
- package/projects/component-library/README.md +64 -0
- package/projects/component-library/ng-package.json +7 -0
- package/projects/component-library/package.json +16 -0
- package/projects/component-library/src/lib/component-library.spec.ts +22 -0
- package/projects/component-library/src/lib/component-library.ts +9 -0
- package/projects/component-library/src/lib/designsystem.module.ts +24 -0
- package/projects/component-library/src/lib/stencil-generated/angular-component-lib/utils.ts +65 -0
- package/projects/component-library/src/lib/stencil-generated/components.ts +1830 -0
- package/projects/component-library/src/lib/stencil-generated/index.ts +60 -0
- package/projects/component-library/src/public-api.ts +7 -0
- package/projects/component-library/tsconfig.lib.json +13 -0
- package/projects/component-library/tsconfig.lib.prod.json +11 -0
- package/projects/component-library/tsconfig.spec.json +10 -0
- package/tsconfig.json +34 -0
- package/fesm2022/aegov-designsystem-angular.mjs +0 -1957
- package/fesm2022/aegov-designsystem-angular.mjs.map +0 -1
- package/types/aegov-designsystem-angular.d.ts +0 -964
package/.editorconfig
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
# Editor configuration, see https://editorconfig.org
|
|
2
|
+
root = true
|
|
3
|
+
|
|
4
|
+
[*]
|
|
5
|
+
charset = utf-8
|
|
6
|
+
indent_style = space
|
|
7
|
+
indent_size = 2
|
|
8
|
+
insert_final_newline = true
|
|
9
|
+
trim_trailing_whitespace = true
|
|
10
|
+
|
|
11
|
+
[*.ts]
|
|
12
|
+
quote_type = single
|
|
13
|
+
ij_typescript_use_double_quotes = false
|
|
14
|
+
|
|
15
|
+
[*.md]
|
|
16
|
+
max_line_length = off
|
|
17
|
+
trim_trailing_whitespace = false
|
package/.prettierrc
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
{
|
|
2
|
+
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
|
3
|
+
"version": "0.2.0",
|
|
4
|
+
"configurations": [
|
|
5
|
+
{
|
|
6
|
+
"name": "ng serve",
|
|
7
|
+
"type": "chrome",
|
|
8
|
+
"request": "launch",
|
|
9
|
+
"preLaunchTask": "npm: start",
|
|
10
|
+
"url": "http://localhost:4200/"
|
|
11
|
+
},
|
|
12
|
+
{
|
|
13
|
+
"name": "ng test",
|
|
14
|
+
"type": "chrome",
|
|
15
|
+
"request": "launch",
|
|
16
|
+
"preLaunchTask": "npm: test",
|
|
17
|
+
"url": "http://localhost:9876/debug.html"
|
|
18
|
+
}
|
|
19
|
+
]
|
|
20
|
+
}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
{
|
|
2
|
+
// For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
|
|
3
|
+
"version": "2.0.0",
|
|
4
|
+
"tasks": [
|
|
5
|
+
{
|
|
6
|
+
"type": "npm",
|
|
7
|
+
"script": "start",
|
|
8
|
+
"isBackground": true,
|
|
9
|
+
"problemMatcher": {
|
|
10
|
+
"owner": "typescript",
|
|
11
|
+
"pattern": "$tsc",
|
|
12
|
+
"background": {
|
|
13
|
+
"activeOnStart": true,
|
|
14
|
+
"beginsPattern": {
|
|
15
|
+
"regexp": "Changes detected"
|
|
16
|
+
},
|
|
17
|
+
"endsPattern": {
|
|
18
|
+
"regexp": "bundle generation (complete|failed)"
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"type": "npm",
|
|
25
|
+
"script": "test",
|
|
26
|
+
"isBackground": true,
|
|
27
|
+
"problemMatcher": {
|
|
28
|
+
"owner": "typescript",
|
|
29
|
+
"pattern": "$tsc",
|
|
30
|
+
"background": {
|
|
31
|
+
"activeOnStart": true,
|
|
32
|
+
"beginsPattern": {
|
|
33
|
+
"regexp": "Changes detected"
|
|
34
|
+
},
|
|
35
|
+
"endsPattern": {
|
|
36
|
+
"regexp": "bundle generation (complete|failed)"
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
]
|
|
42
|
+
}
|
package/README.md
CHANGED
|
@@ -1,6 +1,16 @@
|
|
|
1
|
-
#
|
|
1
|
+
# AngularWorkspace
|
|
2
2
|
|
|
3
|
-
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 22.0.
|
|
3
|
+
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 22.0.5.
|
|
4
|
+
|
|
5
|
+
## Development server
|
|
6
|
+
|
|
7
|
+
To start a local development server, run:
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
ng serve
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
|
|
4
14
|
|
|
5
15
|
## Code scaffolding
|
|
6
16
|
|
|
@@ -18,32 +28,17 @@ ng generate --help
|
|
|
18
28
|
|
|
19
29
|
## Building
|
|
20
30
|
|
|
21
|
-
To build the
|
|
31
|
+
To build the project run:
|
|
22
32
|
|
|
23
33
|
```bash
|
|
24
|
-
ng build
|
|
34
|
+
ng build
|
|
25
35
|
```
|
|
26
36
|
|
|
27
|
-
This
|
|
28
|
-
|
|
29
|
-
### Publishing the Library
|
|
30
|
-
|
|
31
|
-
Once the project is built, you can publish your library by following these steps:
|
|
32
|
-
|
|
33
|
-
1. Navigate to the `dist` directory:
|
|
34
|
-
|
|
35
|
-
```bash
|
|
36
|
-
cd dist/component-library
|
|
37
|
-
```
|
|
38
|
-
|
|
39
|
-
2. Run the `npm publish` command to publish your library to the npm registry:
|
|
40
|
-
```bash
|
|
41
|
-
npm publish
|
|
42
|
-
```
|
|
37
|
+
This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
|
|
43
38
|
|
|
44
39
|
## Running unit tests
|
|
45
40
|
|
|
46
|
-
To execute unit tests with the [
|
|
41
|
+
To execute unit tests with the [Vitest](https://vitest.dev/) test runner, use the following command:
|
|
47
42
|
|
|
48
43
|
```bash
|
|
49
44
|
ng test
|
package/angular.json
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
|
|
3
|
+
"version": 1,
|
|
4
|
+
"cli": {
|
|
5
|
+
"packageManager": "npm"
|
|
6
|
+
},
|
|
7
|
+
"newProjectRoot": "projects",
|
|
8
|
+
"projects": {
|
|
9
|
+
"component-library": {
|
|
10
|
+
"projectType": "library",
|
|
11
|
+
"root": "projects/component-library",
|
|
12
|
+
"sourceRoot": "projects/component-library/src",
|
|
13
|
+
"prefix": "lib",
|
|
14
|
+
"architect": {
|
|
15
|
+
"build": {
|
|
16
|
+
"builder": "@angular/build:ng-packagr",
|
|
17
|
+
"configurations": {
|
|
18
|
+
"production": {
|
|
19
|
+
"tsConfig": "projects/component-library/tsconfig.lib.prod.json"
|
|
20
|
+
},
|
|
21
|
+
"development": {
|
|
22
|
+
"tsConfig": "projects/component-library/tsconfig.lib.json"
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
"defaultConfiguration": "production"
|
|
26
|
+
},
|
|
27
|
+
"test": {
|
|
28
|
+
"builder": "@angular/build:unit-test",
|
|
29
|
+
"options": {
|
|
30
|
+
"tsConfig": "projects/component-library/tsconfig.spec.json"
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
}
|
package/package.json
CHANGED
|
@@ -1,28 +1,38 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aegov/designsystem-angular",
|
|
3
|
-
"version": "0.2.
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
3
|
+
"version": "0.2.14",
|
|
4
|
+
"scripts": {
|
|
5
|
+
"ng": "ng",
|
|
6
|
+
"start": "ng serve",
|
|
7
|
+
"build": "ng build component-library",
|
|
8
|
+
"watch": "ng build --watch --configuration development",
|
|
9
|
+
"test": "ng test"
|
|
10
|
+
},
|
|
11
|
+
"packageManager": "npm@10.9.8",
|
|
12
|
+
"publishConfig": {
|
|
13
|
+
"access": "restricted",
|
|
14
|
+
"directory": "dist/component-library"
|
|
8
15
|
},
|
|
9
16
|
"dependencies": {
|
|
17
|
+
"@aegov/designsystem": "^0.2.14",
|
|
18
|
+
"@angular/common": "^22.0.0",
|
|
19
|
+
"@angular/compiler": "^22.0.0",
|
|
20
|
+
"@angular/core": "^22.0.0",
|
|
21
|
+
"@angular/forms": "^22.0.0",
|
|
22
|
+
"@angular/platform-browser": "^22.0.0",
|
|
23
|
+
"@angular/router": "^22.0.0",
|
|
24
|
+
"rxjs": "~7.8.0",
|
|
10
25
|
"tslib": "^2.3.0"
|
|
11
26
|
},
|
|
12
|
-
"
|
|
13
|
-
|
|
14
|
-
"
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
"
|
|
20
|
-
|
|
21
|
-
},
|
|
22
|
-
".": {
|
|
23
|
-
"types": "./types/aegov-designsystem-angular.d.ts",
|
|
24
|
-
"default": "./fesm2022/aegov-designsystem-angular.mjs"
|
|
25
|
-
}
|
|
27
|
+
"devDependencies": {
|
|
28
|
+
"@angular/build": "^22.0.5",
|
|
29
|
+
"@angular/cli": "^22.0.5",
|
|
30
|
+
"@angular/compiler-cli": "^22.0.0",
|
|
31
|
+
"jsdom": "^28.0.0",
|
|
32
|
+
"ng-packagr": "^22.0.0",
|
|
33
|
+
"prettier": "^3.8.1",
|
|
34
|
+
"typescript": "~6.0.2",
|
|
35
|
+
"vitest": "^4.0.8"
|
|
26
36
|
},
|
|
27
|
-
"
|
|
28
|
-
}
|
|
37
|
+
"gitHead": "cb9cbea55adbeb993074c9b61ca6b19c49a7abc1"
|
|
38
|
+
}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
# ComponentLibrary
|
|
2
|
+
|
|
3
|
+
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 22.0.0.
|
|
4
|
+
|
|
5
|
+
## Code scaffolding
|
|
6
|
+
|
|
7
|
+
Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
ng generate component component-name
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
ng generate --help
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Building
|
|
20
|
+
|
|
21
|
+
To build the library, run:
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
ng build component-library
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
|
|
28
|
+
|
|
29
|
+
### Publishing the Library
|
|
30
|
+
|
|
31
|
+
Once the project is built, you can publish your library by following these steps:
|
|
32
|
+
|
|
33
|
+
1. Navigate to the `dist` directory:
|
|
34
|
+
|
|
35
|
+
```bash
|
|
36
|
+
cd dist/component-library
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
2. Run the `npm publish` command to publish your library to the npm registry:
|
|
40
|
+
```bash
|
|
41
|
+
npm publish
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Running unit tests
|
|
45
|
+
|
|
46
|
+
To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
ng test
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Running end-to-end tests
|
|
53
|
+
|
|
54
|
+
For end-to-end (e2e) testing, run:
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
ng e2e
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
|
|
61
|
+
|
|
62
|
+
## Additional Resources
|
|
63
|
+
|
|
64
|
+
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@aegov/designsystem-angular",
|
|
3
|
+
"version": "0.2.14",
|
|
4
|
+
"peerDependencies": {
|
|
5
|
+
"@angular/common": ">=18.0.0",
|
|
6
|
+
"@angular/core": ">=18.0.0",
|
|
7
|
+
"@aegov/designsystem": "*"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"tslib": "^2.3.0"
|
|
11
|
+
},
|
|
12
|
+
"sideEffects": false,
|
|
13
|
+
"publishConfig": {
|
|
14
|
+
"access": "restricted"
|
|
15
|
+
}
|
|
16
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
2
|
+
|
|
3
|
+
import { ComponentLibrary } from './component-library';
|
|
4
|
+
|
|
5
|
+
describe('ComponentLibrary', () => {
|
|
6
|
+
let component: ComponentLibrary;
|
|
7
|
+
let fixture: ComponentFixture<ComponentLibrary>;
|
|
8
|
+
|
|
9
|
+
beforeEach(async () => {
|
|
10
|
+
await TestBed.configureTestingModule({
|
|
11
|
+
imports: [ComponentLibrary],
|
|
12
|
+
}).compileComponents();
|
|
13
|
+
|
|
14
|
+
fixture = TestBed.createComponent(ComponentLibrary);
|
|
15
|
+
component = fixture.componentInstance;
|
|
16
|
+
await fixture.whenStable();
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
it('should create', () => {
|
|
20
|
+
expect(component).toBeTruthy();
|
|
21
|
+
});
|
|
22
|
+
});
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { APP_INITIALIZER, EnvironmentProviders, makeEnvironmentProviders, NgModule } from '@angular/core';
|
|
2
|
+
import { defineCustomElements } from '@aegov/designsystem/loader';
|
|
3
|
+
import { DIRECTIVES } from './stencil-generated';
|
|
4
|
+
|
|
5
|
+
function initializeDesignSystem() {
|
|
6
|
+
return () => defineCustomElements();
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
const APP_INIT_PROVIDER = {
|
|
10
|
+
provide: APP_INITIALIZER,
|
|
11
|
+
useFactory: initializeDesignSystem,
|
|
12
|
+
multi: true,
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
@NgModule({
|
|
16
|
+
imports: [...DIRECTIVES],
|
|
17
|
+
exports: [...DIRECTIVES],
|
|
18
|
+
providers: [APP_INIT_PROVIDER],
|
|
19
|
+
})
|
|
20
|
+
export class DesignSystemModule {}
|
|
21
|
+
|
|
22
|
+
export function provideDesignSystem(): EnvironmentProviders {
|
|
23
|
+
return makeEnvironmentProviders([APP_INIT_PROVIDER]);
|
|
24
|
+
}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
/* tslint:disable */
|
|
3
|
+
import { fromEvent } from 'rxjs';
|
|
4
|
+
|
|
5
|
+
export const proxyInputs = (Cmp: any, inputs: string[]) => {
|
|
6
|
+
const Prototype = Cmp.prototype;
|
|
7
|
+
inputs.forEach((item) => {
|
|
8
|
+
Object.defineProperty(Prototype, item, {
|
|
9
|
+
get() {
|
|
10
|
+
return this.el[item];
|
|
11
|
+
},
|
|
12
|
+
set(val: any) {
|
|
13
|
+
this.z.runOutsideAngular(() => (this.el[item] = val));
|
|
14
|
+
},
|
|
15
|
+
/**
|
|
16
|
+
* In the event that proxyInputs is called
|
|
17
|
+
* multiple times re-defining these inputs
|
|
18
|
+
* will cause an error to be thrown. As a result
|
|
19
|
+
* we set configurable: true to indicate these
|
|
20
|
+
* properties can be changed.
|
|
21
|
+
*/
|
|
22
|
+
configurable: true,
|
|
23
|
+
});
|
|
24
|
+
});
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
export const proxyMethods = (Cmp: any, methods: string[]) => {
|
|
28
|
+
const Prototype = Cmp.prototype;
|
|
29
|
+
methods.forEach((methodName) => {
|
|
30
|
+
Prototype[methodName] = function () {
|
|
31
|
+
const args = arguments;
|
|
32
|
+
return this.z.runOutsideAngular(() => this.el[methodName].apply(this.el, args));
|
|
33
|
+
};
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
export const proxyOutputs = (instance: any, el: any, events: string[]) => {
|
|
38
|
+
events.forEach((eventName) => (instance[eventName] = fromEvent(el, eventName)));
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
export const defineCustomElement = (tagName: string, customElement: any) => {
|
|
42
|
+
if (customElement !== undefined && typeof customElements !== 'undefined' && !customElements.get(tagName)) {
|
|
43
|
+
customElements.define(tagName, customElement);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
// tslint:disable-next-line: only-arrow-functions
|
|
48
|
+
export function ProxyCmp(opts: { defineCustomElementFn?: () => void; inputs?: any; methods?: any }) {
|
|
49
|
+
const decorator = function (cls: any) {
|
|
50
|
+
const { defineCustomElementFn, inputs, methods } = opts;
|
|
51
|
+
|
|
52
|
+
if (defineCustomElementFn !== undefined) {
|
|
53
|
+
defineCustomElementFn();
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
if (inputs) {
|
|
57
|
+
proxyInputs(cls, inputs);
|
|
58
|
+
}
|
|
59
|
+
if (methods) {
|
|
60
|
+
proxyMethods(cls, methods);
|
|
61
|
+
}
|
|
62
|
+
return cls;
|
|
63
|
+
};
|
|
64
|
+
return decorator;
|
|
65
|
+
}
|