mapa-library-ui 1.0.1 → 1.1.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/fesm2022/mapa-library-ui-src-lib-components-benchmarking.mjs +6 -6
- package/fesm2022/mapa-library-ui-src-lib-components-breadcrumb.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-button-icon.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-button.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-capability.mjs +81 -73
- package/fesm2022/mapa-library-ui-src-lib-components-capability.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-chart.mjs +32 -24
- package/fesm2022/mapa-library-ui-src-lib-components-chart.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-checkbox.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker-range.mjs +394 -0
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker-range.mjs.map +1 -0
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker.mjs +215 -117
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-dialog.mjs +15 -15
- package/fesm2022/mapa-library-ui-src-lib-components-dropdown-tree.mjs +34 -24
- package/fesm2022/mapa-library-ui-src-lib-components-dropdown-tree.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-dropdown.mjs +31 -21
- package/fesm2022/mapa-library-ui-src-lib-components-dropdown.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-empty.mjs +13 -9
- package/fesm2022/mapa-library-ui-src-lib-components-empty.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-filters.mjs +44 -36
- package/fesm2022/mapa-library-ui-src-lib-components-filters.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-form.mjs +402 -49
- package/fesm2022/mapa-library-ui-src-lib-components-form.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-group-report.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-icon.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-input.mjs +26 -18
- package/fesm2022/mapa-library-ui-src-lib-components-input.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-menu.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-nav-list.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-radio-button.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-report-item.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-scale-parameterization.mjs +79 -71
- package/fesm2022/mapa-library-ui-src-lib-components-scale-parameterization.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-scale.mjs +76 -68
- package/fesm2022/mapa-library-ui-src-lib-components-scale.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-slide-toggle.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-svg-icon.mjs +9 -9
- package/fesm2022/mapa-library-ui-src-lib-components-table.mjs +81 -23
- package/fesm2022/mapa-library-ui-src-lib-components-table.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-tag.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-textarea.mjs +20 -12
- package/fesm2022/mapa-library-ui-src-lib-components-textarea.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-tooltip.mjs +6 -6
- package/fesm2022/mapa-library-ui-src-lib-components-warning.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-core-guards-authorize-guard.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-core-services.mjs +3 -3
- package/fesm2022/mapa-library-ui.mjs +428 -199
- package/fesm2022/mapa-library-ui.mjs.map +1 -1
- package/index.d.ts +102 -22
- package/mapa-library-ui-1.1.1.tgz +0 -0
- package/package.json +9 -1
- package/src/lib/components/capability/index.d.ts +8 -0
- package/src/lib/components/chart/index.d.ts +4 -0
- package/src/lib/components/datepicker/index.d.ts +136 -99
- package/src/lib/components/datepicker-range/index.d.ts +255 -0
- package/src/lib/components/dropdown/index.d.ts +8 -0
- package/src/lib/components/dropdown-tree/index.d.ts +4 -0
- package/src/lib/components/empty/index.d.ts +2 -2
- package/src/lib/components/filters/index.d.ts +8 -0
- package/src/lib/components/form/index.d.ts +4 -0
- package/src/lib/components/input/index.d.ts +4 -0
- package/src/lib/components/radio-button/index.d.ts +4 -0
- package/src/lib/components/scale/index.d.ts +4 -0
- package/src/lib/components/scale-parameterization/index.d.ts +4 -0
- package/src/lib/components/slide-toggle/index.d.ts +4 -0
- package/src/lib/components/table/index.d.ts +23 -2
- package/src/lib/components/textarea/index.d.ts +4 -0
- package/mapa-library-ui-1.0.1.tgz +0 -0
|
@@ -28,10 +28,10 @@ class ButtonComponent {
|
|
|
28
28
|
onClick() {
|
|
29
29
|
this.clicked.emit();
|
|
30
30
|
}
|
|
31
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
32
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
31
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
32
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: ButtonComponent, isStandalone: true, selector: "mapa-button", inputs: { color: "color", disabled: "disabled" }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n class=\"mapa-button\"\n (click)=\"onClick()\"\n [class.primary]=\"color === 'primary'\"\n [class.accent]=\"color === 'accent'\"\n [class.basic]=\"color === 'basic'\"\n [disabled]=\"disabled\"\n>\n <ng-content></ng-content>\n</button> ", styles: [".mapa-button{display:flex;padding:14px 42px;justify-content:center;align-items:center;gap:10px;border-radius:28px;border:none;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-weight:500;cursor:pointer;transform-origin:center;transition:transform .2s ease-in-out}.mapa-button:active{transform:scale(1.1)}.mapa-button:disabled{color:#dcdcde!important;background-color:transparent!important}.mapa-button.basic{color:#ea561d;background-color:transparent}.mapa-button.accent{border:2px solid #ea561d!important;color:#ea561d;background-color:#fff}.mapa-button.primary{background-color:#ea561d;color:#fff}\n"] }); }
|
|
33
33
|
}
|
|
34
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
35
35
|
type: Component,
|
|
36
36
|
args: [{ selector: 'mapa-button', standalone: true, template: "<button\n class=\"mapa-button\"\n (click)=\"onClick()\"\n [class.primary]=\"color === 'primary'\"\n [class.accent]=\"color === 'accent'\"\n [class.basic]=\"color === 'basic'\"\n [disabled]=\"disabled\"\n>\n <ng-content></ng-content>\n</button> ", styles: [".mapa-button{display:flex;padding:14px 42px;justify-content:center;align-items:center;gap:10px;border-radius:28px;border:none;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-weight:500;cursor:pointer;transform-origin:center;transition:transform .2s ease-in-out}.mapa-button:active{transform:scale(1.1)}.mapa-button:disabled{color:#dcdcde!important;background-color:transparent!important}.mapa-button.basic{color:#ea561d;background-color:transparent}.mapa-button.accent{border:2px solid #ea561d!important;color:#ea561d;background-color:#fff}.mapa-button.primary{background-color:#ea561d;color:#fff}\n"] }]
|
|
37
37
|
}], propDecorators: { color: [{
|
|
@@ -98,6 +98,10 @@ const MAPA_UI_DEFAULT_TEXTS = {
|
|
|
98
98
|
return `Mostrando ${startIndex + 1} - ${endIndex} de ${length} ${itemLabel}`;
|
|
99
99
|
},
|
|
100
100
|
},
|
|
101
|
+
table: {
|
|
102
|
+
emptyTitle: "Nao foram encontrados resultados",
|
|
103
|
+
emptySubtitle: "",
|
|
104
|
+
},
|
|
101
105
|
validation: {
|
|
102
106
|
cnpj: "CNPJ inválido",
|
|
103
107
|
cpf: "CPF inválido",
|
|
@@ -132,6 +136,10 @@ function mergeMapaUiTexts(customTexts) {
|
|
|
132
136
|
...MAPA_UI_DEFAULT_TEXTS.paginator,
|
|
133
137
|
...(customTexts?.paginator ?? {}),
|
|
134
138
|
},
|
|
139
|
+
table: {
|
|
140
|
+
...MAPA_UI_DEFAULT_TEXTS.table,
|
|
141
|
+
...(customTexts?.table ?? {}),
|
|
142
|
+
},
|
|
135
143
|
validation: {
|
|
136
144
|
...MAPA_UI_DEFAULT_TEXTS.validation,
|
|
137
145
|
...(customTexts?.validation ?? {}),
|
|
@@ -167,10 +175,10 @@ class MapaI18nService {
|
|
|
167
175
|
resolveText(value, context) {
|
|
168
176
|
return typeof value === "function" ? value(context) : value;
|
|
169
177
|
}
|
|
170
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
171
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
178
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaI18nService, deps: [{ token: MAPA_UI_TEXTS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
179
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaI18nService, providedIn: "root" }); }
|
|
172
180
|
}
|
|
173
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
181
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaI18nService, decorators: [{
|
|
174
182
|
type: Injectable,
|
|
175
183
|
args: [{
|
|
176
184
|
providedIn: "root",
|
|
@@ -241,10 +249,10 @@ class ValidationMessageResolverService {
|
|
|
241
249
|
return errors[errorKey];
|
|
242
250
|
}
|
|
243
251
|
}
|
|
244
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
245
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
252
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ValidationMessageResolverService, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
253
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ValidationMessageResolverService, providedIn: "root" }); }
|
|
246
254
|
}
|
|
247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
255
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ValidationMessageResolverService, decorators: [{
|
|
248
256
|
type: Injectable,
|
|
249
257
|
args: [{
|
|
250
258
|
providedIn: "root",
|
|
@@ -258,10 +266,10 @@ class MapaFormErrorsComponent {
|
|
|
258
266
|
get message() {
|
|
259
267
|
return this.validationMessageResolver.resolveFirstError(this.control, this.errors);
|
|
260
268
|
}
|
|
261
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
262
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
269
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaFormErrorsComponent, deps: [{ token: ValidationMessageResolverService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
270
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaFormErrorsComponent, isStandalone: true, selector: "mapa-form-errors", inputs: { control: "control", errors: "errors" }, ngImport: i0, template: "<span *ngIf=\"message\">\n {{ message }}\n</span>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatFormFieldModule }] }); }
|
|
263
271
|
}
|
|
264
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaFormErrorsComponent, decorators: [{
|
|
265
273
|
type: Component,
|
|
266
274
|
args: [{ selector: "mapa-form-errors", imports: [CommonModule, MatFormFieldModule], template: "<span *ngIf=\"message\">\n {{ message }}\n</span>\n" }]
|
|
267
275
|
}], ctorParameters: () => [{ type: ValidationMessageResolverService }], propDecorators: { control: [{
|
|
@@ -280,10 +288,10 @@ class HtmlSanitizerService {
|
|
|
280
288
|
sanitize(value) {
|
|
281
289
|
return sanitizeHtmlContent(this.sanitizer, value);
|
|
282
290
|
}
|
|
283
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
284
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
291
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlSanitizerService, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
292
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlSanitizerService, providedIn: "root" }); }
|
|
285
293
|
}
|
|
286
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
294
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlSanitizerService, decorators: [{
|
|
287
295
|
type: Injectable,
|
|
288
296
|
args: [{
|
|
289
297
|
providedIn: "root",
|
|
@@ -297,10 +305,10 @@ class SafeHtmlPipe {
|
|
|
297
305
|
transform(value) {
|
|
298
306
|
return this.htmlSanitizer.sanitize(value);
|
|
299
307
|
}
|
|
300
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
301
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.
|
|
308
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: HtmlSanitizerService }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
309
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: SafeHtmlPipe, isStandalone: true, name: "safeHtml" }); }
|
|
302
310
|
}
|
|
303
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
311
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: SafeHtmlPipe, decorators: [{
|
|
304
312
|
type: Pipe,
|
|
305
313
|
args: [{
|
|
306
314
|
name: "safeHtml",
|
|
@@ -453,8 +461,8 @@ class MapaDropdownComponent {
|
|
|
453
461
|
this.formControl.setValue(null);
|
|
454
462
|
this.cdr.markForCheck();
|
|
455
463
|
}
|
|
456
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
457
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
464
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaDropdownComponent, deps: [{ token: MapaI18nService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
465
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: MapaDropdownComponent, isStandalone: true, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, outputs: { openedChange: "openedChange" }, providers: [
|
|
458
466
|
{
|
|
459
467
|
provide: MAT_SELECT_CONFIG,
|
|
460
468
|
useValue: { overlayPanelClass: "mapa-overlay-dropdown" },
|
|
@@ -465,7 +473,7 @@ class MapaDropdownComponent {
|
|
|
465
473
|
},
|
|
466
474
|
], viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "@if (element) {\n @if (element.label) {\n <label class=\"mapa-dropdown__label\">\n {{ element.label }}\n </label>\n }\n <div class=\"mapa-form--inline\">\n <mat-form-field\n appearance=\"outline\"\n class=\"mapa-dropdown\"\n [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n [class.mapa-dropdown--tag]=\"border === 'tag'\"\n [class.mapa-dropdown--labeled]=\"!!element.label\"\n >\n <mat-select\n #dropdown\n ngDefaultControl\n [formControl]=\"formControl\"\n [multiple]=\"element.multiple\"\n [placeholder]=\"element.placeholder || ''\"\n [compareWith]=\"compareFn\"\n (openedChange)=\"triggerOpenedChange($event)\"\n >\n @if (element.search) {\n <mat-option class=\"mapa-dropdown__search\">\n @if (element.search.formControl) {\n <ngx-mat-select-search\n [showToggleAllCheckbox]=\"element.search.toggleAllCheckbox!\"\n [formControl]=\"element.search.formControl\"\n [placeholderLabel]=\"element.search.placeholder || ''\"\n i18n-placeholderLabel\n [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n ></ngx-mat-select-search>\n }\n </mat-option>\n }\n @if (element.multiple) {\n <mat-option class=\"mapa-dropdown__option--select-all\">\n <mat-checkbox\n class=\"mat-option\"\n [indeterminate]=\"isIndeterminate\"\n [checked]=\"isChecked\"\n (click)=\"$event.stopPropagation()\"\n (change)=\"toggleSelectAll($event)\"\n >\n {{ selectAllLabel }}\n </mat-checkbox>\n </mat-option>\n }\n @if (isOptionsGroup) {\n @if (filteredGroups | async; as groups) {\n @for (group of groups; track group.label) {\n <mat-optgroup [label]=\"group.label\">\n @for (option of group.options; track option.key) {\n <mat-option\n [value]=\"option\"\n [ngClass]=\"[\n 'mapa-dropdown__option--children-level-' + option.childrenLevel,\n ]\"\n >\n <span [innerHTML]=\"option.value | safeHtml\"></span>\n </mat-option>\n }\n </mat-optgroup>\n }\n }\n } @else {\n @if (filteredOptions | async; as options) {\n @for (option of options; track option.key) {\n <mat-option\n [value]=\"option\"\n [ngClass]=\"[\n 'mapa-dropdown__option mapa-dropdown__option--children-level-' +\n option.childrenLevel,\n ]\"\n >\n <span\n class=\"mapa-dropdown__option-value\"\n [innerHTML]=\"option.value | safeHtml\"\n ></span>\n </mat-option>\n }\n }\n }\n\n @for (option of selectedOptions; track option.key) {\n <mat-option\n hidden\n [value]=\"option\"\n [ngClass]=\"[\n 'mapa-dropdown__option--children-level-' + option.childrenLevel,\n ]\"\n >\n <span [innerHTML]=\"option.value | safeHtml\"></span>\n </mat-option>\n }\n </mat-select>\n @if (element.hint) {\n <mat-hint>{{ element.hint }}</mat-hint>\n }\n <mat-error>\n <mapa-form-errors\n [control]=\"formControl\"\n [errors]=\"element.errors\"\n ></mapa-form-errors>\n </mat-error>\n @if (hasValue() && !formControl.disabled && element.clearValue) {\n <mat-icon\n (click)=\"clearValue($event)\"\n class=\"mapa-input--close\"\n >close</mat-icon\n >\n }\n </mat-form-field>\n @if (element.actionButton) {\n <div class=\"mapa-form--action\">\n <mapa-button\n color=\"basic\"\n (click)=\"element.actionButton.action.emit(true)\"\n >\n {{ element.actionButton.label }}\n </mapa-button>\n </div>\n }\n </div>\n}\n", styles: [":host ::ng-deep .mapa-dropdown{max-width:min-content;min-width:235px}:host ::ng-deep .mapa-dropdown .mat-mdc-select{font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif)!important}:host ::ng-deep .mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center;position:absolute;right:28px!important;top:18px!important;z-index:1}:host ::ng-deep .mapa-dropdown__label{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}:host ::ng-deep .mapa-dropdown--highlight .mat-mdc-text-field-wrapper{border-radius:16px}:host ::ng-deep .mapa-dropdown--highlight .mdc-notched-outline{border-radius:16px!important}:host ::ng-deep .mapa-dropdown--highlight .mdc-notched-outline .mdc-notched-outline__leading,:host ::ng-deep .mapa-dropdown--highlight .mdc-notched-outline .mdc-notched-outline__trailing{border-width:2px!important;border-color:#eedb2a!important}:host ::ng-deep .mapa-dropdown--highlight .mdc-notched-outline .mdc-notched-outline__leading{display:none!important}:host ::ng-deep .mapa-dropdown--highlight .mdc-notched-outline .mdc-notched-outline__trailing{border-radius:16px!important;border-left-style:solid!important}:host ::ng-deep .mapa-dropdown--soft-border .mdc-notched-outline .mdc-notched-outline__leading,:host ::ng-deep .mapa-dropdown--soft-border .mdc-notched-outline .mdc-notched-outline__trailing{border-width:1px!important}:host ::ng-deep .mapa-dropdown--tag .mat-mdc-text-field-wrapper{border-radius:16px}:host ::ng-deep .mapa-dropdown--tag .mdc-notched-outline{border-radius:16px!important;height:42px!important}:host ::ng-deep .mapa-dropdown--tag .mdc-notched-outline .mdc-notched-outline__leading,:host ::ng-deep .mapa-dropdown--tag .mdc-notched-outline .mdc-notched-outline__trailing{border-width:1px!important;border-color:#cdcdcd}:host ::ng-deep .mapa-dropdown--tag .mdc-notched-outline .mdc-notched-outline__leading{display:none!important}:host ::ng-deep .mapa-dropdown--tag .mdc-notched-outline .mdc-notched-outline__trailing{border-radius:16px!important;border-left-style:solid!important}:host ::ng-deep .mapa-dropdown .mat-mdc-text-field-wrapper{background-color:#fff;border-radius:8px}:host ::ng-deep .mapa-dropdown .mat-mdc-text-field-wrapper.mdc-text-field--outlined{padding-left:unset!important;padding-right:unset!important}:host ::ng-deep .mapa-dropdown .mdc-notched-outline{background-color:transparent;border-radius:8px;pointer-events:none;z-index:0}:host ::ng-deep .mapa-dropdown .mdc-notched-outline .mdc-notched-outline__leading,:host ::ng-deep .mapa-dropdown .mdc-notched-outline .mdc-notched-outline__trailing{border-width:2px}:host ::ng-deep .mapa-dropdown .mat-mdc-form-field-flex{display:flex;align-items:center;height:48px;position:relative}:host ::ng-deep .mapa-dropdown .mat-mdc-select-trigger{min-width:50px;padding-top:unset!important;height:unset!important;position:relative;z-index:1}:host ::ng-deep .mapa-dropdown .mat-mdc-select-value-text{display:block;width:90%}:host ::ng-deep .mapa-dropdown .mat-mdc-select-arrow-wrapper{transform:none!important;align-items:center;position:relative;z-index:1}:host ::ng-deep .mapa-dropdown .mat-mdc-select-arrow{border:unset;color:#50575e}:host ::ng-deep .mapa-dropdown .mat-mdc-select-arrow:before,:host ::ng-deep .mapa-dropdown .mat-mdc-select-arrow:after{content:none!important}:host ::ng-deep .mapa-dropdown .mat-mdc-select-arrow svg{display:block!important;fill:currentColor}:host ::ng-deep .mapa-dropdown .mat-mdc-form-field-subscript-wrapper{padding:0!important}:host ::ng-deep .mapa-dropdown [aria-expanded=true] .mat-mdc-select-arrow{margin:0}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mdc-list-item__primary-text{font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif)!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--select-all,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[class*=mapa-dropdown__option--children-level-]{height:auto!important;align-items:start!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option .mat-pseudo-checkbox,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--select-all .mat-pseudo-checkbox,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[class*=mapa-dropdown__option--children-level-] .mat-pseudo-checkbox{margin:7px 7px 7px 0!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option .mdc-list-item__primary-text,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--select-all .mdc-list-item__primary-text,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[class*=mapa-dropdown__option--children-level-] .mdc-list-item__primary-text{height:auto!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mapa-dropdown__option-value{text-wrap:auto}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--children-level-1{padding-left:30px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--children-level-2{padding-left:50px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--children-level-3{padding-left:70px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--children-level-4{padding-left:90px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--children-level-5{padding-left:100px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--children-level-6{padding-left:120px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--select-all{padding-left:5px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option.mapa-dropdown__option--select-all .mat-pseudo-checkbox{display:none!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search{align-items:flex-start;background:#f6f7f7;height:auto!important;min-height:80px;padding:16px 8px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mdc-list-item__primary-text{width:100%}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-inner{background:transparent!important;background-color:transparent!important;border:unset;border-radius:0;box-shadow:none!important;inset:0 auto auto 0;overflow:visible;position:relative;width:100%!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-inner-row{align-items:center;background:transparent;display:flex;position:relative}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-hidden{background:transparent!important;background-color:transparent!important;border:unset!important;height:0!important;line-height:0!important;padding:0!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-toggle-all-checkbox{padding-left:8px!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-input{background-color:#fff!important;border:2px solid #a7aaad!important;border-radius:8px!important;height:28px!important;line-height:24px!important;padding:0 48px 0 12px!important;width:100%}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-input::placeholder{color:#c3c4c7!important}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-select-search-clear{top:50%;transform:translateY(-50%)}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-divider{margin:0}::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search.mat-mdc-option-active,::ng-deep .mapa-overlay-dropdown .mat-mdc-select-panel .mat-mdc-option[aria-disabled=true].contains-mat-select-search:hover{background:#f6f7f7}::ng-deep .mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}::ng-deep .mapa-overlay-dropdown .mdc-checkbox__background{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i5.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i7.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "ngmodule", type: NgxMatSelectSearchModule }, { kind: "component", type: i8.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti", "recreateValuesArray"], outputs: ["toggleAll"] }, { kind: "component", type: ButtonComponent, selector: "mapa-button", inputs: ["color", "disabled"], outputs: ["clicked"] }, { kind: "component", type: MapaFormErrorsComponent, selector: "mapa-form-errors", inputs: ["control", "errors"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
467
475
|
}
|
|
468
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
476
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaDropdownComponent, decorators: [{
|
|
469
477
|
type: Component,
|
|
470
478
|
args: [{ selector: "mapa-dropdown", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
471
479
|
CommonModule,
|
|
@@ -519,10 +527,10 @@ class IconComponent {
|
|
|
519
527
|
registerCustomIcons(svg) {
|
|
520
528
|
this.matIconRegistry.addSvgIcon(svg, this.domSanitizer.bypassSecurityTrustResourceUrl(`../../../../assets/${svg}.svg`));
|
|
521
529
|
}
|
|
522
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
523
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
530
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IconComponent, deps: [{ token: i1$2.MatIconRegistry }, { token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
531
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: IconComponent, isStandalone: true, selector: "mapa-icon", inputs: { svg: "svg" }, usesOnChanges: true, ngImport: i0, template: "<mat-icon *ngIf=\"svg\" [svgIcon]=\"svg\"></mat-icon>\n<mat-icon *ngIf=\"!svg\"><ng-content></ng-content></mat-icon>\n", styles: [".mat-icon{color:#f5704b}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
524
532
|
}
|
|
525
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
533
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IconComponent, decorators: [{
|
|
526
534
|
type: Component,
|
|
527
535
|
args: [{ selector: 'mapa-icon', standalone: true, imports: [CommonModule, MatIconModule], template: "<mat-icon *ngIf=\"svg\" [svgIcon]=\"svg\"></mat-icon>\n<mat-icon *ngIf=\"!svg\"><ng-content></ng-content></mat-icon>\n", styles: [".mat-icon{color:#f5704b}\n"] }]
|
|
528
536
|
}], ctorParameters: () => [{ type: i1$2.MatIconRegistry }, { type: i1$1.DomSanitizer }], propDecorators: { svg: [{
|
|
@@ -557,10 +565,10 @@ class MapaTooltipComponent {
|
|
|
557
565
|
this.left = 0;
|
|
558
566
|
this.top = 0;
|
|
559
567
|
}
|
|
560
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
561
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
568
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
569
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaTooltipComponent, isStandalone: true, selector: "lib-tooltip", ngImport: i0, template: "<div\n class=\"tooltip\"\n [ngClass]=\"['tooltip--'+position, 'tooltip--'+theme]\"\n [class.tooltip--visible]=\"visible\"\n [style.left]=\"left + 'px'\"\n [style.top]=\"top + 'px'\"\n>\n <ng-template [ngTemplateOutlet]=\"tooltip\"></ng-template>\n</div>\n", styles: [".tooltip{position:fixed;background-color:#000;border-radius:8px;color:#fff;font-family:Arial;padding:3px 6px;font-size:13px;opacity:0;z-index:999;box-shadow:#0000000d 0 6px 24px,#00000014 0 0 0 1px}.tooltip :before,.tooltip :after{content:\"\";display:block;position:absolute;bottom:100%;width:1px;height:0}.tooltip :before{left:49%;border:8px solid transparent;border-bottom-color:#ddd}.tooltip :after{left:49.6%;border:7px solid transparent;border-bottom-color:#fff}.tooltip--visible{opacity:1;transition:opacity .3s}.tooltip--light{background-color:#fff;color:#000}.tooltip--dark{background-color:#000;color:#fff}.tooltip--below{transform:translate(-50%);margin-top:7px}.tooltip--below:before{border-left-color:transparent;border-right-color:transparent;border-top:none;left:calc(50% - 5px);top:-5px}.tooltip--above{transform:translate(-50%,-100%);margin-bottom:7px}.tooltip--above:before{border-left-color:transparent;border-right-color:transparent;border-bottom:none;left:calc(50% - 5px);bottom:-5px}.tooltip--left{transform:translate(calc(-100% - 7px),-50%)}.tooltip--left:before{border-top-color:transparent;border-bottom-color:transparent;border-right:none;right:-5px;top:calc(50% - 5px)}.tooltip--right{transform:translateY(-50%);margin-left:7px}.tooltip--right:before{border-top-color:transparent;border-bottom-color:transparent;border-left:none;left:-5px;top:calc(50% - 5px)}.tooltip--dynamic{margin-left:20px}.tooltip--dynamic:before{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
562
570
|
}
|
|
563
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
571
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaTooltipComponent, decorators: [{
|
|
564
572
|
type: Component,
|
|
565
573
|
args: [{ selector: "lib-tooltip", imports: [CommonModule], standalone: true, template: "<div\n class=\"tooltip\"\n [ngClass]=\"['tooltip--'+position, 'tooltip--'+theme]\"\n [class.tooltip--visible]=\"visible\"\n [style.left]=\"left + 'px'\"\n [style.top]=\"top + 'px'\"\n>\n <ng-template [ngTemplateOutlet]=\"tooltip\"></ng-template>\n</div>\n", styles: [".tooltip{position:fixed;background-color:#000;border-radius:8px;color:#fff;font-family:Arial;padding:3px 6px;font-size:13px;opacity:0;z-index:999;box-shadow:#0000000d 0 6px 24px,#00000014 0 0 0 1px}.tooltip :before,.tooltip :after{content:\"\";display:block;position:absolute;bottom:100%;width:1px;height:0}.tooltip :before{left:49%;border:8px solid transparent;border-bottom-color:#ddd}.tooltip :after{left:49.6%;border:7px solid transparent;border-bottom-color:#fff}.tooltip--visible{opacity:1;transition:opacity .3s}.tooltip--light{background-color:#fff;color:#000}.tooltip--dark{background-color:#000;color:#fff}.tooltip--below{transform:translate(-50%);margin-top:7px}.tooltip--below:before{border-left-color:transparent;border-right-color:transparent;border-top:none;left:calc(50% - 5px);top:-5px}.tooltip--above{transform:translate(-50%,-100%);margin-bottom:7px}.tooltip--above:before{border-left-color:transparent;border-right-color:transparent;border-bottom:none;left:calc(50% - 5px);bottom:-5px}.tooltip--left{transform:translate(calc(-100% - 7px),-50%)}.tooltip--left:before{border-top-color:transparent;border-bottom-color:transparent;border-right:none;right:-5px;top:calc(50% - 5px)}.tooltip--right{transform:translateY(-50%);margin-left:7px}.tooltip--right:before{border-top-color:transparent;border-bottom-color:transparent;border-left:none;left:-5px;top:calc(50% - 5px)}.tooltip--dynamic{margin-left:20px}.tooltip--dynamic:before{display:none}\n"] }]
|
|
566
574
|
}] });
|
|
@@ -664,10 +672,10 @@ class MapaTooltipDirective {
|
|
|
664
672
|
this.componentRef = null;
|
|
665
673
|
}
|
|
666
674
|
}
|
|
667
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
668
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
675
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaTooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
676
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: MapaTooltipDirective, isStandalone: true, selector: "[tooltip]", inputs: { tooltip: "tooltip", position: "position", theme: "theme", showDelay: "showDelay", hideDelay: "hideDelay" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "mousemove": "onMouseMove($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd()" } }, ngImport: i0 }); }
|
|
669
677
|
}
|
|
670
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
678
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaTooltipDirective, decorators: [{
|
|
671
679
|
type: Directive,
|
|
672
680
|
args: [{
|
|
673
681
|
selector: "[tooltip]",
|
|
@@ -857,18 +865,18 @@ class CapabilityClassificationService {
|
|
|
857
865
|
getByItem(item) {
|
|
858
866
|
return (CAPABILITY_CLASSIFICATION.find((classification) => classification.id === item.classificationId) || CAPABILITY_CLASSIFICATION[0]);
|
|
859
867
|
}
|
|
860
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
861
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
868
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CapabilityClassificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
869
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CapabilityClassificationService }); }
|
|
862
870
|
}
|
|
863
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
871
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CapabilityClassificationService, decorators: [{
|
|
864
872
|
type: Injectable
|
|
865
873
|
}] });
|
|
866
874
|
|
|
867
875
|
class TagComponent {
|
|
868
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
869
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
876
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
877
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: TagComponent, isStandalone: true, selector: "mapa-tag", inputs: { tag: "tag" }, ngImport: i0, template: "<div\n *ngIf=\"tag\"\n class=\"mapa-tag\"\n [class.mapa-tag--small]=\"tag.size === 'small' && !tag.fontSize\"\n [class.mapa-tag--highlight]=\"tag.color === 'highlight'\"\n [class.mapa-tag--selected]=\"tag.color === 'selected'\"\n [class.mapa-tag--default-bg]=\"!tag.bgColor\"\n [class.mapa-tag--bg]=\"tag.bgColor\"\n [style.backgroundColor]=\"tag.bgColor\"\n [style.padding-left]=\"tag.fontSize\"\n [style.border-radius]=\"tag.fontSize\"\n [style.fontSize]=\"tag.fontSize\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".mapa-tag{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);display:flex;align-items:center;border-radius:16px;padding:8px 12px;margin:0 4px;white-space:nowrap}.mapa-tag--default-bg{border:1px solid #cdcdcd;background:#fff;font-weight:300}.mapa-tag--bg{font-weight:500!important;text-transform:uppercase;padding:4px 8px!important;height:24px!important;color:#181818;font-size:12px}.mapa-tag--highlight{border:2px solid #eedb2a!important}.mapa-tag--small{gap:8px;padding:2px 8px!important;font-size:12px}.mapa-tag--selected{padding:8px 16px!important;gap:16px;border-radius:8px!important;border:1px solid #d9d9d9!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
870
878
|
}
|
|
871
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
879
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TagComponent, decorators: [{
|
|
872
880
|
type: Component,
|
|
873
881
|
args: [{ selector: "mapa-tag", standalone: true, imports: [CommonModule], template: "<div\n *ngIf=\"tag\"\n class=\"mapa-tag\"\n [class.mapa-tag--small]=\"tag.size === 'small' && !tag.fontSize\"\n [class.mapa-tag--highlight]=\"tag.color === 'highlight'\"\n [class.mapa-tag--selected]=\"tag.color === 'selected'\"\n [class.mapa-tag--default-bg]=\"!tag.bgColor\"\n [class.mapa-tag--bg]=\"tag.bgColor\"\n [style.backgroundColor]=\"tag.bgColor\"\n [style.padding-left]=\"tag.fontSize\"\n [style.border-radius]=\"tag.fontSize\"\n [style.fontSize]=\"tag.fontSize\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".mapa-tag{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);display:flex;align-items:center;border-radius:16px;padding:8px 12px;margin:0 4px;white-space:nowrap}.mapa-tag--default-bg{border:1px solid #cdcdcd;background:#fff;font-weight:300}.mapa-tag--bg{font-weight:500!important;text-transform:uppercase;padding:4px 8px!important;height:24px!important;color:#181818;font-size:12px}.mapa-tag--highlight{border:2px solid #eedb2a!important}.mapa-tag--small{gap:8px;padding:2px 8px!important;font-size:12px}.mapa-tag--selected{padding:8px 16px!important;gap:16px;border-radius:8px!important;border:1px solid #d9d9d9!important}\n"] }]
|
|
874
882
|
}], propDecorators: { tag: [{
|
|
@@ -888,10 +896,10 @@ class MapaCapabilityDotComponent {
|
|
|
888
896
|
size: "small",
|
|
889
897
|
};
|
|
890
898
|
}
|
|
891
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
892
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
899
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityDotComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
900
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityDotComponent, isStandalone: true, selector: "mapa-capability-dot", inputs: { type: "type", item: "item", tooltip: "tooltip", capability: "capability" }, providers: [CapabilityClassificationService], ngImport: i0, template: "<p\n *ngIf=\"!tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [style.backgroundColor]=\"item.classificationColor\"\n></p>\n<div *ngIf=\"tooltip\" [tooltip]=\"tooltipTemplate\" class=\"tooltip-dot\">\n <p\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [style.backgroundColor]=\"item.classificationColor\"\n ></p>\n</div>\n<ng-template #tooltipTemplate>\n <div class=\"tooltip-info\">\n <strong\n class=\"tooltip-info--direction\"\n *ngIf=\"!item.direction\"\n >\u2198\uFE0E</strong\n >\n <strong\n class=\"tooltip-info--direction\"\n *ngIf=\"item.direction\"\n >\u2197</strong\n >\n\n <h5>{{ item.name }}</h5>\n\n <mapa-tag [tag]=\"createTag()\">\n <p\n class=\"small-dot\"\n [style.backgroundColor]=\"item.classificationColor\"\n ></p>\n {{ item.classificationName }}\n </mapa-tag>\n </div>\n</ng-template>\n", styles: [".tooltip-info{display:flex;align-items:center}.tooltip-info strong{margin-right:2px}.tooltip-info h5{margin:0 5px 0 0;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:14px;font-style:normal;font-weight:600}.tooltip-info--title{color:#50575e;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:14px;font-style:normal;font-weight:600}.tooltip-info--direction{padding-right:6px;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:12px;font-style:normal;font-weight:600}.tooltip-info mapa-tag{color:#000}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TagComponent, selector: "mapa-tag", inputs: ["tag"] }, { kind: "directive", type: MapaTooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "position", "theme", "showDelay", "hideDelay"] }] }); }
|
|
893
901
|
}
|
|
894
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
902
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityDotComponent, decorators: [{
|
|
895
903
|
type: Component,
|
|
896
904
|
args: [{ selector: "mapa-capability-dot", imports: [CommonModule, TagComponent, MapaTooltipDirective], providers: [CapabilityClassificationService], standalone: true, template: "<p\n *ngIf=\"!tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [style.backgroundColor]=\"item.classificationColor\"\n></p>\n<div *ngIf=\"tooltip\" [tooltip]=\"tooltipTemplate\" class=\"tooltip-dot\">\n <p\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [style.backgroundColor]=\"item.classificationColor\"\n ></p>\n</div>\n<ng-template #tooltipTemplate>\n <div class=\"tooltip-info\">\n <strong\n class=\"tooltip-info--direction\"\n *ngIf=\"!item.direction\"\n >\u2198\uFE0E</strong\n >\n <strong\n class=\"tooltip-info--direction\"\n *ngIf=\"item.direction\"\n >\u2197</strong\n >\n\n <h5>{{ item.name }}</h5>\n\n <mapa-tag [tag]=\"createTag()\">\n <p\n class=\"small-dot\"\n [style.backgroundColor]=\"item.classificationColor\"\n ></p>\n {{ item.classificationName }}\n </mapa-tag>\n </div>\n</ng-template>\n", styles: [".tooltip-info{display:flex;align-items:center}.tooltip-info strong{margin-right:2px}.tooltip-info h5{margin:0 5px 0 0;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:14px;font-style:normal;font-weight:600}.tooltip-info--title{color:#50575e;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:14px;font-style:normal;font-weight:600}.tooltip-info--direction{padding-right:6px;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:12px;font-style:normal;font-weight:600}.tooltip-info mapa-tag{color:#000}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
897
905
|
}], ctorParameters: () => [{ type: CapabilityClassificationService }], propDecorators: { type: [{
|
|
@@ -931,21 +939,21 @@ class MapaCapabilityExpandComponent {
|
|
|
931
939
|
size: "small",
|
|
932
940
|
};
|
|
933
941
|
}
|
|
934
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
935
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
942
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityExpandComponent, deps: [{ token: CapabilityClassificationService }, { token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
943
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityExpandComponent, isStandalone: true, selector: "mapa-capability-expand", inputs: { data: "data" }, providers: [CapabilityClassificationService], ngImport: i0, template: "<div\n class=\"capability__concept\"\n *ngIf=\"data.capabilityConcept?.concept || data.capabilityConcept?.result\"\n>\n <div\n class=\"capability__concept--content\"\n *ngIf=\"data.capabilityConcept?.concept\"\n >\n <div class=\"capability__concept--title\">{{ conceptTitle }}</div>\n <div class=\"capability__concept--text\">\n {{ data.capabilityConcept?.concept! }}\n </div>\n </div>\n <div\n class=\"capability__concept--content\"\n *ngIf=\"data.capabilityConcept?.result\"\n >\n <div class=\"capability__concept--title\">{{ resultTitle }}</div>\n <div class=\"capability__concept--text\">\n {{ data.capabilityConcept?.result! }}\n </div>\n </div>\n</div>\n<div class=\"capability__expanded\">\n <div *ngFor=\"let item of data.items\" class=\"capability__expanded--item\">\n <div class=\"name\">\n <div class=\"capability__expanded--name\">\n <span *ngIf=\"item.classificationColor\">\n <strong *ngIf=\"!classification.getByItem(item).positive\">↘ </strong>\n <strong *ngIf=\"classification.getByItem(item).positive\">↗ </strong>\n </span>\n {{ item.name }}\n </div>\n <mapa-tag\n [tag]=\"createTag(item)\"\n class=\"capability__expanded--tag\"\n *ngIf=\"item.classificationId\"\n >\n <mapa-capability-dot\n [item]=\"item\"\n *ngIf=\"item.classificationColor\"\n ></mapa-capability-dot>\n {{ item.classificationName }}\n </mapa-tag>\n </div>\n\n <p class=\"capability__expanded--description\" *ngIf=\"item.description\">\n <strong\n *ngIf=\"item.classificationId && !item.classificationBg && !classification.getByItem(item).positive\"\n >{{ negativeDirectionLabel }}</strong>\n <strong\n *ngIf=\"item.classificationId && !item.classificationBg && classification.getByItem(item).positive\"\n >{{ positiveDirectionLabel }}</strong>\n <span [innerHTML]=\"item.description | safeHtml\"></span>\n </p>\n </div>\n</div>\n\n\n\n", styles: [":host ::ng-deep .capability__concept{display:flex;flex-direction:row;flex-wrap:wrap;width:100%;gap:42px;margin:24px 0 60px}:host ::ng-deep .capability__concept--content{display:flex;flex-direction:column;flex-basis:100%;flex:1}:host ::ng-deep .capability__concept--title{color:#000;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:600;line-height:24px;margin-bottom:8px}:host ::ng-deep .capability__concept--text{color:#676767;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400;line-height:24px}:host ::ng-deep .capability__expanded{border-top:1px solid #cdcdcd;padding:36px 0 16px 16px;gap:30px}@media(min-width:800px)and (max-width:1250px){:host ::ng-deep .capability__expanded{display:grid;grid-template-columns:1fr 1fr}}@media(min-width:1251px){:host ::ng-deep .capability__expanded{display:grid;grid-template-columns:1fr 1fr 1fr}}:host ::ng-deep .capability__expanded--description{color:#8c8f94;font-size:16px;font-style:normal;font-weight:400;line-height:24px}:host ::ng-deep .capability__expanded--item .name{display:flex;justify-content:space-between;margin-bottom:16px}:host ::ng-deep .capability__expanded--item mapa-tag .mapa-tag--small{display:flex;align-items:center;gap:8px;padding:2px 8px 2px 3px;font-size:14px;font-style:normal;font-weight:400;height:18px}:host ::ng-deep .capability__expanded--name{color:#181818;font-size:20px;font-style:normal;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TagComponent, selector: "mapa-tag", inputs: ["tag"] }, { kind: "component", type: MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: ["type", "item", "tooltip", "capability"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }] }); }
|
|
936
944
|
}
|
|
937
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
945
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityExpandComponent, decorators: [{
|
|
938
946
|
type: Component,
|
|
939
|
-
args: [{ selector: "mapa-capability-expand", imports: [CommonModule, TagComponent, MapaCapabilityDotComponent, SafeHtmlPipe], providers: [CapabilityClassificationService], standalone: true, template: "<div\n class=\"capability__concept\"\n *ngIf=\"data.capabilityConcept?.concept || data.capabilityConcept?.result\"\n>\n <div\n class=\"capability__concept--content\"\n *ngIf=\"data.capabilityConcept?.concept\"\n >\n <div class=\"capability__concept--title\">{{ conceptTitle }}</div>\n <div class=\"capability__concept--text\">\n {{ data.capabilityConcept?.concept! }}\n </div>\n </div>\n <div\n class=\"capability__concept--content\"\n *ngIf=\"data.capabilityConcept?.result\"\n >\n <div class=\"capability__concept--title\">{{ resultTitle }}</div>\n <div class=\"capability__concept--text\">\n {{ data.capabilityConcept?.result! }}\n </div>\n </div>\n</div>\n<div class=\"capability__expanded\">\n <div *ngFor=\"let item of data.items\" class=\"capability__expanded--item\">\n <div class=\"name\">\n <div class=\"capability__expanded--name\">\n <span *ngIf=\"item.classificationColor\">\n <strong *ngIf=\"!classification.getByItem(item).positive\">↘ </strong>\n <strong *ngIf=\"classification.getByItem(item).positive\">↗ </strong>\n </span>\n {{ item.name }}\n </div>\n <mapa-tag\n [tag]=\"createTag(item)\"\n class=\"capability__expanded--tag\"\n *ngIf=\"item.classificationId\"\n >\n <mapa-capability-dot\n [item]=\"item\"\n *ngIf=\"item.classificationColor\"\n ></mapa-capability-dot>\n {{ item.classificationName }}\n </mapa-tag>\n </div>\n\n <p class=\"capability__expanded--description\" *ngIf=\"item.description\">\n <strong\n *ngIf=\"item.classificationId && !item.classificationBg && !classification.getByItem(item).positive\"\n >{{ negativeDirectionLabel }}</strong>\n <strong\n *ngIf=\"item.classificationId && !item.classificationBg && classification.getByItem(item).positive\"\n >{{ positiveDirectionLabel }}</strong>\n <span [innerHTML]=\"item.description | safeHtml\"></span>\n </p>\n </div>\n</div>\n\n\n\n", styles: [":host ::ng-deep .capability__concept{display:flex;flex-direction:row;flex-wrap:wrap;width:100%;gap:42px;margin:24px 0 60px}:host ::ng-deep .capability__concept--content{display:flex;flex-direction:column;flex-basis:100%;flex:1}:host ::ng-deep .capability__concept--title{color:#000;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:600;line-height:24px;margin-bottom:8px}:host ::ng-deep .capability__concept--text{color:#676767;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400;line-height:24px}:host ::ng-deep .capability__expanded{border-top:1px solid #cdcdcd;padding:36px 0 16px 16px;gap:30px}@media
|
|
947
|
+
args: [{ selector: "mapa-capability-expand", imports: [CommonModule, TagComponent, MapaCapabilityDotComponent, SafeHtmlPipe], providers: [CapabilityClassificationService], standalone: true, template: "<div\n class=\"capability__concept\"\n *ngIf=\"data.capabilityConcept?.concept || data.capabilityConcept?.result\"\n>\n <div\n class=\"capability__concept--content\"\n *ngIf=\"data.capabilityConcept?.concept\"\n >\n <div class=\"capability__concept--title\">{{ conceptTitle }}</div>\n <div class=\"capability__concept--text\">\n {{ data.capabilityConcept?.concept! }}\n </div>\n </div>\n <div\n class=\"capability__concept--content\"\n *ngIf=\"data.capabilityConcept?.result\"\n >\n <div class=\"capability__concept--title\">{{ resultTitle }}</div>\n <div class=\"capability__concept--text\">\n {{ data.capabilityConcept?.result! }}\n </div>\n </div>\n</div>\n<div class=\"capability__expanded\">\n <div *ngFor=\"let item of data.items\" class=\"capability__expanded--item\">\n <div class=\"name\">\n <div class=\"capability__expanded--name\">\n <span *ngIf=\"item.classificationColor\">\n <strong *ngIf=\"!classification.getByItem(item).positive\">↘ </strong>\n <strong *ngIf=\"classification.getByItem(item).positive\">↗ </strong>\n </span>\n {{ item.name }}\n </div>\n <mapa-tag\n [tag]=\"createTag(item)\"\n class=\"capability__expanded--tag\"\n *ngIf=\"item.classificationId\"\n >\n <mapa-capability-dot\n [item]=\"item\"\n *ngIf=\"item.classificationColor\"\n ></mapa-capability-dot>\n {{ item.classificationName }}\n </mapa-tag>\n </div>\n\n <p class=\"capability__expanded--description\" *ngIf=\"item.description\">\n <strong\n *ngIf=\"item.classificationId && !item.classificationBg && !classification.getByItem(item).positive\"\n >{{ negativeDirectionLabel }}</strong>\n <strong\n *ngIf=\"item.classificationId && !item.classificationBg && classification.getByItem(item).positive\"\n >{{ positiveDirectionLabel }}</strong>\n <span [innerHTML]=\"item.description | safeHtml\"></span>\n </p>\n </div>\n</div>\n\n\n\n", styles: [":host ::ng-deep .capability__concept{display:flex;flex-direction:row;flex-wrap:wrap;width:100%;gap:42px;margin:24px 0 60px}:host ::ng-deep .capability__concept--content{display:flex;flex-direction:column;flex-basis:100%;flex:1}:host ::ng-deep .capability__concept--title{color:#000;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:600;line-height:24px;margin-bottom:8px}:host ::ng-deep .capability__concept--text{color:#676767;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400;line-height:24px}:host ::ng-deep .capability__expanded{border-top:1px solid #cdcdcd;padding:36px 0 16px 16px;gap:30px}@media(min-width:800px)and (max-width:1250px){:host ::ng-deep .capability__expanded{display:grid;grid-template-columns:1fr 1fr}}@media(min-width:1251px){:host ::ng-deep .capability__expanded{display:grid;grid-template-columns:1fr 1fr 1fr}}:host ::ng-deep .capability__expanded--description{color:#8c8f94;font-size:16px;font-style:normal;font-weight:400;line-height:24px}:host ::ng-deep .capability__expanded--item .name{display:flex;justify-content:space-between;margin-bottom:16px}:host ::ng-deep .capability__expanded--item mapa-tag .mapa-tag--small{display:flex;align-items:center;gap:8px;padding:2px 8px 2px 3px;font-size:14px;font-style:normal;font-weight:400;height:18px}:host ::ng-deep .capability__expanded--name{color:#181818;font-size:20px;font-style:normal;font-weight:400}\n"] }]
|
|
940
948
|
}], ctorParameters: () => [{ type: CapabilityClassificationService }, { type: MapaI18nService }], propDecorators: { data: [{
|
|
941
949
|
type: Input
|
|
942
950
|
}] } });
|
|
943
951
|
|
|
944
952
|
class MapaCapabilityIndicatorComponent {
|
|
945
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
946
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
953
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
954
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityIndicatorComponent, isStandalone: true, selector: "mapa-capability-indicator", inputs: { item: "item" }, ngImport: i0, template: "<div\n class=\"indicator\"\n [style.backgroundColor]=\"item.classificationColor\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\">\n {{ item.interval }}%\n </div>\n</div>\n", styles: [".indicator{margin:3px 0}.indicator__classification{background-color:#fff;border-radius:16px;color:#000;padding:4px 8px;margin-right:4px;font-size:12px!important}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
947
955
|
}
|
|
948
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
956
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIndicatorComponent, decorators: [{
|
|
949
957
|
type: Component,
|
|
950
958
|
args: [{ selector: "mapa-capability-indicator", imports: [CommonModule], standalone: true, template: "<div\n class=\"indicator\"\n [style.backgroundColor]=\"item.classificationColor\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\">\n {{ item.interval }}%\n </div>\n</div>\n", styles: [".indicator{margin:3px 0}.indicator__classification{background-color:#fff;border-radius:16px;color:#000;padding:4px 8px;margin-right:4px;font-size:12px!important}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
951
959
|
}], propDecorators: { item: [{
|
|
@@ -1017,10 +1025,10 @@ class MapaCapabilityIntervalComponent {
|
|
|
1017
1025
|
isSVG() {
|
|
1018
1026
|
return !!this.data.classificationBg && this.data.classificationBg === "SVG";
|
|
1019
1027
|
}
|
|
1020
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1021
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1028
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIntervalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1029
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityIntervalComponent, isStandalone: true, selector: "mapa-capability-interval", inputs: { data: "data", showInterval: "showInterval" }, usesOnChanges: true, ngImport: i0, template: "<ul class=\"capability__interval\" *ngIf=\"isSVG(); else progressBar\">\n <li\n class=\"capability__interval--item\"\n *ngFor=\"let block of SVG; let i = index\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"30\"\n fill=\"none\"\n [class]=\"'svg_' + i + '_' + getWidth(i)\"\n >\n <defs *ngIf=\"hasTransform && i === indexTransform\">\n <linearGradient [attr.id]=\"paintLinear\" gradientUnits=\"userSpaceOnUse\">\n <stop [attr.offset]=\"getStartOffset()\" stop-color=\"#8C8F94\" />\n <stop [attr.offset]=\"getStopOffset()\" stop-color=\"#D9D9D9\" />\n </linearGradient>\n </defs>\n <rect\n rx=\"6\"\n x=\"0\"\n y=\"0.710938\"\n [attr.width]=\"SVG[i].width\"\n [attr.height]=\"SVG[i].height\"\n [attr.fill]=\"getFill(i)\"\n />\n <rect\n *ngIf=\"hasTransform && i === indexTransform\"\n rx=\"6\"\n x=\"0\"\n y=\"0.710938\"\n [attr.width]=\"SVG[i].width\"\n [attr.height]=\"SVG[i].height\"\n [attr.fill]=\"getFillGradient()\"\n />\n </svg>\n </li>\n <li class=\"capability__interval--interval\" *ngIf=\"showInterval\">\n {{ data.interval }}%\n </li>\n</ul>\n<ng-template #progressBar>\n <div class=\"capability__progress-bar\">\n <div class=\"capability__progress-bar--bg\">\n <div\n class=\"capability__progress-bar--filled\"\n [style.width.%]=\"data.interval\"\n ></div>\n </div>\n <div class=\"capability__interval--result\" *ngIf=\"showInterval\">\n {{data.interval}}%\n </div>\n </div>\n</ng-template>\n", styles: [".capability__interval{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:38px;font-style:normal;font-weight:500;display:flex;align-items:center;list-style-type:none;margin-block-start:0px;margin-block-end:0px;padding-inline-start:0px}.capability__interval--interval{display:flex;align-items:flex-start;justify-content:flex-end;text-align:right;font-size:24px;font-style:normal;font-weight:500;height:36px;padding-left:16px;width:68px}.capability__interval--item{border-radius:6px;margin-right:2px;width:18px;height:34px;position:relative}.capability__interval--item:last-of-type{margin-right:0}.capability__interval--percentage{background-color:#d9d9d9;height:34.57px}.capability__progress-bar{display:flex;align-items:center;justify-content:space-between;color:#2e2a2a;font-size:18px;font-style:normal;font-weight:400;width:310px}.capability__progress-bar--bg{position:relative;background-color:#eee;border-radius:6px;height:8px;width:247px}.capability__progress-bar--filled{position:absolute;top:0;left:0;background-color:#ea561d;border-radius:6px;height:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
1022
1030
|
}
|
|
1023
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1031
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIntervalComponent, decorators: [{
|
|
1024
1032
|
type: Component,
|
|
1025
1033
|
args: [{ selector: "mapa-capability-interval", imports: [CommonModule], standalone: true, template: "<ul class=\"capability__interval\" *ngIf=\"isSVG(); else progressBar\">\n <li\n class=\"capability__interval--item\"\n *ngFor=\"let block of SVG; let i = index\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"30\"\n fill=\"none\"\n [class]=\"'svg_' + i + '_' + getWidth(i)\"\n >\n <defs *ngIf=\"hasTransform && i === indexTransform\">\n <linearGradient [attr.id]=\"paintLinear\" gradientUnits=\"userSpaceOnUse\">\n <stop [attr.offset]=\"getStartOffset()\" stop-color=\"#8C8F94\" />\n <stop [attr.offset]=\"getStopOffset()\" stop-color=\"#D9D9D9\" />\n </linearGradient>\n </defs>\n <rect\n rx=\"6\"\n x=\"0\"\n y=\"0.710938\"\n [attr.width]=\"SVG[i].width\"\n [attr.height]=\"SVG[i].height\"\n [attr.fill]=\"getFill(i)\"\n />\n <rect\n *ngIf=\"hasTransform && i === indexTransform\"\n rx=\"6\"\n x=\"0\"\n y=\"0.710938\"\n [attr.width]=\"SVG[i].width\"\n [attr.height]=\"SVG[i].height\"\n [attr.fill]=\"getFillGradient()\"\n />\n </svg>\n </li>\n <li class=\"capability__interval--interval\" *ngIf=\"showInterval\">\n {{ data.interval }}%\n </li>\n</ul>\n<ng-template #progressBar>\n <div class=\"capability__progress-bar\">\n <div class=\"capability__progress-bar--bg\">\n <div\n class=\"capability__progress-bar--filled\"\n [style.width.%]=\"data.interval\"\n ></div>\n </div>\n <div class=\"capability__interval--result\" *ngIf=\"showInterval\">\n {{data.interval}}%\n </div>\n </div>\n</ng-template>\n", styles: [".capability__interval{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:38px;font-style:normal;font-weight:500;display:flex;align-items:center;list-style-type:none;margin-block-start:0px;margin-block-end:0px;padding-inline-start:0px}.capability__interval--interval{display:flex;align-items:flex-start;justify-content:flex-end;text-align:right;font-size:24px;font-style:normal;font-weight:500;height:36px;padding-left:16px;width:68px}.capability__interval--item{border-radius:6px;margin-right:2px;width:18px;height:34px;position:relative}.capability__interval--item:last-of-type{margin-right:0}.capability__interval--percentage{background-color:#d9d9d9;height:34.57px}.capability__progress-bar{display:flex;align-items:center;justify-content:space-between;color:#2e2a2a;font-size:18px;font-style:normal;font-weight:400;width:310px}.capability__progress-bar--bg{position:relative;background-color:#eee;border-radius:6px;height:8px;width:247px}.capability__progress-bar--filled{position:absolute;top:0;left:0;background-color:#ea561d;border-radius:6px;height:8px}\n"] }]
|
|
1026
1034
|
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
@@ -1038,10 +1046,10 @@ class MapaCapabilityIntervalBarComponent {
|
|
|
1038
1046
|
isSVG() {
|
|
1039
1047
|
return !!this.data.classificationBg && this.data.classificationBg === "SVG";
|
|
1040
1048
|
}
|
|
1041
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1042
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1049
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIntervalBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1050
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityIntervalBarComponent, isStandalone: true, selector: "mapa-capability-interval-bar", inputs: { data: "data", expanded: "expanded", showInterval: "showInterval" }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<section reusable-outlet class=\"capability-interval\">\n <section [class.capability-interval__bar]=\"isSVG()\">\n <mapa-capability-interval\n [data]=\"data\"\n [showInterval]=\"showInterval\"\n ></mapa-capability-interval>\n </section>\n</section>\n", styles: [".capability-interval{display:flex;align-items:center;position:relative;height:72px;margin-right:16px}.capability-interval__bar{display:flex;align-items:center;justify-content:center;max-height:72px;height:100%}.capability-interval__show-more{display:flex;align-items:center;justify-content:flex-end;max-height:72px;height:100%;width:100%}.capability-interval__show-more mapa-button,.capability-interval__show-more button{width:100%;justify-content:flex-end!important}.capability-interval--hide{opacity:0;max-height:0}.capability-interval--hide>*{opacity:0;max-height:0}.capability-interval--show{opacity:1;max-height:72px}:host ::ng-deep .capability-interval__show-more mapa-button,:host ::ng-deep .capability-interval__show-more button{width:100%;justify-content:flex-end!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MapaCapabilityIntervalComponent, selector: "mapa-capability-interval", inputs: ["data", "showInterval"] }] }); }
|
|
1043
1051
|
}
|
|
1044
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1052
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIntervalBarComponent, decorators: [{
|
|
1045
1053
|
type: Component,
|
|
1046
1054
|
args: [{ selector: "mapa-capability-interval-bar", imports: [CommonModule, MapaCapabilityIntervalComponent], standalone: true, template: "<section reusable-outlet class=\"capability-interval\">\n <section [class.capability-interval__bar]=\"isSVG()\">\n <mapa-capability-interval\n [data]=\"data\"\n [showInterval]=\"showInterval\"\n ></mapa-capability-interval>\n </section>\n</section>\n", styles: [".capability-interval{display:flex;align-items:center;position:relative;height:72px;margin-right:16px}.capability-interval__bar{display:flex;align-items:center;justify-content:center;max-height:72px;height:100%}.capability-interval__show-more{display:flex;align-items:center;justify-content:flex-end;max-height:72px;height:100%;width:100%}.capability-interval__show-more mapa-button,.capability-interval__show-more button{width:100%;justify-content:flex-end!important}.capability-interval--hide{opacity:0;max-height:0}.capability-interval--hide>*{opacity:0;max-height:0}.capability-interval--show{opacity:1;max-height:72px}:host ::ng-deep .capability-interval__show-more mapa-button,:host ::ng-deep .capability-interval__show-more button{width:100%;justify-content:flex-end!important}\n"] }]
|
|
1047
1055
|
}], propDecorators: { data: [{
|
|
@@ -1058,10 +1066,10 @@ class MapaCapabilityComparativeIndicatorComponent {
|
|
|
1058
1066
|
getWidth(item) {
|
|
1059
1067
|
return 32 + (item.interval || 0) * 2 + "px";
|
|
1060
1068
|
}
|
|
1061
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1062
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1069
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1070
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityComparativeIndicatorComponent, isStandalone: true, selector: "mapa-capability-comparative-indicator", inputs: { item: "item", fullWidth: "fullWidth" }, ngImport: i0, template: "<div\n class=\"comparative-indicator\"\n [style.width]=\"fullWidth ? '100%' : getWidth(item)\"\n>\n <div class=\"comparative-indicator__interval\">\n {{ item.interval }}%\n <span\n *ngIf=\"item.isIndividually\"\n class=\"comparative-indicator__individually\"\n >\u25BC</span\n >\n </div>\n <div\n class=\"comparative-indicator__classification\"\n [style.backgroundColor]=\"item.classificationColor\"\n *ngIf=\"item.classificationColor\"\n ></div>\n</div>\n", styles: [".comparative-indicator{display:flex;flex-direction:column}.comparative-indicator__interval{font-size:12px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);text-align:center;width:100%;display:flex;justify-content:center;align-items:center;min-width:40px}.comparative-indicator__classification{border-radius:16px;padding:2px 4px;height:24px}.comparative-indicator__individually{color:#ea561d;margin:0 4px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
1063
1071
|
}
|
|
1064
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1072
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeIndicatorComponent, decorators: [{
|
|
1065
1073
|
type: Component,
|
|
1066
1074
|
args: [{ selector: "mapa-capability-comparative-indicator", imports: [CommonModule], standalone: true, template: "<div\n class=\"comparative-indicator\"\n [style.width]=\"fullWidth ? '100%' : getWidth(item)\"\n>\n <div class=\"comparative-indicator__interval\">\n {{ item.interval }}%\n <span\n *ngIf=\"item.isIndividually\"\n class=\"comparative-indicator__individually\"\n >\u25BC</span\n >\n </div>\n <div\n class=\"comparative-indicator__classification\"\n [style.backgroundColor]=\"item.classificationColor\"\n *ngIf=\"item.classificationColor\"\n ></div>\n</div>\n", styles: [".comparative-indicator{display:flex;flex-direction:column}.comparative-indicator__interval{font-size:12px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);text-align:center;width:100%;display:flex;justify-content:center;align-items:center;min-width:40px}.comparative-indicator__classification{border-radius:16px;padding:2px 4px;height:24px}.comparative-indicator__individually{color:#ea561d;margin:0 4px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
1067
1075
|
}], propDecorators: { item: [{
|
|
@@ -1080,10 +1088,10 @@ class MapaCapabilityComparativeChartComponent {
|
|
|
1080
1088
|
isIndividually: item.isIndividually,
|
|
1081
1089
|
};
|
|
1082
1090
|
}
|
|
1083
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1084
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1091
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1092
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityComparativeChartComponent, isStandalone: true, selector: "mapa-capability-comparative-chart", inputs: { data: "data" }, ngImport: i0, template: "<table class=\"capability-comparative__chart\">\n <tr *ngFor=\"let indicator of data.indicators\">\n <th>\n <p>{{ indicator.name }}</p>\n </th>\n <td class=\"capability-comparative__chart--indicators\">\n <mapa-capability-comparative-indicator\n *ngFor=\"let item of indicator.items\"\n [item]=\"setCleanItem(item)\"\n [fullWidth]=\"true\"\n [style.width.%]=\"item.interval\"\n ></mapa-capability-comparative-indicator>\n </td>\n </tr>\n</table>\n", styles: [".capability-comparative{background-color:#fff}.capability-comparative__chart{width:100%}.capability-comparative__chart tr{border-bottom:1px solid #DCDCDE;display:flex;padding:16px 0;justify-content:space-between;align-items:center}.capability-comparative__chart th{vertical-align:bottom;text-align:left;padding-right:36px;width:20%}.capability-comparative__chart th p{font-size:14px;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);margin:6px 0!important;font-weight:500}.capability-comparative__chart--indicators{display:flex;justify-content:center;align-items:center;height:40px;position:relative;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MapaCapabilityComparativeIndicatorComponent, selector: "mapa-capability-comparative-indicator", inputs: ["item", "fullWidth"] }] }); }
|
|
1085
1093
|
}
|
|
1086
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1094
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeChartComponent, decorators: [{
|
|
1087
1095
|
type: Component,
|
|
1088
1096
|
args: [{ selector: 'mapa-capability-comparative-chart', imports: [CommonModule, MapaCapabilityComparativeIndicatorComponent], standalone: true, template: "<table class=\"capability-comparative__chart\">\n <tr *ngFor=\"let indicator of data.indicators\">\n <th>\n <p>{{ indicator.name }}</p>\n </th>\n <td class=\"capability-comparative__chart--indicators\">\n <mapa-capability-comparative-indicator\n *ngFor=\"let item of indicator.items\"\n [item]=\"setCleanItem(item)\"\n [fullWidth]=\"true\"\n [style.width.%]=\"item.interval\"\n ></mapa-capability-comparative-indicator>\n </td>\n </tr>\n</table>\n", styles: [".capability-comparative{background-color:#fff}.capability-comparative__chart{width:100%}.capability-comparative__chart tr{border-bottom:1px solid #DCDCDE;display:flex;padding:16px 0;justify-content:space-between;align-items:center}.capability-comparative__chart th{vertical-align:bottom;text-align:left;padding-right:36px;width:20%}.capability-comparative__chart th p{font-size:14px;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);margin:6px 0!important;font-weight:500}.capability-comparative__chart--indicators{display:flex;justify-content:center;align-items:center;height:40px;position:relative;width:100%}\n"] }]
|
|
1089
1097
|
}], propDecorators: { data: [{
|
|
@@ -1109,10 +1117,10 @@ class MapaCapabilityComparativeHeaderComponent {
|
|
|
1109
1117
|
items: [],
|
|
1110
1118
|
};
|
|
1111
1119
|
}
|
|
1112
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1113
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1120
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeHeaderComponent, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1121
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityComparativeHeaderComponent, isStandalone: true, selector: "mapa-capability-comparative-header", inputs: { data: "data" }, ngImport: i0, template: "<section class=\"capability-comparative__header\">\n <h1>{{ data.name }}</h1>\n\n <section>\n <div class=\"capability-comparative__avg\">\n <div class=\"capability-comparative__avg--title\">{{ groupAverageTitle }}</div>\n <mapa-capability-interval\n [data]=\"getCapabilityData(data.groupAvg)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval>\n </div>\n <div class=\"capability-comparative__avg\">\n <div class=\"capability-comparative__avg--title\">{{ individualAverageTitle }}</div>\n <mapa-capability-interval\n [data]=\"getCapabilityData(data.individualAvg)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval>\n </div>\n </section>\n</section>\n\n\n", styles: [".capability-comparative__header{display:flex;align-items:center;justify-content:space-between;width:100%}.capability-comparative__header h1{color:var(--GlobalColors-Neutral-100, #000);font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400;line-height:40px}.capability-comparative__avg{border-radius:16px;border:1px solid #cdcdcd;padding:10px 16px;margin:24px 0;position:relative}.capability-comparative__avg--title{background-color:#fff;padding:0 2px;position:absolute;top:-8px;color:#8c8f94;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:12px;font-style:normal;font-weight:500;line-height:16px;text-transform:uppercase}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MapaCapabilityIntervalComponent, selector: "mapa-capability-interval", inputs: ["data", "showInterval"] }] }); }
|
|
1114
1122
|
}
|
|
1115
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1123
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeHeaderComponent, decorators: [{
|
|
1116
1124
|
type: Component,
|
|
1117
1125
|
args: [{ selector: 'mapa-capability-comparative-header', imports: [CommonModule, MapaCapabilityIntervalComponent], standalone: true, template: "<section class=\"capability-comparative__header\">\n <h1>{{ data.name }}</h1>\n\n <section>\n <div class=\"capability-comparative__avg\">\n <div class=\"capability-comparative__avg--title\">{{ groupAverageTitle }}</div>\n <mapa-capability-interval\n [data]=\"getCapabilityData(data.groupAvg)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval>\n </div>\n <div class=\"capability-comparative__avg\">\n <div class=\"capability-comparative__avg--title\">{{ individualAverageTitle }}</div>\n <mapa-capability-interval\n [data]=\"getCapabilityData(data.individualAvg)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval>\n </div>\n </section>\n</section>\n\n\n", styles: [".capability-comparative__header{display:flex;align-items:center;justify-content:space-between;width:100%}.capability-comparative__header h1{color:var(--GlobalColors-Neutral-100, #000);font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400;line-height:40px}.capability-comparative__avg{border-radius:16px;border:1px solid #cdcdcd;padding:10px 16px;margin:24px 0;position:relative}.capability-comparative__avg--title{background-color:#fff;padding:0 2px;position:absolute;top:-8px;color:#8c8f94;font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:12px;font-style:normal;font-weight:500;line-height:16px;text-transform:uppercase}\n"] }]
|
|
1118
1126
|
}], ctorParameters: () => [{ type: MapaI18nService }], propDecorators: { data: [{
|
|
@@ -1120,10 +1128,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
1120
1128
|
}] } });
|
|
1121
1129
|
|
|
1122
1130
|
class MapaCapabilityComparativeComponent {
|
|
1123
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1124
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1131
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1132
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityComparativeComponent, isStandalone: true, selector: "mapa-capability-comparative", inputs: { data: "data" }, ngImport: i0, template: "<section class=\"capability-comparative\">\n <mapa-capability-comparative-header\n [data]=\"data\"\n ></mapa-capability-comparative-header>\n <mapa-capability-comparative-chart\n [data]=\"data\"\n ></mapa-capability-comparative-chart>\n</section>\n", styles: [".capability-comparative{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;margin:auto}.capability-comparative__header{align-items:flex-start!important;flex-direction:column!important}.capability-comparative__header section{display:flex;gap:24px}\n"], dependencies: [{ kind: "component", type: MapaCapabilityComparativeChartComponent, selector: "mapa-capability-comparative-chart", inputs: ["data"] }, { kind: "component", type: MapaCapabilityComparativeHeaderComponent, selector: "mapa-capability-comparative-header", inputs: ["data"] }] }); }
|
|
1125
1133
|
}
|
|
1126
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1134
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityComparativeComponent, decorators: [{
|
|
1127
1135
|
type: Component,
|
|
1128
1136
|
args: [{ selector: "mapa-capability-comparative", imports: [
|
|
1129
1137
|
MapaCapabilityComparativeChartComponent,
|
|
@@ -1190,10 +1198,10 @@ class MapaCapabilityDetailComponent {
|
|
|
1190
1198
|
isSVG(item) {
|
|
1191
1199
|
return !!item.classificationBg && item.classificationBg === "SVG";
|
|
1192
1200
|
}
|
|
1193
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1194
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
1201
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityDetailComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1202
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: MapaCapabilityDetailComponent, isStandalone: true, selector: "mapa-capability-detail", inputs: { data: "data", showTags: "showTags", showProgressBar: "showProgressBar", showInterval: "showInterval", isExpanded: "isExpanded" }, providers: [CapabilityClassificationService], viewQueries: [{ propertyName: "accordion", first: true, predicate: ["detailAccordion"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-accordion class=\"capability-detail\" #detailAccordion=\"matAccordion\" multi>\n @for (capability of data; track capability; let i = $index) {\n <mat-expansion-panel [expanded]=\"expanded.has(i)\">\n <mat-expansion-panel-header>\n <div class=\"capability__item--header\">\n <div class=\"capability__item--title-dots\">\n <div class=\"capability__item--title display-L\">\n {{ capability.name }}\n @if (showTags) {\n <span class=\"capability__item--title-tag\">\n <mapa-tag [tag]=\"createTag(capability)\">\n @if (capability.classificationColor) {\n <mapa-capability-dot\n [item]=\"capability\"\n [capability]=\"capability\"\n ></mapa-capability-dot>\n }\n {{ capability.classificationName }}\n </mapa-tag>\n </span>\n }\n </div>\n\n @if (isSVG(capability)) {\n <div class=\"capability__item--dots\">\n @for (item of sortItemsByinterval(capability.items); track item) {\n <mapa-capability-dot\n type=\"small\"\n [item]=\"item\"\n [capability]=\"capability\"\n [tooltip]=\"true\"\n ></mapa-capability-dot>\n }\n </div>\n }\n </div>\n\n <div [class.capability__item--interval]=\"showProgressBar\">\n <mapa-capability-interval-bar\n [data]=\"capability\"\n [expanded]=\"expanded.has(i)\"\n [showInterval]=\"showInterval\"\n (clicked)=\"showMore(i)\"\n ></mapa-capability-interval-bar>\n </div>\n </div>\n </mat-expansion-panel-header>\n <mapa-capability-expand [data]=\"capability\"></mapa-capability-expand>\n </mat-expansion-panel>\n }\n</mat-accordion>\n", styles: [":host ::ng-deep .capability-detail .mat-expansion-panel{border-radius:0!important}:host ::ng-deep .capability-detail .mat-expansion-panel-spacing{margin:unset!important}:host ::ng-deep .capability-detail .mat-expansion-panel:last-of-type{border-bottom-right-radius:16px!important;border-bottom-left-radius:16px!important}:host ::ng-deep .capability-detail .mat-expansion-panel:first-of-type{border-top-right-radius:16px!important;border-top-left-radius:16px!important}:host ::ng-deep .capability-detail .mat-expansion-panel-header{height:unset!important;padding:16px 24px!important}:host ::ng-deep .capability{border-radius:16px}:host ::ng-deep .capability h1{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400;line-height:40px}:host ::ng-deep .capability__core{border:1px solid #DCDCDE;border-radius:16px;background-color:#fff}:host ::ng-deep .capability__item{padding:24px;position:relative}:host ::ng-deep .capability__item:hover{box-shadow:0 4px 4px #00000021}:host ::ng-deep .capability__item:not(:only-child){border-bottom:1px solid #dcdcde}:host ::ng-deep .capability__item:first-child{border-radius:16px 16px 0 0}:host ::ng-deep .capability__item:last-child{border-bottom:unset;border-radius:0 0 16px 16px}:host ::ng-deep .capability__item--hide{opacity:0;max-height:0;height:0}:host ::ng-deep .capability__item--hide>*{display:none!important;opacity:0!important;max-height:0!important;height:0!important;margin:0!important;padding:0!important;flex:0}:host ::ng-deep .capability__item--show{opacity:1;max-height:100%;height:100%}:host ::ng-deep .capability__item--header{display:flex;align-items:center;justify-content:space-between;height:75px;width:98%}:host ::ng-deep .capability__item--title{display:flex;align-items:center;white-space:nowrap}:host ::ng-deep .capability__item--title-tag{margin-left:34px}:host ::ng-deep .capability__item--title-dots{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:72px}:host ::ng-deep .capability__item--title-dots .display-L{margin-bottom:10px}:host ::ng-deep .capability__item--dots{display:flex}:host ::ng-deep .capability__item--dots mapa-capability-dot .tooltip-dot{padding:8px 8px 8px 0}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: TagComponent, selector: "mapa-tag", inputs: ["tag"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "component", type: MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: ["type", "item", "tooltip", "capability"] }, { kind: "component", type: MapaCapabilityIntervalBarComponent, selector: "mapa-capability-interval-bar", inputs: ["data", "expanded", "showInterval"], outputs: ["clicked"] }, { kind: "component", type: MapaCapabilityExpandComponent, selector: "mapa-capability-expand", inputs: ["data"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1195
1203
|
}
|
|
1196
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1204
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityDetailComponent, decorators: [{
|
|
1197
1205
|
type: Component,
|
|
1198
1206
|
args: [{ selector: "mapa-capability-detail", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
1199
1207
|
CommonModule,
|
|
@@ -1258,10 +1266,10 @@ class MapaCapabilityIndicatorListComponent {
|
|
|
1258
1266
|
this.dataRiskPrecipitation = this.data.filter((item) => item.risk === true && item.precipitation === true);
|
|
1259
1267
|
this.dataRiskNegligence = this.data.filter((item) => item.risk === true && item.negligence === true);
|
|
1260
1268
|
}
|
|
1261
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1262
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1269
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIndicatorListComponent, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1270
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityIndicatorListComponent, isStandalone: true, selector: "mapa-capability-indicator-list", inputs: { data: "data" }, usesOnChanges: true, ngImport: i0, template: "<section class=\"indicator-list\">\n <article class=\"indicator-list__column\">\n <h2>{{ positiveIndicatorsTitle }}</h2>\n <mapa-capability-indicator *ngFor=\"let item of dataPositive\" [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>{{ negativeIndicatorsTitle }}</h2>\n <mapa-capability-indicator *ngFor=\"let item of dataNegative\" [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article\n class=\"indicator-list__column\"\n *ngIf=\"dataRiskPrecipitation.length > 0 || dataRiskNegligence.length > 0\"\n >\n <h2>{{ riskIndicatorsTitle }}</h2>\n <div *ngIf=\"dataRiskPrecipitation.length > 0\">\n <h3>{{ precipitationRiskTitle }}</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskPrecipitation\"\n [item]=\"item\"\n >\n </mapa-capability-indicator>\n </div>\n <div *ngIf=\"dataRiskNegligence.length > 0\">\n <h3>{{ negligenceRiskTitle }}</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskNegligence\"\n [item]=\"item\"\n >\n </mapa-capability-indicator>\n </div>\n </article>\n</section>\n\n", styles: [".indicator-list{display:flex;gap:42px;justify-content:space-between;margin-bottom:42px}.indicator-list__column{width:33%}.indicator-list__column h2{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}.indicator-list__column h3{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: ["item"] }] }); }
|
|
1263
1271
|
}
|
|
1264
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIndicatorListComponent, decorators: [{
|
|
1265
1273
|
type: Component,
|
|
1266
1274
|
args: [{ selector: "mapa-capability-indicator-list", imports: [CommonModule, MapaCapabilityIndicatorComponent], standalone: true, template: "<section class=\"indicator-list\">\n <article class=\"indicator-list__column\">\n <h2>{{ positiveIndicatorsTitle }}</h2>\n <mapa-capability-indicator *ngFor=\"let item of dataPositive\" [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>{{ negativeIndicatorsTitle }}</h2>\n <mapa-capability-indicator *ngFor=\"let item of dataNegative\" [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article\n class=\"indicator-list__column\"\n *ngIf=\"dataRiskPrecipitation.length > 0 || dataRiskNegligence.length > 0\"\n >\n <h2>{{ riskIndicatorsTitle }}</h2>\n <div *ngIf=\"dataRiskPrecipitation.length > 0\">\n <h3>{{ precipitationRiskTitle }}</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskPrecipitation\"\n [item]=\"item\"\n >\n </mapa-capability-indicator>\n </div>\n <div *ngIf=\"dataRiskNegligence.length > 0\">\n <h3>{{ negligenceRiskTitle }}</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskNegligence\"\n [item]=\"item\"\n >\n </mapa-capability-indicator>\n </div>\n </article>\n</section>\n\n", styles: [".indicator-list{display:flex;gap:42px;justify-content:space-between;margin-bottom:42px}.indicator-list__column{width:33%}.indicator-list__column h2{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}.indicator-list__column h3{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
1267
1275
|
}], ctorParameters: () => [{ type: MapaI18nService }], propDecorators: { data: [{
|
|
@@ -1286,10 +1294,10 @@ class MapaCapabilityIndicatorChartComponent {
|
|
|
1286
1294
|
return minWidth + 'px';
|
|
1287
1295
|
return interval + '%';
|
|
1288
1296
|
}
|
|
1289
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1290
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1297
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1298
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MapaCapabilityIndicatorChartComponent, isStandalone: true, selector: "mapa-capability-indicator-chart", inputs: { data: "data" }, providers: [CapabilityClassificationService], ngImport: i0, template: "<table class=\"indicator-chart\">\n <tr *ngFor=\"let item of data\">\n <td class=\"indicator-chart__column--description\">{{ item.name }}</td>\n <td class=\"indicator-chart__column indicator-chart__column--left\">\n <div\n class=\"indicator-chart__column--negative\"\n *ngIf=\"item.direction === 'Negativa'\"\n >\n <mapa-capability-indicator\n [item]=\"setUnlabeledItem(item)\"\n [style.width]=\"getWidth(item)\"\n ></mapa-capability-indicator>\n </div>\n </td>\n <td class=\"indicator-chart__column indicator-chart__column--right\">\n <div\n class=\"indicator-chart__column--positive\"\n *ngIf=\"item.direction === 'Positiva'\"\n >\n <mapa-capability-indicator\n [item]=\"setUnlabeledItem(item)\"\n [style.width]=\"getWidth(item)\"\n ></mapa-capability-indicator>\n </div>\n </td>\n </tr>\n</table>\n", styles: [":host ::ng-deep .indicator-chart{width:100%;border-collapse:collapse}:host ::ng-deep .indicator-chart tr:first-child{border-top:unset!important}:host ::ng-deep .indicator-chart tr:last-child{border-bottom:unset!important}:host ::ng-deep .indicator-chart__column{padding:0;font-size:14px!important}:host ::ng-deep .indicator-chart__column--description{padding-right:24px;width:20%!important}:host ::ng-deep .indicator-chart__column--positive{display:flex;border-spacing:0px;padding:8px 0!important}:host ::ng-deep .indicator-chart__column--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important;justify-content:flex-end!important}:host ::ng-deep .indicator-chart__column--positive .indicator__classification{margin-right:1px!important}:host ::ng-deep .indicator-chart__column--negative{display:flex;justify-content:flex-end;border-spacing:0px;padding:8px 0!important}:host ::ng-deep .indicator-chart__column--negative .indicator{border-radius:18px 0 0 18px!important;justify-content:flex-start!important;padding:2px!important}:host ::ng-deep .indicator-chart__column--negative .indicator__classification{margin-left:1px!important}:host ::ng-deep .indicator-chart__column--left{width:40%;border-bottom:1px solid #dcdcde}:host ::ng-deep .indicator-chart__column--right{border-bottom:1px solid #dcdcde;border-left:1px solid #dcdcde;width:40%}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: ["item"] }] }); }
|
|
1291
1299
|
}
|
|
1292
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1300
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, decorators: [{
|
|
1293
1301
|
type: Component,
|
|
1294
1302
|
args: [{ selector: "mapa-capability-indicator-chart", imports: [CommonModule, MapaCapabilityIndicatorComponent], providers: [CapabilityClassificationService], standalone: true, template: "<table class=\"indicator-chart\">\n <tr *ngFor=\"let item of data\">\n <td class=\"indicator-chart__column--description\">{{ item.name }}</td>\n <td class=\"indicator-chart__column indicator-chart__column--left\">\n <div\n class=\"indicator-chart__column--negative\"\n *ngIf=\"item.direction === 'Negativa'\"\n >\n <mapa-capability-indicator\n [item]=\"setUnlabeledItem(item)\"\n [style.width]=\"getWidth(item)\"\n ></mapa-capability-indicator>\n </div>\n </td>\n <td class=\"indicator-chart__column indicator-chart__column--right\">\n <div\n class=\"indicator-chart__column--positive\"\n *ngIf=\"item.direction === 'Positiva'\"\n >\n <mapa-capability-indicator\n [item]=\"setUnlabeledItem(item)\"\n [style.width]=\"getWidth(item)\"\n ></mapa-capability-indicator>\n </div>\n </td>\n </tr>\n</table>\n", styles: [":host ::ng-deep .indicator-chart{width:100%;border-collapse:collapse}:host ::ng-deep .indicator-chart tr:first-child{border-top:unset!important}:host ::ng-deep .indicator-chart tr:last-child{border-bottom:unset!important}:host ::ng-deep .indicator-chart__column{padding:0;font-size:14px!important}:host ::ng-deep .indicator-chart__column--description{padding-right:24px;width:20%!important}:host ::ng-deep .indicator-chart__column--positive{display:flex;border-spacing:0px;padding:8px 0!important}:host ::ng-deep .indicator-chart__column--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important;justify-content:flex-end!important}:host ::ng-deep .indicator-chart__column--positive .indicator__classification{margin-right:1px!important}:host ::ng-deep .indicator-chart__column--negative{display:flex;justify-content:flex-end;border-spacing:0px;padding:8px 0!important}:host ::ng-deep .indicator-chart__column--negative .indicator{border-radius:18px 0 0 18px!important;justify-content:flex-start!important;padding:2px!important}:host ::ng-deep .indicator-chart__column--negative .indicator__classification{margin-left:1px!important}:host ::ng-deep .indicator-chart__column--left{width:40%;border-bottom:1px solid #dcdcde}:host ::ng-deep .indicator-chart__column--right{border-bottom:1px solid #dcdcde;border-left:1px solid #dcdcde;width:40%}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#000}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:var(--mapa-font-heading, \"Asap\", \"Inter\", sans-serif);font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
1295
1303
|
}], ctorParameters: () => [{ type: CapabilityClassificationService }], propDecorators: { data: [{
|