@testgorilla/tgo-ui 2.32.1-beta.1 → 2.32.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/components/field/field.component.d.ts +0 -1
- package/components/side-panel/side-panel.service.d.ts +2 -2
- package/esm2022/components/field/field.component.mjs +3 -11
- package/esm2022/components/side-panel/side-panel.service.mjs +5 -6
- package/fesm2022/testgorilla-tgo-ui.mjs +6 -15
- package/fesm2022/testgorilla-tgo-ui.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -8,10 +8,10 @@ export class SidePanelService {
|
|
|
8
8
|
this.injector = inject(EnvironmentInjector);
|
|
9
9
|
this.appRef = inject(ApplicationRef);
|
|
10
10
|
}
|
|
11
|
-
open(content, config,
|
|
11
|
+
open(content, config, providers = []) {
|
|
12
12
|
const panelConfig = { ...this.defaultSidePanelConfig, ...config };
|
|
13
13
|
if (!this.SidePanelComponentRef) {
|
|
14
|
-
const injector = this.createSidePanelInjector(panelConfig,
|
|
14
|
+
const injector = this.createSidePanelInjector(panelConfig, providers);
|
|
15
15
|
const SidePanelComponentRef = this.createSidePanelComponent(panelConfig.position, injector);
|
|
16
16
|
this.SidePanelComponentRef = SidePanelComponentRef;
|
|
17
17
|
}
|
|
@@ -34,10 +34,9 @@ export class SidePanelService {
|
|
|
34
34
|
this.contentComponentRef = undefined;
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
|
-
createSidePanelInjector(config,
|
|
37
|
+
createSidePanelInjector(config, providers = []) {
|
|
38
38
|
return Injector.create({
|
|
39
|
-
|
|
40
|
-
providers: [{ provide: SidePanelConfig, useValue: config }],
|
|
39
|
+
providers: [{ provide: SidePanelConfig, useValue: config }, ...providers],
|
|
41
40
|
});
|
|
42
41
|
}
|
|
43
42
|
createSidePanelComponent(position, injector) {
|
|
@@ -74,4 +73,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
74
73
|
providedIn: 'root',
|
|
75
74
|
}]
|
|
76
75
|
}], ctorParameters: () => [] });
|
|
77
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
76
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZS1wYW5lbC5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdGdvLWNhbm9weS11aS9jb21wb25lbnRzL3NpZGUtcGFuZWwvc2lkZS1wYW5lbC5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxjQUFjLEVBRWQsZUFBZSxFQUVmLG1CQUFtQixFQUNuQixNQUFNLEVBQ04sVUFBVSxFQUNWLFFBQVEsRUFFUixXQUFXLEdBRVosTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDNUQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLGVBQWUsRUFBcUIsTUFBTSxvQkFBb0IsQ0FBQzs7QUFLM0YsTUFBTSxPQUFPLGdCQUFnQjtJQVEzQjtRQUpRLDJCQUFzQixHQUFvQixNQUFNLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUNwRSxhQUFRLEdBQUcsTUFBTSxDQUFDLG1CQUFtQixDQUFDLENBQUM7UUFDdkMsV0FBTSxHQUFHLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztJQUV6QixDQUFDO0lBRWhCLElBQUksQ0FBQyxPQUFxQyxFQUFFLE1BQWdDLEVBQUUsWUFBd0IsRUFBRTtRQUN0RyxNQUFNLFdBQVcsR0FBb0IsRUFBRSxHQUFHLElBQUksQ0FBQyxzQkFBc0IsRUFBRSxHQUFHLE1BQU0sRUFBRSxDQUFDO1FBRW5GLElBQUksQ0FBQyxJQUFJLENBQUMscUJBQXFCLEVBQUUsQ0FBQztZQUNoQyxNQUFNLFFBQVEsR0FBRyxJQUFJLENBQUMsdUJBQXVCLENBQUMsV0FBVyxFQUFFLFNBQVMsQ0FBQyxDQUFDO1lBQ3RFLE1BQU0scUJBQXFCLEdBQUcsSUFBSSxDQUFDLHdCQUF3QixDQUFDLFdBQVcsQ0FBQyxRQUFRLEVBQUUsUUFBUSxDQUFDLENBQUM7WUFDNUYsSUFBSSxDQUFDLHFCQUFxQixHQUFHLHFCQUFxQixDQUFDO1FBQ3JELENBQUM7UUFFRCxJQUFJLE9BQU8sWUFBWSxXQUFXLEVBQUUsQ0FBQztZQUNuQyxJQUFJLENBQUMsWUFBWSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQzdCLENBQUM7YUFBTSxDQUFDO1lBQ04sSUFBSSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUM5QixDQUFDO1FBRUQsSUFBSSxDQUFDLHFCQUFxQixDQUFDLFFBQVEsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUM3QyxDQUFDO0lBRUQsZ0JBQWdCO1FBQ2QsSUFBSSxJQUFJLENBQUMscUJBQXFCLEVBQUUsQ0FBQztZQUMvQixJQUFJLENBQUMsTUFBTSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMscUJBQXFCLENBQUMsUUFBUSxDQUFDLENBQUM7WUFDNUQsSUFBSSxDQUFDLHFCQUFxQixDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ3JDLElBQUksQ0FBQyxxQkFBcUIsR0FBRyxTQUFTLENBQUM7UUFDekMsQ0FBQztRQUVELElBQUksSUFBSSxDQUFDLG1CQUFtQixFQUFFLENBQUM7WUFDN0IsSUFBSSxDQUFDLG1CQUFtQixDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ25DLElBQUksQ0FBQyxtQkFBbUIsR0FBRyxTQUFTLENBQUM7UUFDdkMsQ0FBQztJQUNILENBQUM7SUFFTyx1QkFBdUIsQ0FBQyxNQUF1QixFQUFFLFlBQXdCLEVBQUU7UUFDakYsT0FBTyxRQUFRLENBQUMsTUFBTSxDQUFDO1lBQ3JCLFNBQVMsRUFBRSxDQUFDLEVBQUUsT0FBTyxFQUFFLGVBQWUsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFFLEVBQUUsR0FBRyxTQUFTLENBQUM7U0FDMUUsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLHdCQUF3QixDQUFDLFFBQTJCLEVBQUUsUUFBa0I7UUFDOUUsTUFBTSxxQkFBcUIsR0FBRyxlQUFlLENBQUMsa0JBQWtCLEVBQUU7WUFDaEUsbUJBQW1CLEVBQUUsSUFBSSxDQUFDLFFBQVE7WUFDbEMsZUFBZSxFQUFFLFFBQVE7U0FDMUIsQ0FBQyxDQUFDO1FBRUgsSUFBSSxDQUFDLE1BQU0sQ0FBQyxVQUFVLENBQUMscUJBQXFCLENBQUMsUUFBUSxDQUFDLENBQUM7UUFFdkQsTUFBTSxXQUFXLEdBQUkscUJBQXFCLENBQUMsUUFBaUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFnQixDQUFDO1FBQ3pHLFdBQVcsQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLEVBQUUsU0FBUyxDQUFDLEdBQUcsQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUVsRSxRQUFRLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUV2QyxPQUFPLHFCQUFxQixDQUFDO0lBQy9CLENBQUM7SUFFTyxhQUFhLENBQUMsU0FBb0I7UUFDeEMsTUFBTSxnQkFBZ0IsR0FBRyxJQUFJLENBQUMscUJBQXFCLEVBQUUsUUFBUSxDQUFDLGtCQUFrQixDQUFDO1FBQ2pGLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztZQUNyQixnQkFBZ0IsRUFBRSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQzNCLElBQUksQ0FBQyxtQkFBbUIsR0FBRyxnQkFBZ0IsRUFBRSxDQUFDLGVBQWUsQ0FBQyxTQUFTLENBQUMsQ0FBQztRQUMzRSxDQUFDO0lBQ0gsQ0FBQztJQUVPLFlBQVksQ0FBQyxRQUEwQjtRQUM3QyxNQUFNLGdCQUFnQixHQUFHLElBQUksQ0FBQyxxQkFBcUIsRUFBRSxRQUFRLENBQUMsa0JBQWtCLENBQUM7UUFDakYsSUFBSSxnQkFBZ0IsRUFBRSxDQUFDO1lBQ3JCLGdCQUFnQixFQUFFLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDM0IsSUFBSSxDQUFDLGVBQWUsR0FBRyxnQkFBZ0IsRUFBRSxDQUFDLGtCQUFrQixDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBQ3pFLENBQUM7SUFDSCxDQUFDOytHQTdFVSxnQkFBZ0I7bUhBQWhCLGdCQUFnQixjQUZmLE1BQU07OzRGQUVQLGdCQUFnQjtrQkFINUIsVUFBVTttQkFBQztvQkFDVixVQUFVLEVBQUUsTUFBTTtpQkFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBBcHBsaWNhdGlvblJlZixcbiAgQ29tcG9uZW50UmVmLFxuICBjcmVhdGVDb21wb25lbnQsXG4gIEVtYmVkZGVkVmlld1JlZixcbiAgRW52aXJvbm1lbnRJbmplY3RvcixcbiAgaW5qZWN0LFxuICBJbmplY3RhYmxlLFxuICBJbmplY3RvcixcbiAgUHJvdmlkZXIsXG4gIFRlbXBsYXRlUmVmLFxuICBUeXBlLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNpZGVQYW5lbENvbXBvbmVudCB9IGZyb20gJy4vc2lkZS1wYW5lbC5jb21wb25lbnQnO1xuaW1wb3J0IHsgU0lERV9QQU5FTF9DT05GSUcsIFNpZGVQYW5lbENvbmZpZywgU2lkZVBhbmVsUG9zaXRpb24gfSBmcm9tICcuL3NpZGUtcGFuZWwubW9kZWwnO1xuXG5ASW5qZWN0YWJsZSh7XG4gIHByb3ZpZGVkSW46ICdyb290Jyxcbn0pXG5leHBvcnQgY2xhc3MgU2lkZVBhbmVsU2VydmljZSB7XG4gIHByaXZhdGUgU2lkZVBhbmVsQ29tcG9uZW50UmVmPzogQ29tcG9uZW50UmVmPFNpZGVQYW5lbENvbXBvbmVudD47XG4gIHByaXZhdGUgY29udGVudENvbXBvbmVudFJlZj86IENvbXBvbmVudFJlZjxhbnk+O1xuICBwcml2YXRlIGVtYmVkZGVkVmlld1JlZj86IEVtYmVkZGVkVmlld1JlZjxhbnk+O1xuICBwcml2YXRlIGRlZmF1bHRTaWRlUGFuZWxDb25maWc6IFNpZGVQYW5lbENvbmZpZyA9IGluamVjdChTSURFX1BBTkVMX0NPTkZJRyk7XG4gIHByaXZhdGUgaW5qZWN0b3IgPSBpbmplY3QoRW52aXJvbm1lbnRJbmplY3Rvcik7XG4gIHByaXZhdGUgYXBwUmVmID0gaW5qZWN0KEFwcGxpY2F0aW9uUmVmKTtcblxuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgb3Blbihjb250ZW50OiBUeXBlPGFueT4gfCBUZW1wbGF0ZVJlZjxhbnk+LCBjb25maWc6IFBhcnRpYWw8U2lkZVBhbmVsQ29uZmlnPiwgcHJvdmlkZXJzOiBQcm92aWRlcltdID0gW10pOiB2b2lkIHtcbiAgICBjb25zdCBwYW5lbENvbmZpZzogU2lkZVBhbmVsQ29uZmlnID0geyAuLi50aGlzLmRlZmF1bHRTaWRlUGFuZWxDb25maWcsIC4uLmNvbmZpZyB9O1xuXG4gICAgaWYgKCF0aGlzLlNpZGVQYW5lbENvbXBvbmVudFJlZikge1xuICAgICAgY29uc3QgaW5qZWN0b3IgPSB0aGlzLmNyZWF0ZVNpZGVQYW5lbEluamVjdG9yKHBhbmVsQ29uZmlnLCBwcm92aWRlcnMpO1xuICAgICAgY29uc3QgU2lkZVBhbmVsQ29tcG9uZW50UmVmID0gdGhpcy5jcmVhdGVTaWRlUGFuZWxDb21wb25lbnQocGFuZWxDb25maWcucG9zaXRpb24sIGluamVjdG9yKTtcbiAgICAgIHRoaXMuU2lkZVBhbmVsQ29tcG9uZW50UmVmID0gU2lkZVBhbmVsQ29tcG9uZW50UmVmO1xuICAgIH1cblxuICAgIGlmIChjb250ZW50IGluc3RhbmNlb2YgVGVtcGxhdGVSZWYpIHtcbiAgICAgIHRoaXMubG9hZFRlbXBsYXRlKGNvbnRlbnQpO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmxvYWRDb21wb25lbnQoY29udGVudCk7XG4gICAgfVxuXG4gICAgdGhpcy5TaWRlUGFuZWxDb21wb25lbnRSZWYuaW5zdGFuY2Uub3BlbigpO1xuICB9XG5cbiAgZGVzdHJveUNvbXBvbmVudCgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5TaWRlUGFuZWxDb21wb25lbnRSZWYpIHtcbiAgICAgIHRoaXMuYXBwUmVmLmRldGFjaFZpZXcodGhpcy5TaWRlUGFuZWxDb21wb25lbnRSZWYuaG9zdFZpZXcpO1xuICAgICAgdGhpcy5TaWRlUGFuZWxDb21wb25lbnRSZWYuZGVzdHJveSgpO1xuICAgICAgdGhpcy5TaWRlUGFuZWxDb21wb25lbnRSZWYgPSB1bmRlZmluZWQ7XG4gICAgfVxuXG4gICAgaWYgKHRoaXMuY29udGVudENvbXBvbmVudFJlZikge1xuICAgICAgdGhpcy5jb250ZW50Q29tcG9uZW50UmVmLmRlc3Ryb3koKTtcbiAgICAgIHRoaXMuY29udGVudENvbXBvbmVudFJlZiA9IHVuZGVmaW5lZDtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIGNyZWF0ZVNpZGVQYW5lbEluamVjdG9yKGNvbmZpZzogU2lkZVBhbmVsQ29uZmlnLCBwcm92aWRlcnM6IFByb3ZpZGVyW10gPSBbXSk6IEluamVjdG9yIHtcbiAgICByZXR1cm4gSW5qZWN0b3IuY3JlYXRlKHtcbiAgICAgIHByb3ZpZGVyczogW3sgcHJvdmlkZTogU2lkZVBhbmVsQ29uZmlnLCB1c2VWYWx1ZTogY29uZmlnIH0sIC4uLnByb3ZpZGVyc10sXG4gICAgfSk7XG4gIH1cblxuICBwcml2YXRlIGNyZWF0ZVNpZGVQYW5lbENvbXBvbmVudChwb3NpdGlvbjogU2lkZVBhbmVsUG9zaXRpb24sIGluamVjdG9yOiBJbmplY3Rvcik6IENvbXBvbmVudFJlZjxTaWRlUGFuZWxDb21wb25lbnQ+IHtcbiAgICBjb25zdCBzaWRlUGFuZWxDb21wb25lbnRSZWYgPSBjcmVhdGVDb21wb25lbnQoU2lkZVBhbmVsQ29tcG9uZW50LCB7XG4gICAgICBlbnZpcm9ubWVudEluamVjdG9yOiB0aGlzLmluamVjdG9yLFxuICAgICAgZWxlbWVudEluamVjdG9yOiBpbmplY3RvcixcbiAgICB9KTtcblxuICAgIHRoaXMuYXBwUmVmLmF0dGFjaFZpZXcoc2lkZVBhbmVsQ29tcG9uZW50UmVmLmhvc3RWaWV3KTtcblxuICAgIGNvbnN0IHNpZGVQYW5lbEVsID0gKHNpZGVQYW5lbENvbXBvbmVudFJlZi5ob3N0VmlldyBhcyBFbWJlZGRlZFZpZXdSZWY8YW55Pikucm9vdE5vZGVzWzBdIGFzIEhUTUxFbGVtZW50O1xuICAgIHNpZGVQYW5lbEVsLnF1ZXJ5U2VsZWN0b3IoJy5zaWRlLXBhbmVsJyk/LmNsYXNzTGlzdC5hZGQocG9zaXRpb24pO1xuXG4gICAgZG9jdW1lbnQuYm9keS5hcHBlbmRDaGlsZChzaWRlUGFuZWxFbCk7XG5cbiAgICByZXR1cm4gc2lkZVBhbmVsQ29tcG9uZW50UmVmO1xuICB9XG5cbiAgcHJpdmF0ZSBsb2FkQ29tcG9uZW50KGNvbXBvbmVudDogVHlwZTxhbnk+KTogdm9pZCB7XG4gICAgY29uc3Qgdmlld0NvbnRhaW5lclJlZiA9IHRoaXMuU2lkZVBhbmVsQ29tcG9uZW50UmVmPy5pbnN0YW5jZS5zaWRlUGFuZWxDb250YWluZXI7XG4gICAgaWYgKHZpZXdDb250YWluZXJSZWYpIHtcbiAgICAgIHZpZXdDb250YWluZXJSZWYoKS5jbGVhcigpO1xuICAgICAgdGhpcy5jb250ZW50Q29tcG9uZW50UmVmID0gdmlld0NvbnRhaW5lclJlZigpLmNyZWF0ZUNvbXBvbmVudChjb21wb25lbnQpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgbG9hZFRlbXBsYXRlKHRlbXBsYXRlOiBUZW1wbGF0ZVJlZjxhbnk+KTogdm9pZCB7XG4gICAgY29uc3Qgdmlld0NvbnRhaW5lclJlZiA9IHRoaXMuU2lkZVBhbmVsQ29tcG9uZW50UmVmPy5pbnN0YW5jZS5zaWRlUGFuZWxDb250YWluZXI7XG4gICAgaWYgKHZpZXdDb250YWluZXJSZWYpIHtcbiAgICAgIHZpZXdDb250YWluZXJSZWYoKS5jbGVhcigpO1xuICAgICAgdGhpcy5lbWJlZGRlZFZpZXdSZWYgPSB2aWV3Q29udGFpbmVyUmVmKCkuY3JlYXRlRW1iZWRkZWRWaWV3KHRlbXBsYXRlKTtcbiAgICB9XG4gIH1cbn1cbiJdfQ==
|
|
@@ -7292,14 +7292,6 @@ class FieldComponent {
|
|
|
7292
7292
|
this.disabled = isDisabled;
|
|
7293
7293
|
this.cdr.markForCheck();
|
|
7294
7294
|
}
|
|
7295
|
-
onFieldClick(event) {
|
|
7296
|
-
if (this.type === 'collapsed-search') {
|
|
7297
|
-
this.type = 'search';
|
|
7298
|
-
}
|
|
7299
|
-
else {
|
|
7300
|
-
event.stopPropagation();
|
|
7301
|
-
}
|
|
7302
|
-
}
|
|
7303
7295
|
onActive(state, action) {
|
|
7304
7296
|
if (action === 'hover') {
|
|
7305
7297
|
this.isActiveHover = state;
|
|
@@ -7332,11 +7324,11 @@ class FieldComponent {
|
|
|
7332
7324
|
}, 0);
|
|
7333
7325
|
}
|
|
7334
7326
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i1.MatIconRegistry }, { token: i2.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: i1$2.NgControl, optional: true, self: true }, { token: i2$3.FocusMonitor }, { token: i0.NgZone }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7335
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FieldComponent, selector: "ui-field", inputs: { fullWidth: "fullWidth", label: "label", fieldName: "fieldName", placeholder: "placeholder", id: "id", value: "value", errors: "errors", disabled: "disabled", required: "required", readOnly: "readOnly", hintMessage: "hintMessage", type: "type", updateOnBlur: "updateOnBlur", allowOnlyDigits: "allowOnlyDigits", allowNegative: "allowNegative", showBottomContent: "showBottomContent", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", loading: "loading", isValid: "isValid", maxCharacters: "maxCharacters", trimOnBlur: "trimOnBlur", trimOnSubmit: "trimOnSubmit", maxRows: "maxRows", hideBuiltInErrors: "hideBuiltInErrors", hideLabelInErrors: "hideLabelInErrors", max: "max", min: "min", textareaHeight: "textareaHeight", ariaLabelledby: "ariaLabelledby", ariaDescribedby: "ariaDescribedby", hasError: "hasError" }, outputs: { validateEvent: "validateEvent", fieldBlur: "fieldBlur" }, host: { properties: { "class": "this.class", "class.full-width": "this.fullWidth", "attr.field-class": "this.type", "attr.theme": "this.applicationTheme" } }, viewQueries: [{ propertyName: "field", first: true, predicate: ["inputElement"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container>\n <mat-form-field\n [ngStyle]=\"{ '--textarea-height': (textareaHeight - 10) + 'px', '--textarea-height-container': textareaHeight + 'px' }\"\n (click)=\"onFieldClick($event)\"\n #uiField\n appearance=\"outline\"\n [color]=\"(errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, textarea: type === 'textarea', 'multi-line': type === 'multi-line', 'keyboard-focused': keyboardFocused(), 'has-label': !!label }\"\n (mouseenter)=\"onActive(true, 'hover')\"\n (mouseleave)=\"onActive(false, 'hover')\"\n >\n <span [style.display]=\"'none'\" [id]=\"'ariaDescribedby'\">\n <span *ngIf=\"required\">{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n {{ ariaDescribedby }}\n </span>\n <span [style.display]=\"'none'\" [id]=\"'ariaLabelledby'\">\n {{ ariaLabelledby || label }}\n </span>\n <mat-label [id]=\"'label'\" *ngIf=\"label && ((type !== 'search' && applicationTheme === 'classic') || (applicationTheme !== 'classic'))\">{{ label }}</mat-label>\n <mat-icon *ngIf=\"type === 'search' || type === 'collapsed-search'\" matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n <input\n [readonly]=\"readOnly\"\n *ngIf=\"type !== 'textarea' && type !== 'multi-line'; else textarea\"\n matInput\n #inputElement\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled || loading\"\n [type]=\"currentType\"\n (keyup.enter)=\"onSubmit()\"\n [max]=\"max\"\n [min]=\"min\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n digitsOnly\n [allowOnlyDigits]=\"allowOnlyDigits\"\n [allowNegative]=\"allowNegative\"\n (focusin)=\"onActive(true, 'focus')\"\n />\n\n <ng-template #textarea>\n <textarea\n matInput\n #inputElement\n [readonly]=\"readOnly\"\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n (keyup.enter)=\"onSubmit()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [type]=\"currentType\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"!label ? ariaLabel : ''\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n [cdkTextareaAutosize]=\"type === 'multi-line'\"\n [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5 \"\n (focusin)=\"onActive(true, 'focus')\"\n ></textarea>\n </ng-template>\n\n <div class=\"options\" *ngIf=\"type === 'search' || type === 'password' || type === 'validation-text'\">\n <div class=\"options-container\">\n <ui-button\n *ngIf=\"showClose\"\n variant=\"secondary\"\n [justIcon]=\"true\"\n class=\"close\"\n iconName=\"Close\"\n [label]=\"(('COMMON.CLEAR') | uiTranslate | async)!\"\n (buttonClickEvent)=\"clearValue()\"\n [ariaLabel]=\"ariaLabel + '--' + (('COMMON.CLEAR') | uiTranslate | async)\"\n ></ui-button>\n <ui-button\n class=\"password\"\n variant=\"secondary\"\n [tooltip]=\"((showPassword ? ('FIELD.HIDE_PASSWORD') : ('FIELD.SHOW_PASSWORD')) | uiTranslate | async)!\"\n *ngIf=\"type === 'password'\"\n [justIcon]=\"true\"\n role=\"switch\"\n [attr.aria-checked]=\"showPassword\"\n [iconName]=\"getPasswordIcon\"\n [applicationTheme]=\"applicationTheme\"\n (click)=\"showPasswordClick()\"\n #btn\n (keydown.enter)=\"refocusPasswordButton(btn)\"\n (keydown.space)=\"refocusPasswordButton(btn)\"\n ></ui-button>\n\n <ng-container\n *ngIf=\"type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\"\n >\n <ui-button\n *ngIf=\"!isValid\"\n class=\"validation\"\n [variant]=\"'text'\"\n [applicationTheme]=\"'light'\"\n [label]=\"'Validate'\"\n [loading]=\"loading\"\n (click)=\"validate()\"\n [disabled]=\"disabled\"\n [size]=\"'small'\"\n ></ui-button>\n <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\" *ngIf=\"isValid\"></ui-icon>\n </ng-container>\n </div>\n </div>\n <mat-hint class=\"info\" *ngIf=\"type === 'textarea' && !errorsLength && !(ngControl?.errors | hasValidationError)\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n <mat-hint class=\"info\" *ngIf=\"hintMessage && !errorsLength && !(ngControl?.errors | hasValidationError) && type !== 'textarea'\">{{ hintMessage }}</mat-hint>\n <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.errors | hasValidationError)\">\n <ng-template [ngIf]=\"errorsLength\">\n <div class=\"errors\" *ngFor=\"let error of _errors; trackBy: trackByFn\">\n <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n <span [innerHTML]=\"error\"></span>\n </div>\n </ng-template>\n\n <ui-validation-error *ngIf=\"ngControl && !hideBuiltInErrors\" [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n </mat-hint>\n </mat-form-field>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-form-field.keyboard-focused{position:relative}.mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;top:0;border-radius:10px;left:0;width:100%;height:100%;outline:2px solid #ffffff;z-index:-1}.mat-mdc-form-field.keyboard-focused .mat-mdc-form-field-subscript-wrapper{z-index:-1}.mat-mdc-form-field.has-label .mdc-notched-outline__notch{position:relative}.mat-mdc-form-field.has-label .mdc-notched-outline__notch:after{content:\"\";position:absolute;top:0;left:0;background:#fff;width:100%;height:5px;z-index:-1}.active-field .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading{border-left-width:2px;border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch{border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-top-width:2px;border-bottom-width:2px;border-right-width:2px}.ui-field{display:block;width:320px}.ui-field.full-width{width:100%}.ui-field[field-class=collapsed-search]{width:56px!important;display:block}.ui-field[field-class=collapsed-search] mat-form-field{width:56px!important}.ui-field[field-class=collapsed-search] .mat-mdc-floating-label{display:none!important}.ui-field[field-class=collapsed-search] .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;width:100vw!important}.ui-field .mat-mdc-form-field-subscript-wrapper{margin:0!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field:hover.mat-form-field-appearance-outline .mdc-notched-outline__notch,.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mdc-notched-outline__notch{border-top:2px solid #276678!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline__notch{border-top:1px solid var(--mdc-outlined-text-field-outline-color)!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{top:28px!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line textarea{margin-top:8px;min-height:32px!important}.ui-field .mat-mdc-form-field.textarea .mat-mdc-text-field-wrapper{height:var(--textarea-height-container)!important}.ui-field .mat-mdc-form-field.textarea textarea{max-height:var(--textarea-height)!important;min-height:var(--textarea-height)!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#276678!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#cb7b7a!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{background:#fff!important;top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-prefix,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .search-icon{padding:12px 8px 12px 16px;color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button.password{width:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container button,.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container span{width:24px!important;height:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon{background:#3c9a13;border-radius:100%}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon svg{color:#fff!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation svg circle{stroke:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation *{color:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-input-element,.ui-field .mat-mdc-form-field.mat-form-field-disabled .mdc-floating-label{pointer-events:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label{color:#e9e9e9!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading{border-top-left-radius:10px;border-bottom-left-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-top-right-radius:10px;border-bottom-right-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i5.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i8$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "applicationTheme", "useFullIconName"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ValidationErrorComponent, selector: "ui-validation-error", inputs: ["ngControl", "touchedOn", "errorMessage", "label", "applicationTheme"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[digitsOnly]", inputs: ["allowNegative", "allowDecimal", "allowOnlyDigits"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: HasValidationErrorPipe, name: "hasValidationError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
7327
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FieldComponent, selector: "ui-field", inputs: { fullWidth: "fullWidth", label: "label", fieldName: "fieldName", placeholder: "placeholder", id: "id", value: "value", errors: "errors", disabled: "disabled", required: "required", readOnly: "readOnly", hintMessage: "hintMessage", type: "type", updateOnBlur: "updateOnBlur", allowOnlyDigits: "allowOnlyDigits", allowNegative: "allowNegative", showBottomContent: "showBottomContent", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", loading: "loading", isValid: "isValid", maxCharacters: "maxCharacters", trimOnBlur: "trimOnBlur", trimOnSubmit: "trimOnSubmit", maxRows: "maxRows", hideBuiltInErrors: "hideBuiltInErrors", hideLabelInErrors: "hideLabelInErrors", max: "max", min: "min", textareaHeight: "textareaHeight", ariaLabelledby: "ariaLabelledby", ariaDescribedby: "ariaDescribedby", hasError: "hasError" }, outputs: { validateEvent: "validateEvent", fieldBlur: "fieldBlur" }, host: { properties: { "class": "this.class", "class.full-width": "this.fullWidth", "attr.field-class": "this.type", "attr.theme": "this.applicationTheme" } }, viewQueries: [{ propertyName: "field", first: true, predicate: ["inputElement"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container>\n <mat-form-field\n [ngStyle]=\"{ '--textarea-height': (textareaHeight - 10) + 'px', '--textarea-height-container': textareaHeight + 'px' }\"\n #uiField\n appearance=\"outline\"\n [color]=\"(errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, textarea: type === 'textarea', 'multi-line': type === 'multi-line', 'keyboard-focused': keyboardFocused(), 'has-label': !!label, 'has-value': !!value }\"\n (mouseenter)=\"onActive(true, 'hover')\"\n (mouseleave)=\"onActive(false, 'hover')\"\n >\n <span [style.display]=\"'none'\" [id]=\"'ariaDescribedby'\">\n <span *ngIf=\"required\">{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n {{ ariaDescribedby }}\n </span>\n <span [style.display]=\"'none'\" [id]=\"'ariaLabelledby'\">\n {{ ariaLabelledby || label }}\n </span>\n <mat-label [id]=\"'label'\" *ngIf=\"label && ((type !== 'search' && applicationTheme === 'classic') || (applicationTheme !== 'classic'))\">{{ label }}</mat-label>\n <mat-icon *ngIf=\"type === 'search' || type === 'collapsed-search'\" matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n <input\n [readonly]=\"readOnly\"\n *ngIf=\"type !== 'textarea' && type !== 'multi-line'; else textarea\"\n matInput\n #inputElement\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled || loading\"\n [type]=\"currentType\"\n (keyup.enter)=\"onSubmit()\"\n [max]=\"max\"\n [min]=\"min\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n digitsOnly\n [allowOnlyDigits]=\"allowOnlyDigits\"\n [allowNegative]=\"allowNegative\"\n (focusin)=\"onActive(true, 'focus')\"\n />\n\n <ng-template #textarea>\n <textarea\n matInput\n #inputElement\n [readonly]=\"readOnly\"\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n (keyup.enter)=\"onSubmit()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [type]=\"currentType\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"!label ? ariaLabel : ''\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n [cdkTextareaAutosize]=\"type === 'multi-line'\"\n [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5 \"\n (focusin)=\"onActive(true, 'focus')\"\n ></textarea>\n </ng-template>\n\n <div class=\"options\" *ngIf=\"type === 'search' || type === 'password' || type === 'validation-text'\">\n <div class=\"options-container\">\n <ui-button\n *ngIf=\"showClose\"\n variant=\"secondary\"\n [justIcon]=\"true\"\n class=\"close\"\n iconName=\"Close\"\n [label]=\"(('COMMON.CLEAR') | uiTranslate | async)!\"\n (buttonClickEvent)=\"clearValue()\"\n [ariaLabel]=\"ariaLabel + '--' + (('COMMON.CLEAR') | uiTranslate | async)\"\n ></ui-button>\n <ui-button\n class=\"password\"\n variant=\"secondary\"\n [tooltip]=\"((showPassword ? ('FIELD.HIDE_PASSWORD') : ('FIELD.SHOW_PASSWORD')) | uiTranslate | async)!\"\n *ngIf=\"type === 'password'\"\n [justIcon]=\"true\"\n role=\"switch\"\n [attr.aria-checked]=\"showPassword\"\n [iconName]=\"getPasswordIcon\"\n [applicationTheme]=\"applicationTheme\"\n (click)=\"showPasswordClick()\"\n #btn\n (keydown.enter)=\"refocusPasswordButton(btn)\"\n (keydown.space)=\"refocusPasswordButton(btn)\"\n ></ui-button>\n\n <ng-container\n *ngIf=\"type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\"\n >\n <ui-button\n *ngIf=\"!isValid\"\n class=\"validation\"\n [variant]=\"'text'\"\n [applicationTheme]=\"'light'\"\n [label]=\"'Validate'\"\n [loading]=\"loading\"\n (click)=\"validate()\"\n [disabled]=\"disabled\"\n [size]=\"'small'\"\n ></ui-button>\n <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\" *ngIf=\"isValid\"></ui-icon>\n </ng-container>\n </div>\n </div>\n <mat-hint class=\"info\" *ngIf=\"type === 'textarea' && !errorsLength && !(ngControl?.errors | hasValidationError)\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n <mat-hint class=\"info\" *ngIf=\"hintMessage && !errorsLength && !(ngControl?.errors | hasValidationError) && type !== 'textarea'\">{{ hintMessage }}</mat-hint>\n <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.errors | hasValidationError)\">\n <ng-template [ngIf]=\"errorsLength\">\n <div class=\"errors\" *ngFor=\"let error of _errors; trackBy: trackByFn\">\n <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n <span [innerHTML]=\"error\"></span>\n </div>\n </ng-template>\n\n <ui-validation-error *ngIf=\"ngControl && !hideBuiltInErrors\" [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n </mat-hint>\n </mat-form-field>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-form-field.keyboard-focused{position:relative}.mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;top:0;border-radius:10px;left:0;width:100%;height:100%;outline:2px solid #ffffff;z-index:-1}.mat-mdc-form-field.keyboard-focused .mat-mdc-form-field-subscript-wrapper{z-index:-1}.mat-mdc-form-field.has-label .mdc-notched-outline__notch{position:relative}.mat-mdc-form-field.has-label .mdc-notched-outline__notch:after{content:\"\";position:absolute;top:0;left:0;background:#fff;width:100%;height:5px;z-index:-1}.active-field .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading{border-left-width:2px;border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch{border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-top-width:2px;border-bottom-width:2px;border-right-width:2px}.ui-field{display:block;width:320px}.ui-field.full-width{width:100%}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value){width:56px!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-floating-label{display:none!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;width:100vw!important}.ui-field .mat-mdc-form-field-subscript-wrapper{margin:0!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field:hover.mat-form-field-appearance-outline .mdc-notched-outline__notch,.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mdc-notched-outline__notch{border-top:2px solid #276678!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline__notch{border-top:1px solid var(--mdc-outlined-text-field-outline-color)!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{top:28px!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line textarea{margin-top:8px;min-height:32px!important}.ui-field .mat-mdc-form-field.textarea .mat-mdc-text-field-wrapper{height:var(--textarea-height-container)!important}.ui-field .mat-mdc-form-field.textarea textarea{max-height:var(--textarea-height)!important;min-height:var(--textarea-height)!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#276678!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#cb7b7a!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{background:#fff!important;top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-prefix,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .search-icon{padding:12px 8px 12px 16px;color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button.password{width:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container button,.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container span{width:24px!important;height:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon{background:#3c9a13;border-radius:100%}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon svg{color:#fff!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation svg circle{stroke:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation *{color:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-input-element,.ui-field .mat-mdc-form-field.mat-form-field-disabled .mdc-floating-label{pointer-events:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label{color:#e9e9e9!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading{border-top-left-radius:10px;border-bottom-left-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-top-right-radius:10px;border-bottom-right-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i5.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i8$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "applicationTheme", "useFullIconName"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ValidationErrorComponent, selector: "ui-validation-error", inputs: ["ngControl", "touchedOn", "errorMessage", "label", "applicationTheme"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[digitsOnly]", inputs: ["allowNegative", "allowDecimal", "allowOnlyDigits"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: HasValidationErrorPipe, name: "hasValidationError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
7336
7328
|
}
|
|
7337
7329
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldComponent, decorators: [{
|
|
7338
7330
|
type: Component,
|
|
7339
|
-
args: [{ selector: 'ui-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n <mat-form-field\n [ngStyle]=\"{ '--textarea-height': (textareaHeight - 10) + 'px', '--textarea-height-container': textareaHeight + 'px' }\"\n (click)=\"onFieldClick($event)\"\n #uiField\n appearance=\"outline\"\n [color]=\"(errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, textarea: type === 'textarea', 'multi-line': type === 'multi-line', 'keyboard-focused': keyboardFocused(), 'has-label': !!label }\"\n (mouseenter)=\"onActive(true, 'hover')\"\n (mouseleave)=\"onActive(false, 'hover')\"\n >\n <span [style.display]=\"'none'\" [id]=\"'ariaDescribedby'\">\n <span *ngIf=\"required\">{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n {{ ariaDescribedby }}\n </span>\n <span [style.display]=\"'none'\" [id]=\"'ariaLabelledby'\">\n {{ ariaLabelledby || label }}\n </span>\n <mat-label [id]=\"'label'\" *ngIf=\"label && ((type !== 'search' && applicationTheme === 'classic') || (applicationTheme !== 'classic'))\">{{ label }}</mat-label>\n <mat-icon *ngIf=\"type === 'search' || type === 'collapsed-search'\" matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n <input\n [readonly]=\"readOnly\"\n *ngIf=\"type !== 'textarea' && type !== 'multi-line'; else textarea\"\n matInput\n #inputElement\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled || loading\"\n [type]=\"currentType\"\n (keyup.enter)=\"onSubmit()\"\n [max]=\"max\"\n [min]=\"min\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n digitsOnly\n [allowOnlyDigits]=\"allowOnlyDigits\"\n [allowNegative]=\"allowNegative\"\n (focusin)=\"onActive(true, 'focus')\"\n />\n\n <ng-template #textarea>\n <textarea\n matInput\n #inputElement\n [readonly]=\"readOnly\"\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n (keyup.enter)=\"onSubmit()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [type]=\"currentType\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"!label ? ariaLabel : ''\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n [cdkTextareaAutosize]=\"type === 'multi-line'\"\n [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5 \"\n (focusin)=\"onActive(true, 'focus')\"\n ></textarea>\n </ng-template>\n\n <div class=\"options\" *ngIf=\"type === 'search' || type === 'password' || type === 'validation-text'\">\n <div class=\"options-container\">\n <ui-button\n *ngIf=\"showClose\"\n variant=\"secondary\"\n [justIcon]=\"true\"\n class=\"close\"\n iconName=\"Close\"\n [label]=\"(('COMMON.CLEAR') | uiTranslate | async)!\"\n (buttonClickEvent)=\"clearValue()\"\n [ariaLabel]=\"ariaLabel + '--' + (('COMMON.CLEAR') | uiTranslate | async)\"\n ></ui-button>\n <ui-button\n class=\"password\"\n variant=\"secondary\"\n [tooltip]=\"((showPassword ? ('FIELD.HIDE_PASSWORD') : ('FIELD.SHOW_PASSWORD')) | uiTranslate | async)!\"\n *ngIf=\"type === 'password'\"\n [justIcon]=\"true\"\n role=\"switch\"\n [attr.aria-checked]=\"showPassword\"\n [iconName]=\"getPasswordIcon\"\n [applicationTheme]=\"applicationTheme\"\n (click)=\"showPasswordClick()\"\n #btn\n (keydown.enter)=\"refocusPasswordButton(btn)\"\n (keydown.space)=\"refocusPasswordButton(btn)\"\n ></ui-button>\n\n <ng-container\n *ngIf=\"type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\"\n >\n <ui-button\n *ngIf=\"!isValid\"\n class=\"validation\"\n [variant]=\"'text'\"\n [applicationTheme]=\"'light'\"\n [label]=\"'Validate'\"\n [loading]=\"loading\"\n (click)=\"validate()\"\n [disabled]=\"disabled\"\n [size]=\"'small'\"\n ></ui-button>\n <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\" *ngIf=\"isValid\"></ui-icon>\n </ng-container>\n </div>\n </div>\n <mat-hint class=\"info\" *ngIf=\"type === 'textarea' && !errorsLength && !(ngControl?.errors | hasValidationError)\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n <mat-hint class=\"info\" *ngIf=\"hintMessage && !errorsLength && !(ngControl?.errors | hasValidationError) && type !== 'textarea'\">{{ hintMessage }}</mat-hint>\n <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.errors | hasValidationError)\">\n <ng-template [ngIf]=\"errorsLength\">\n <div class=\"errors\" *ngFor=\"let error of _errors; trackBy: trackByFn\">\n <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n <span [innerHTML]=\"error\"></span>\n </div>\n </ng-template>\n\n <ui-validation-error *ngIf=\"ngControl && !hideBuiltInErrors\" [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n </mat-hint>\n </mat-form-field>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-form-field.keyboard-focused{position:relative}.mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;top:0;border-radius:10px;left:0;width:100%;height:100%;outline:2px solid #ffffff;z-index:-1}.mat-mdc-form-field.keyboard-focused .mat-mdc-form-field-subscript-wrapper{z-index:-1}.mat-mdc-form-field.has-label .mdc-notched-outline__notch{position:relative}.mat-mdc-form-field.has-label .mdc-notched-outline__notch:after{content:\"\";position:absolute;top:0;left:0;background:#fff;width:100%;height:5px;z-index:-1}.active-field .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading{border-left-width:2px;border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch{border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-top-width:2px;border-bottom-width:2px;border-right-width:2px}.ui-field{display:block;width:320px}.ui-field.full-width{width:100%}.ui-field[field-class=collapsed-search]{width:56px!important;display:block}.ui-field[field-class=collapsed-search] mat-form-field{width:56px!important}.ui-field[field-class=collapsed-search] .mat-mdc-floating-label{display:none!important}.ui-field[field-class=collapsed-search] .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;width:100vw!important}.ui-field .mat-mdc-form-field-subscript-wrapper{margin:0!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field:hover.mat-form-field-appearance-outline .mdc-notched-outline__notch,.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mdc-notched-outline__notch{border-top:2px solid #276678!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline__notch{border-top:1px solid var(--mdc-outlined-text-field-outline-color)!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{top:28px!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line textarea{margin-top:8px;min-height:32px!important}.ui-field .mat-mdc-form-field.textarea .mat-mdc-text-field-wrapper{height:var(--textarea-height-container)!important}.ui-field .mat-mdc-form-field.textarea textarea{max-height:var(--textarea-height)!important;min-height:var(--textarea-height)!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#276678!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#cb7b7a!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{background:#fff!important;top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-prefix,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .search-icon{padding:12px 8px 12px 16px;color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button.password{width:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container button,.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container span{width:24px!important;height:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon{background:#3c9a13;border-radius:100%}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon svg{color:#fff!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation svg circle{stroke:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation *{color:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-input-element,.ui-field .mat-mdc-form-field.mat-form-field-disabled .mdc-floating-label{pointer-events:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label{color:#e9e9e9!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading{border-top-left-radius:10px;border-bottom-left-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-top-right-radius:10px;border-bottom-right-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}\n"] }]
|
|
7331
|
+
args: [{ selector: 'ui-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n <mat-form-field\n [ngStyle]=\"{ '--textarea-height': (textareaHeight - 10) + 'px', '--textarea-height-container': textareaHeight + 'px' }\"\n #uiField\n appearance=\"outline\"\n [color]=\"(errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, textarea: type === 'textarea', 'multi-line': type === 'multi-line', 'keyboard-focused': keyboardFocused(), 'has-label': !!label, 'has-value': !!value }\"\n (mouseenter)=\"onActive(true, 'hover')\"\n (mouseleave)=\"onActive(false, 'hover')\"\n >\n <span [style.display]=\"'none'\" [id]=\"'ariaDescribedby'\">\n <span *ngIf=\"required\">{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n {{ ariaDescribedby }}\n </span>\n <span [style.display]=\"'none'\" [id]=\"'ariaLabelledby'\">\n {{ ariaLabelledby || label }}\n </span>\n <mat-label [id]=\"'label'\" *ngIf=\"label && ((type !== 'search' && applicationTheme === 'classic') || (applicationTheme !== 'classic'))\">{{ label }}</mat-label>\n <mat-icon *ngIf=\"type === 'search' || type === 'collapsed-search'\" matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n <input\n [readonly]=\"readOnly\"\n *ngIf=\"type !== 'textarea' && type !== 'multi-line'; else textarea\"\n matInput\n #inputElement\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled || loading\"\n [type]=\"currentType\"\n (keyup.enter)=\"onSubmit()\"\n [max]=\"max\"\n [min]=\"min\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n digitsOnly\n [allowOnlyDigits]=\"allowOnlyDigits\"\n [allowNegative]=\"allowNegative\"\n (focusin)=\"onActive(true, 'focus')\"\n />\n\n <ng-template #textarea>\n <textarea\n matInput\n #inputElement\n [readonly]=\"readOnly\"\n (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n (input)=\"onInput($event)\"\n [id]=\"id!\"\n (keyup)=\"onChangeInputSearch()\"\n (keyup.enter)=\"onSubmit()\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [type]=\"currentType\"\n [name]=\"fieldName!\"\n [required]=\"required\"\n [attr.aria-label]=\"!label ? ariaLabel : ''\"\n [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched ) || hasError\"\n [attr.aria-labelledby]=\"'ariaLabelledby'\"\n [attr.aria-describedby]=\"'ariaDescribedby'\"\n role=\"textbox\"\n [cdkTextareaAutosize]=\"type === 'multi-line'\"\n [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5 \"\n (focusin)=\"onActive(true, 'focus')\"\n ></textarea>\n </ng-template>\n\n <div class=\"options\" *ngIf=\"type === 'search' || type === 'password' || type === 'validation-text'\">\n <div class=\"options-container\">\n <ui-button\n *ngIf=\"showClose\"\n variant=\"secondary\"\n [justIcon]=\"true\"\n class=\"close\"\n iconName=\"Close\"\n [label]=\"(('COMMON.CLEAR') | uiTranslate | async)!\"\n (buttonClickEvent)=\"clearValue()\"\n [ariaLabel]=\"ariaLabel + '--' + (('COMMON.CLEAR') | uiTranslate | async)\"\n ></ui-button>\n <ui-button\n class=\"password\"\n variant=\"secondary\"\n [tooltip]=\"((showPassword ? ('FIELD.HIDE_PASSWORD') : ('FIELD.SHOW_PASSWORD')) | uiTranslate | async)!\"\n *ngIf=\"type === 'password'\"\n [justIcon]=\"true\"\n role=\"switch\"\n [attr.aria-checked]=\"showPassword\"\n [iconName]=\"getPasswordIcon\"\n [applicationTheme]=\"applicationTheme\"\n (click)=\"showPasswordClick()\"\n #btn\n (keydown.enter)=\"refocusPasswordButton(btn)\"\n (keydown.space)=\"refocusPasswordButton(btn)\"\n ></ui-button>\n\n <ng-container\n *ngIf=\"type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\"\n >\n <ui-button\n *ngIf=\"!isValid\"\n class=\"validation\"\n [variant]=\"'text'\"\n [applicationTheme]=\"'light'\"\n [label]=\"'Validate'\"\n [loading]=\"loading\"\n (click)=\"validate()\"\n [disabled]=\"disabled\"\n [size]=\"'small'\"\n ></ui-button>\n <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\" *ngIf=\"isValid\"></ui-icon>\n </ng-container>\n </div>\n </div>\n <mat-hint class=\"info\" *ngIf=\"type === 'textarea' && !errorsLength && !(ngControl?.errors | hasValidationError)\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n <mat-hint class=\"info\" *ngIf=\"hintMessage && !errorsLength && !(ngControl?.errors | hasValidationError) && type !== 'textarea'\">{{ hintMessage }}</mat-hint>\n <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.errors | hasValidationError)\">\n <ng-template [ngIf]=\"errorsLength\">\n <div class=\"errors\" *ngFor=\"let error of _errors; trackBy: trackByFn\">\n <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n <span [innerHTML]=\"error\"></span>\n </div>\n </ng-template>\n\n <ui-validation-error *ngIf=\"ngControl && !hideBuiltInErrors\" [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n </mat-hint>\n </mat-form-field>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.mat-mdc-form-field.keyboard-focused{position:relative}.mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;top:0;border-radius:10px;left:0;width:100%;height:100%;outline:2px solid #ffffff;z-index:-1}.mat-mdc-form-field.keyboard-focused .mat-mdc-form-field-subscript-wrapper{z-index:-1}.mat-mdc-form-field.has-label .mdc-notched-outline__notch{position:relative}.mat-mdc-form-field.has-label .mdc-notched-outline__notch:after{content:\"\";position:absolute;top:0;left:0;background:#fff;width:100%;height:5px;z-index:-1}.active-field .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading{border-left-width:2px;border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch{border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-top-width:2px;border-bottom-width:2px;border-right-width:2px}.ui-field{display:block;width:320px}.ui-field.full-width{width:100%}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value){width:56px!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-floating-label{display:none!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;width:100vw!important}.ui-field .mat-mdc-form-field-subscript-wrapper{margin:0!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field:hover.mat-form-field-appearance-outline .mdc-notched-outline__notch,.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mdc-notched-outline__notch{border-top:2px solid #276678!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline__notch{border-top:1px solid var(--mdc-outlined-text-field-outline-color)!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{top:28px!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line textarea{margin-top:8px;min-height:32px!important}.ui-field .mat-mdc-form-field.textarea .mat-mdc-text-field-wrapper{height:var(--textarea-height-container)!important}.ui-field .mat-mdc-form-field.textarea textarea{max-height:var(--textarea-height)!important;min-height:var(--textarea-height)!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#276678!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#cb7b7a!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{background:#fff!important;top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-prefix,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .search-icon{padding:12px 8px 12px 16px;color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button.password{width:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container button,.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container span{width:24px!important;height:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon{background:#3c9a13;border-radius:100%}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon svg{color:#fff!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation svg circle{stroke:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation *{color:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-input-element,.ui-field .mat-mdc-form-field.mat-form-field-disabled .mdc-floating-label{pointer-events:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label{color:#e9e9e9!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading{border-top-left-radius:10px;border-bottom-left-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-top-right-radius:10px;border-bottom-right-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}\n"] }]
|
|
7340
7332
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
7341
7333
|
type: Optional
|
|
7342
7334
|
}, {
|
|
@@ -15988,10 +15980,10 @@ class SidePanelService {
|
|
|
15988
15980
|
this.injector = inject(EnvironmentInjector);
|
|
15989
15981
|
this.appRef = inject(ApplicationRef);
|
|
15990
15982
|
}
|
|
15991
|
-
open(content, config,
|
|
15983
|
+
open(content, config, providers = []) {
|
|
15992
15984
|
const panelConfig = { ...this.defaultSidePanelConfig, ...config };
|
|
15993
15985
|
if (!this.SidePanelComponentRef) {
|
|
15994
|
-
const injector = this.createSidePanelInjector(panelConfig,
|
|
15986
|
+
const injector = this.createSidePanelInjector(panelConfig, providers);
|
|
15995
15987
|
const SidePanelComponentRef = this.createSidePanelComponent(panelConfig.position, injector);
|
|
15996
15988
|
this.SidePanelComponentRef = SidePanelComponentRef;
|
|
15997
15989
|
}
|
|
@@ -16014,10 +16006,9 @@ class SidePanelService {
|
|
|
16014
16006
|
this.contentComponentRef = undefined;
|
|
16015
16007
|
}
|
|
16016
16008
|
}
|
|
16017
|
-
createSidePanelInjector(config,
|
|
16009
|
+
createSidePanelInjector(config, providers = []) {
|
|
16018
16010
|
return Injector.create({
|
|
16019
|
-
|
|
16020
|
-
providers: [{ provide: SidePanelConfig, useValue: config }],
|
|
16011
|
+
providers: [{ provide: SidePanelConfig, useValue: config }, ...providers],
|
|
16021
16012
|
});
|
|
16022
16013
|
}
|
|
16023
16014
|
createSidePanelComponent(position, injector) {
|