@lenne.tech/ng-base 14.36.3 → 14.37.0
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/base-prototype/pages/register/register.component.d.ts +3 -2
- package/esm2020/base-components/components/input/input.component.mjs +3 -3
- package/esm2020/base-components/components/tags/tags.component.mjs +3 -3
- package/esm2020/base-prototype/pages/login/login.component.mjs +3 -3
- package/esm2020/base-prototype/pages/register/register.component.mjs +9 -5
- package/esm2020/shared/interfaces/register-config.interface.mjs +2 -0
- package/esm2020/shared/public-api.mjs +2 -1
- package/esm2020/src/guards/auth.guard.mjs +48 -41
- package/fesm2015/lenne.tech-ng-base-base-components.mjs +4 -4
- package/fesm2015/lenne.tech-ng-base-base-components.mjs.map +1 -1
- package/fesm2015/lenne.tech-ng-base-base-prototype.mjs +10 -5
- package/fesm2015/lenne.tech-ng-base-base-prototype.mjs.map +1 -1
- package/fesm2015/lenne.tech-ng-base-shared.mjs.map +1 -1
- package/fesm2015/lenne.tech-ng-base.mjs +46 -40
- package/fesm2015/lenne.tech-ng-base.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base-base-components.mjs +4 -4
- package/fesm2020/lenne.tech-ng-base-base-components.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base-base-prototype.mjs +9 -5
- package/fesm2020/lenne.tech-ng-base-base-prototype.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base-shared.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base.mjs +45 -39
- package/fesm2020/lenne.tech-ng-base.mjs.map +1 -1
- package/package.json +1 -1
- package/shared/interfaces/register-config.interface.d.ts +4 -0
- package/shared/public-api.d.ts +1 -0
- package/src/guards/auth.guard.d.ts +2 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { Inject, Injectable } from '@angular/core';
|
|
1
|
+
import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
|
|
2
2
|
import { Observable } from 'rxjs';
|
|
3
3
|
import { BASE_MODULE_CONFIG } from '@lenne.tech/ng-base/shared';
|
|
4
|
+
import { isPlatformBrowser } from '@angular/common';
|
|
4
5
|
import * as i0 from "@angular/core";
|
|
5
6
|
import * as i1 from "@angular/router";
|
|
6
7
|
import * as i2 from "@lenne.tech/ng-base/shared";
|
|
@@ -11,56 +12,59 @@ export class AuthGuard {
|
|
|
11
12
|
/**
|
|
12
13
|
* Imports
|
|
13
14
|
*/
|
|
14
|
-
constructor(router, authService, moduleConfig) {
|
|
15
|
+
constructor(router, authService, moduleConfig, platformId) {
|
|
15
16
|
this.router = router;
|
|
16
17
|
this.authService = authService;
|
|
17
18
|
this.moduleConfig = moduleConfig;
|
|
19
|
+
this.platformId = platformId;
|
|
18
20
|
}
|
|
19
21
|
/**
|
|
20
22
|
* Can activate main route
|
|
21
23
|
*/
|
|
22
24
|
canActivate(route, state) {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
if (
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
25
|
+
if (isPlatformBrowser(this.platformId)) {
|
|
26
|
+
return new Observable((subscriber) => {
|
|
27
|
+
let allowed = false;
|
|
28
|
+
let redirected = false;
|
|
29
|
+
/* If the user is logged in and the route is not marked as opposite, then the user is allowed to access the route. */
|
|
30
|
+
const opposite = route?.data?.opposite ? route?.data?.opposite : false;
|
|
31
|
+
const redirectAuthUrl = route?.data?.redirectAuthUrl
|
|
32
|
+
? route.data.redirectAuthUrl
|
|
33
|
+
: this.moduleConfig.authGuardRedirectUrl;
|
|
34
|
+
const redirectRoleUrl = route?.data?.redirectRoleUrl
|
|
35
|
+
? route.data.redirectRoleUrl
|
|
36
|
+
: this.moduleConfig.authGuardRedirectUrl;
|
|
37
|
+
const disableQueryParams = route?.data?.disableQueryParams ?? false;
|
|
38
|
+
const queryParams = disableQueryParams
|
|
39
|
+
? {}
|
|
40
|
+
: {
|
|
41
|
+
queryParams: {
|
|
42
|
+
redirectUrl: route['_routerState'].url,
|
|
43
|
+
},
|
|
44
|
+
};
|
|
45
|
+
if (this.authService.token && !opposite) {
|
|
46
|
+
if (route.data?.roles) {
|
|
47
|
+
const user = this.authService.currentUser;
|
|
48
|
+
allowed = !!route.data.roles.find((role) => user.roles?.includes(role));
|
|
49
|
+
if (!allowed && redirectRoleUrl) {
|
|
50
|
+
this.router.navigate([redirectRoleUrl], queryParams);
|
|
51
|
+
redirected = true;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
else {
|
|
55
|
+
allowed = true;
|
|
49
56
|
}
|
|
50
57
|
}
|
|
51
|
-
else {
|
|
58
|
+
else if (!this.authService.token && opposite) {
|
|
52
59
|
allowed = true;
|
|
53
60
|
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
subscriber.next(allowed);
|
|
62
|
-
subscriber.complete();
|
|
63
|
-
});
|
|
61
|
+
if (!allowed && redirectAuthUrl && !redirected) {
|
|
62
|
+
this.router.navigate([redirectAuthUrl], queryParams);
|
|
63
|
+
}
|
|
64
|
+
subscriber.next(allowed);
|
|
65
|
+
subscriber.complete();
|
|
66
|
+
});
|
|
67
|
+
}
|
|
64
68
|
}
|
|
65
69
|
/**
|
|
66
70
|
* Can activate child route
|
|
@@ -69,12 +73,15 @@ export class AuthGuard {
|
|
|
69
73
|
return this.canActivate(route, state);
|
|
70
74
|
}
|
|
71
75
|
}
|
|
72
|
-
AuthGuard.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AuthGuard, deps: [{ token: i1.Router }, { token: i2.AuthService }, { token: BASE_MODULE_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
76
|
+
AuthGuard.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AuthGuard, deps: [{ token: i1.Router }, { token: i2.AuthService }, { token: BASE_MODULE_CONFIG }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
73
77
|
AuthGuard.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AuthGuard });
|
|
74
78
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AuthGuard, decorators: [{
|
|
75
79
|
type: Injectable
|
|
76
80
|
}], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.AuthService }, { type: undefined, decorators: [{
|
|
77
81
|
type: Inject,
|
|
78
82
|
args: [BASE_MODULE_CONFIG]
|
|
83
|
+
}] }, { type: undefined, decorators: [{
|
|
84
|
+
type: Inject,
|
|
85
|
+
args: [PLATFORM_ID]
|
|
79
86
|
}] }]; } });
|
|
80
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
87
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0aC5ndWFyZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWJhc2Uvc3JjL2d1YXJkcy9hdXRoLmd1YXJkLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFLFdBQVcsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUVoRSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQ2xDLE9BQU8sRUFBZSxrQkFBa0IsRUFBb0IsTUFBTSw0QkFBNEIsQ0FBQztBQUMvRixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7OztBQUVwRDs7R0FFRztBQUVILE1BQU0sT0FBTyxTQUFTO0lBQ3BCOztPQUVHO0lBQ0gsWUFDVSxNQUFjLEVBQ2QsV0FBd0IsRUFDSSxZQUE4QixFQUNyQyxVQUFrQjtRQUh2QyxXQUFNLEdBQU4sTUFBTSxDQUFRO1FBQ2QsZ0JBQVcsR0FBWCxXQUFXLENBQWE7UUFDSSxpQkFBWSxHQUFaLFlBQVksQ0FBa0I7UUFDckMsZUFBVSxHQUFWLFVBQVUsQ0FBUTtJQUM5QyxDQUFDO0lBRUo7O09BRUc7SUFDSCxXQUFXLENBQUMsS0FBNkIsRUFBRSxLQUEwQjtRQUNuRSxJQUFJLGlCQUFpQixDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsRUFBRTtZQUN0QyxPQUFPLElBQUksVUFBVSxDQUFDLENBQUMsVUFBVSxFQUFFLEVBQUU7Z0JBQ25DLElBQUksT0FBTyxHQUFHLEtBQUssQ0FBQztnQkFDcEIsSUFBSSxVQUFVLEdBQUcsS0FBSyxDQUFDO2dCQUN2QixxSEFBcUg7Z0JBQ3JILE1BQU0sUUFBUSxHQUFHLEtBQUssRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLENBQUMsQ0FBQyxLQUFLLEVBQUUsSUFBSSxFQUFFLFFBQVEsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO2dCQUN2RSxNQUFNLGVBQWUsR0FBRyxLQUFLLEVBQUUsSUFBSSxFQUFFLGVBQWU7b0JBQ2xELENBQUMsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLGVBQWU7b0JBQzVCLENBQUMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLG9CQUFvQixDQUFDO2dCQUMzQyxNQUFNLGVBQWUsR0FBRyxLQUFLLEVBQUUsSUFBSSxFQUFFLGVBQWU7b0JBQ2xELENBQUMsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLGVBQWU7b0JBQzVCLENBQUMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLG9CQUFvQixDQUFDO2dCQUMzQyxNQUFNLGtCQUFrQixHQUFHLEtBQUssRUFBRSxJQUFJLEVBQUUsa0JBQWtCLElBQUksS0FBSyxDQUFDO2dCQUNwRSxNQUFNLFdBQVcsR0FBRyxrQkFBa0I7b0JBQ3BDLENBQUMsQ0FBQyxFQUFFO29CQUNKLENBQUMsQ0FBQzt3QkFDRSxXQUFXLEVBQUU7NEJBQ1gsV0FBVyxFQUFFLEtBQUssQ0FBQyxjQUFjLENBQUMsQ0FBQyxHQUFHO3lCQUN2QztxQkFDRixDQUFDO2dCQUVOLElBQUksSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLElBQUksQ0FBQyxRQUFRLEVBQUU7b0JBQ3ZDLElBQUksS0FBSyxDQUFDLElBQUksRUFBRSxLQUFLLEVBQUU7d0JBQ3JCLE1BQU0sSUFBSSxHQUFHLElBQUksQ0FBQyxXQUFXLENBQUMsV0FBVyxDQUFDO3dCQUMxQyxPQUFPLEdBQUcsQ0FBQyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDLElBQUksRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQzt3QkFFeEUsSUFBSSxDQUFDLE9BQU8sSUFBSSxlQUFlLEVBQUU7NEJBQy9CLElBQUksQ0FBQyxNQUFNLENBQUMsUUFBUSxDQUFDLENBQUMsZUFBZSxDQUFDLEVBQUUsV0FBVyxDQUFDLENBQUM7NEJBQ3JELFVBQVUsR0FBRyxJQUFJLENBQUM7eUJBQ25CO3FCQUNGO3lCQUFNO3dCQUNMLE9BQU8sR0FBRyxJQUFJLENBQUM7cUJBQ2hCO2lCQUNGO3FCQUFNLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssSUFBSSxRQUFRLEVBQUU7b0JBQzlDLE9BQU8sR0FBRyxJQUFJLENBQUM7aUJBQ2hCO2dCQUVELElBQUksQ0FBQyxPQUFPLElBQUksZUFBZSxJQUFJLENBQUMsVUFBVSxFQUFFO29CQUM5QyxJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFDLGVBQWUsQ0FBQyxFQUFFLFdBQVcsQ0FBQyxDQUFDO2lCQUN0RDtnQkFFRCxVQUFVLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO2dCQUN6QixVQUFVLENBQUMsUUFBUSxFQUFFLENBQUM7WUFDeEIsQ0FBQyxDQUFDLENBQUM7U0FDSjtJQUNILENBQUM7SUFFRDs7T0FFRztJQUNILGdCQUFnQixDQUFDLEtBQTZCLEVBQUUsS0FBMEI7UUFDeEUsT0FBTyxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQztJQUN4QyxDQUFDOzt1R0FuRVUsU0FBUyxtRUFPVixrQkFBa0IsYUFDbEIsV0FBVzsyR0FSVixTQUFTOzRGQUFULFNBQVM7a0JBRHJCLFVBQVU7OzBCQVFOLE1BQU07MkJBQUMsa0JBQWtCOzswQkFDekIsTUFBTTsyQkFBQyxXQUFXIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0LCBJbmplY3RhYmxlLCBQTEFURk9STV9JRCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQWN0aXZhdGVkUm91dGVTbmFwc2hvdCwgQ2FuQWN0aXZhdGUsIENhbkFjdGl2YXRlQ2hpbGQsIFJvdXRlciwgUm91dGVyU3RhdGVTbmFwc2hvdCB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBBdXRoU2VydmljZSwgQkFTRV9NT0RVTEVfQ09ORklHLCBCYXNlTW9kdWxlQ29uZmlnIH0gZnJvbSAnQGxlbm5lLnRlY2gvbmctYmFzZS9zaGFyZWQnO1xuaW1wb3J0IHsgaXNQbGF0Zm9ybUJyb3dzZXIgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG4vKipcbiAqIEF1dGhlbnRpY2F0aW9uIGd1YXJkXG4gKi9cbkBJbmplY3RhYmxlKClcbmV4cG9ydCBjbGFzcyBBdXRoR3VhcmQgaW1wbGVtZW50cyBDYW5BY3RpdmF0ZSwgQ2FuQWN0aXZhdGVDaGlsZCB7XG4gIC8qKlxuICAgKiBJbXBvcnRzXG4gICAqL1xuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIHJvdXRlcjogUm91dGVyLFxuICAgIHByaXZhdGUgYXV0aFNlcnZpY2U6IEF1dGhTZXJ2aWNlLFxuICAgIEBJbmplY3QoQkFTRV9NT0RVTEVfQ09ORklHKSBwcml2YXRlIG1vZHVsZUNvbmZpZzogQmFzZU1vZHVsZUNvbmZpZyxcbiAgICBASW5qZWN0KFBMQVRGT1JNX0lEKSBwcml2YXRlIHBsYXRmb3JtSWQ6IG9iamVjdFxuICApIHt9XG5cbiAgLyoqXG4gICAqIENhbiBhY3RpdmF0ZSBtYWluIHJvdXRlXG4gICAqL1xuICBjYW5BY3RpdmF0ZShyb3V0ZTogQWN0aXZhdGVkUm91dGVTbmFwc2hvdCwgc3RhdGU6IFJvdXRlclN0YXRlU25hcHNob3QpOiBPYnNlcnZhYmxlPGJvb2xlYW4+IHtcbiAgICBpZiAoaXNQbGF0Zm9ybUJyb3dzZXIodGhpcy5wbGF0Zm9ybUlkKSkge1xuICAgICAgcmV0dXJuIG5ldyBPYnNlcnZhYmxlKChzdWJzY3JpYmVyKSA9PiB7XG4gICAgICAgIGxldCBhbGxvd2VkID0gZmFsc2U7XG4gICAgICAgIGxldCByZWRpcmVjdGVkID0gZmFsc2U7XG4gICAgICAgIC8qIElmIHRoZSB1c2VyIGlzIGxvZ2dlZCBpbiBhbmQgdGhlIHJvdXRlIGlzIG5vdCBtYXJrZWQgYXMgb3Bwb3NpdGUsIHRoZW4gdGhlIHVzZXIgaXMgYWxsb3dlZCB0byBhY2Nlc3MgdGhlIHJvdXRlLiAqL1xuICAgICAgICBjb25zdCBvcHBvc2l0ZSA9IHJvdXRlPy5kYXRhPy5vcHBvc2l0ZSA/IHJvdXRlPy5kYXRhPy5vcHBvc2l0ZSA6IGZhbHNlO1xuICAgICAgICBjb25zdCByZWRpcmVjdEF1dGhVcmwgPSByb3V0ZT8uZGF0YT8ucmVkaXJlY3RBdXRoVXJsXG4gICAgICAgICAgPyByb3V0ZS5kYXRhLnJlZGlyZWN0QXV0aFVybFxuICAgICAgICAgIDogdGhpcy5tb2R1bGVDb25maWcuYXV0aEd1YXJkUmVkaXJlY3RVcmw7XG4gICAgICAgIGNvbnN0IHJlZGlyZWN0Um9sZVVybCA9IHJvdXRlPy5kYXRhPy5yZWRpcmVjdFJvbGVVcmxcbiAgICAgICAgICA/IHJvdXRlLmRhdGEucmVkaXJlY3RSb2xlVXJsXG4gICAgICAgICAgOiB0aGlzLm1vZHVsZUNvbmZpZy5hdXRoR3VhcmRSZWRpcmVjdFVybDtcbiAgICAgICAgY29uc3QgZGlzYWJsZVF1ZXJ5UGFyYW1zID0gcm91dGU/LmRhdGE/LmRpc2FibGVRdWVyeVBhcmFtcyA/PyBmYWxzZTtcbiAgICAgICAgY29uc3QgcXVlcnlQYXJhbXMgPSBkaXNhYmxlUXVlcnlQYXJhbXNcbiAgICAgICAgICA/IHt9XG4gICAgICAgICAgOiB7XG4gICAgICAgICAgICAgIHF1ZXJ5UGFyYW1zOiB7XG4gICAgICAgICAgICAgICAgcmVkaXJlY3RVcmw6IHJvdXRlWydfcm91dGVyU3RhdGUnXS51cmwsXG4gICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICB9O1xuXG4gICAgICAgIGlmICh0aGlzLmF1dGhTZXJ2aWNlLnRva2VuICYmICFvcHBvc2l0ZSkge1xuICAgICAgICAgIGlmIChyb3V0ZS5kYXRhPy5yb2xlcykge1xuICAgICAgICAgICAgY29uc3QgdXNlciA9IHRoaXMuYXV0aFNlcnZpY2UuY3VycmVudFVzZXI7XG4gICAgICAgICAgICBhbGxvd2VkID0gISFyb3V0ZS5kYXRhLnJvbGVzLmZpbmQoKHJvbGUpID0+IHVzZXIucm9sZXM/LmluY2x1ZGVzKHJvbGUpKTtcblxuICAgICAgICAgICAgaWYgKCFhbGxvd2VkICYmIHJlZGlyZWN0Um9sZVVybCkge1xuICAgICAgICAgICAgICB0aGlzLnJvdXRlci5uYXZpZ2F0ZShbcmVkaXJlY3RSb2xlVXJsXSwgcXVlcnlQYXJhbXMpO1xuICAgICAgICAgICAgICByZWRpcmVjdGVkID0gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgYWxsb3dlZCA9IHRydWU7XG4gICAgICAgICAgfVxuICAgICAgICB9IGVsc2UgaWYgKCF0aGlzLmF1dGhTZXJ2aWNlLnRva2VuICYmIG9wcG9zaXRlKSB7XG4gICAgICAgICAgYWxsb3dlZCA9IHRydWU7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAoIWFsbG93ZWQgJiYgcmVkaXJlY3RBdXRoVXJsICYmICFyZWRpcmVjdGVkKSB7XG4gICAgICAgICAgdGhpcy5yb3V0ZXIubmF2aWdhdGUoW3JlZGlyZWN0QXV0aFVybF0sIHF1ZXJ5UGFyYW1zKTtcbiAgICAgICAgfVxuXG4gICAgICAgIHN1YnNjcmliZXIubmV4dChhbGxvd2VkKTtcbiAgICAgICAgc3Vic2NyaWJlci5jb21wbGV0ZSgpO1xuICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIENhbiBhY3RpdmF0ZSBjaGlsZCByb3V0ZVxuICAgKi9cbiAgY2FuQWN0aXZhdGVDaGlsZChyb3V0ZTogQWN0aXZhdGVkUm91dGVTbmFwc2hvdCwgc3RhdGU6IFJvdXRlclN0YXRlU25hcHNob3QpOiBPYnNlcnZhYmxlPGJvb2xlYW4+IHtcbiAgICByZXR1cm4gdGhpcy5jYW5BY3RpdmF0ZShyb3V0ZSwgc3RhdGUpO1xuICB9XG59XG4iXX0=
|
|
@@ -48,10 +48,10 @@ class InputComponent {
|
|
|
48
48
|
}
|
|
49
49
|
}
|
|
50
50
|
InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
51
|
-
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: InputComponent, selector: "base-input", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", type: "type", required: "required", eyeButton: "eyeButton", objectPath: "objectPath" }, outputs: { enter: "enter" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <div class=\"input-group\">\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [type]=\"type\"\n [formControl]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (keyup.enter)=\"enterEvent()\"\n [attr.aria-describedby]=\"id + 'eye-button'\"\n />\n <button\n class=\"btn btn-outline-primary\"\n type=\"button\"\n [id]=\"id + 'eye-button'\"\n (click)=\"togglePasswordType()\"\n *ngIf=\"eyeButton\"\n >\n <i class=\"bi bi-eye\" *ngIf=\"type === 'password'\"></i>\n <i class=\"bi bi-eye-slash\" *ngIf=\"type === 'text'\"></i>\n </button>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['pattern'] && type === 'tel'\">Bitte eine g\u00FCltige Telefonnummer angeben.</div>\n <div *ngIf=\"control?.errors?.['invalidEmail']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n <div *ngIf=\"control?.errors?.['invalidSecurePassword']\">\n Das Passwort ist zu unsicher. Es muss mind. 8 Zeichen lang sein, ein Gro\u00DFbustabe, ein Kleinbuchstabe, eine Zahl\n und ein Sonderzeichen enthalten.\n </div>\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.input-group>.btn{min-width:100px}button{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
51
|
+
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: InputComponent, selector: "base-input", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", type: "type", required: "required", eyeButton: "eyeButton", objectPath: "objectPath" }, outputs: { enter: "enter" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <div class=\"input-group\">\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [type]=\"type\"\n [formControl]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (keyup.enter)=\"enterEvent()\"\n [attr.aria-describedby]=\"id + 'eye-button'\"\n [attr.data-cy]=\"name\"\n />\n <button\n class=\"btn btn-outline-primary\"\n type=\"button\"\n [id]=\"id + 'eye-button'\"\n (click)=\"togglePasswordType()\"\n *ngIf=\"eyeButton\"\n >\n <i class=\"bi bi-eye\" *ngIf=\"type === 'password'\"></i>\n <i class=\"bi bi-eye-slash\" *ngIf=\"type === 'text'\"></i>\n </button>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['pattern'] && type === 'tel'\">Bitte eine g\u00FCltige Telefonnummer angeben.</div>\n <div *ngIf=\"control?.errors?.['invalidEmail']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n <div *ngIf=\"control?.errors?.['invalidSecurePassword']\">\n Das Passwort ist zu unsicher. Es muss mind. 8 Zeichen lang sein, ein Gro\u00DFbustabe, ein Kleinbuchstabe, eine Zahl\n und ein Sonderzeichen enthalten.\n </div>\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.input-group>.btn{min-width:100px}button{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
52
52
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: InputComponent, decorators: [{
|
|
53
53
|
type: Component,
|
|
54
|
-
args: [{ selector: 'base-input', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <div class=\"input-group\">\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [type]=\"type\"\n [formControl]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (keyup.enter)=\"enterEvent()\"\n [attr.aria-describedby]=\"id + 'eye-button'\"\n />\n <button\n class=\"btn btn-outline-primary\"\n type=\"button\"\n [id]=\"id + 'eye-button'\"\n (click)=\"togglePasswordType()\"\n *ngIf=\"eyeButton\"\n >\n <i class=\"bi bi-eye\" *ngIf=\"type === 'password'\"></i>\n <i class=\"bi bi-eye-slash\" *ngIf=\"type === 'text'\"></i>\n </button>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['pattern'] && type === 'tel'\">Bitte eine g\u00FCltige Telefonnummer angeben.</div>\n <div *ngIf=\"control?.errors?.['invalidEmail']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n <div *ngIf=\"control?.errors?.['invalidSecurePassword']\">\n Das Passwort ist zu unsicher. Es muss mind. 8 Zeichen lang sein, ein Gro\u00DFbustabe, ein Kleinbuchstabe, eine Zahl\n und ein Sonderzeichen enthalten.\n </div>\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.input-group>.btn{min-width:100px}button{height:100%}\n"] }]
|
|
54
|
+
args: [{ selector: 'base-input', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <div class=\"input-group\">\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [type]=\"type\"\n [formControl]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (keyup.enter)=\"enterEvent()\"\n [attr.aria-describedby]=\"id + 'eye-button'\"\n [attr.data-cy]=\"name\"\n />\n <button\n class=\"btn btn-outline-primary\"\n type=\"button\"\n [id]=\"id + 'eye-button'\"\n (click)=\"togglePasswordType()\"\n *ngIf=\"eyeButton\"\n >\n <i class=\"bi bi-eye\" *ngIf=\"type === 'password'\"></i>\n <i class=\"bi bi-eye-slash\" *ngIf=\"type === 'text'\"></i>\n </button>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['pattern'] && type === 'tel'\">Bitte eine g\u00FCltige Telefonnummer angeben.</div>\n <div *ngIf=\"control?.errors?.['invalidEmail']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n <div *ngIf=\"control?.errors?.['invalidSecurePassword']\">\n Das Passwort ist zu unsicher. Es muss mind. 8 Zeichen lang sein, ein Gro\u00DFbustabe, ein Kleinbuchstabe, eine Zahl\n und ein Sonderzeichen enthalten.\n </div>\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.input-group>.btn{min-width:100px}button{height:100%}\n"] }]
|
|
55
55
|
}], propDecorators: { id: [{
|
|
56
56
|
type: Input
|
|
57
57
|
}], name: [{
|
|
@@ -466,10 +466,10 @@ class TagsComponent {
|
|
|
466
466
|
}
|
|
467
467
|
}
|
|
468
468
|
TagsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
469
|
-
TagsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TagsComponent, selector: "base-tags", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", options: "options", custom: "custom", removeByKey: "removeByKey", required: "required", objectPath: "objectPath", validators: "validators" }, ngImport: i0, template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n {{ getReadableTag(tag) }}\n <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n </div>\n </div>\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n [(ngModel)]=\"inputValue\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n type=\"text\"\n class=\"form-control\"\n (keyup)=\"enterKey($event)\"\n />\n\n <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option?.text, true, true)\">\n {{ option?.text }}\n </div>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && inputValue\">\n {{ inputValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte gib eine g\u00FCltige E-Mail Adresse ein.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
469
|
+
TagsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TagsComponent, selector: "base-tags", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", options: "options", custom: "custom", removeByKey: "removeByKey", required: "required", objectPath: "objectPath", validators: "validators" }, ngImport: i0, template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n {{ getReadableTag(tag) }}\n <span (click)=\"removeTag(tag)\" data-cy=\"input-tags-item-remove\"><i class=\"bi bi-x-circle\"></i></span>\n </div>\n </div>\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n [(ngModel)]=\"inputValue\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n type=\"text\"\n class=\"form-control\"\n (keyup)=\"enterKey($event)\"\n [attr.data-cy]=\"'input-tags-field'\"\n />\n\n <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option?.text, true, true)\">\n {{ option?.text }}\n </div>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && inputValue\">\n {{ inputValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte gib eine g\u00FCltige E-Mail Adresse ein.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
470
470
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TagsComponent, decorators: [{
|
|
471
471
|
type: Component,
|
|
472
|
-
args: [{ selector: 'base-tags', template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n {{ getReadableTag(tag) }}\n <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n </div>\n </div>\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n [(ngModel)]=\"inputValue\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n type=\"text\"\n class=\"form-control\"\n (keyup)=\"enterKey($event)\"\n />\n\n <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option?.text, true, true)\">\n {{ option?.text }}\n </div>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && inputValue\">\n {{ inputValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte gib eine g\u00FCltige E-Mail Adresse ein.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"] }]
|
|
472
|
+
args: [{ selector: 'base-tags', template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n {{ getReadableTag(tag) }}\n <span (click)=\"removeTag(tag)\" data-cy=\"input-tags-item-remove\"><i class=\"bi bi-x-circle\"></i></span>\n </div>\n </div>\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n [(ngModel)]=\"inputValue\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n type=\"text\"\n class=\"form-control\"\n (keyup)=\"enterKey($event)\"\n [attr.data-cy]=\"'input-tags-field'\"\n />\n\n <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option?.text, true, true)\">\n {{ option?.text }}\n </div>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && inputValue\">\n {{ inputValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte gib eine g\u00FCltige E-Mail Adresse ein.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"] }]
|
|
473
473
|
}], propDecorators: { id: [{
|
|
474
474
|
type: Input
|
|
475
475
|
}], name: [{
|