mapa-library-ui 1.1.2 → 1.1.4
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 +72 -72
- package/fesm2022/mapa-library-ui-src-lib-components-chart.mjs +24 -24
- package/fesm2022/mapa-library-ui-src-lib-components-checkbox.mjs +3 -3
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker-range.mjs +11 -12
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker-range.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-datepicker.mjs +12 -12
- package/fesm2022/mapa-library-ui-src-lib-components-dialog.mjs +16 -16
- package/fesm2022/mapa-library-ui-src-lib-components-dialog.mjs.map +1 -1
- package/fesm2022/mapa-library-ui-src-lib-components-dropdown-tree.mjs +24 -24
- package/fesm2022/mapa-library-ui-src-lib-components-dropdown.mjs +21 -21
- package/fesm2022/mapa-library-ui-src-lib-components-empty.mjs +9 -9
- package/fesm2022/mapa-library-ui-src-lib-components-filters.mjs +36 -36
- package/fesm2022/mapa-library-ui-src-lib-components-form.mjs +53 -54
- 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 +18 -18
- 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 +69 -69
- package/fesm2022/mapa-library-ui-src-lib-components-scale.mjs +66 -66
- 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 +26 -26
- 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 +12 -12
- 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 +173 -174
- package/fesm2022/mapa-library-ui.mjs.map +1 -1
- package/mapa-library-ui-1.1.4.tgz +0 -0
- package/package.json +1 -1
- package/mapa-library-ui-1.1.2.tgz +0 -0
|
@@ -161,18 +161,18 @@ class CapabilityClassificationService {
|
|
|
161
161
|
getByItem(item) {
|
|
162
162
|
return (CAPABILITY_CLASSIFICATION.find((classification) => classification.id === item.classificationId) || CAPABILITY_CLASSIFICATION[0]);
|
|
163
163
|
}
|
|
164
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
165
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
164
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: CapabilityClassificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
165
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: CapabilityClassificationService }); }
|
|
166
166
|
}
|
|
167
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: CapabilityClassificationService, decorators: [{
|
|
168
168
|
type: Injectable
|
|
169
169
|
}] });
|
|
170
170
|
|
|
171
171
|
class TagComponent {
|
|
172
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
173
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
172
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
173
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
174
174
|
}
|
|
175
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
175
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: TagComponent, decorators: [{
|
|
176
176
|
type: Component,
|
|
177
177
|
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"] }]
|
|
178
178
|
}], propDecorators: { tag: [{
|
|
@@ -207,10 +207,10 @@ class MapaTooltipComponent {
|
|
|
207
207
|
this.left = 0;
|
|
208
208
|
this.top = 0;
|
|
209
209
|
}
|
|
210
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
211
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
210
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
211
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
212
212
|
}
|
|
213
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
213
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaTooltipComponent, decorators: [{
|
|
214
214
|
type: Component,
|
|
215
215
|
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"] }]
|
|
216
216
|
}] });
|
|
@@ -314,10 +314,10 @@ class MapaTooltipDirective {
|
|
|
314
314
|
this.componentRef = null;
|
|
315
315
|
}
|
|
316
316
|
}
|
|
317
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
318
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
317
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaTooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
318
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.20", 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 }); }
|
|
319
319
|
}
|
|
320
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
320
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaTooltipDirective, decorators: [{
|
|
321
321
|
type: Directive,
|
|
322
322
|
args: [{
|
|
323
323
|
selector: "[tooltip]",
|
|
@@ -363,10 +363,10 @@ class MapaCapabilityDotComponent {
|
|
|
363
363
|
size: "small",
|
|
364
364
|
};
|
|
365
365
|
}
|
|
366
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
367
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
366
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityDotComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
367
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
368
368
|
}
|
|
369
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
369
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityDotComponent, decorators: [{
|
|
370
370
|
type: Component,
|
|
371
371
|
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"] }]
|
|
372
372
|
}], ctorParameters: () => [{ type: CapabilityClassificationService }], propDecorators: { type: [{
|
|
@@ -389,10 +389,10 @@ class HtmlSanitizerService {
|
|
|
389
389
|
sanitize(value) {
|
|
390
390
|
return sanitizeHtmlContent(this.sanitizer, value);
|
|
391
391
|
}
|
|
392
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
393
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
392
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: HtmlSanitizerService, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
393
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: HtmlSanitizerService, providedIn: "root" }); }
|
|
394
394
|
}
|
|
395
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
395
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: HtmlSanitizerService, decorators: [{
|
|
396
396
|
type: Injectable,
|
|
397
397
|
args: [{
|
|
398
398
|
providedIn: "root",
|
|
@@ -406,10 +406,10 @@ class SafeHtmlPipe {
|
|
|
406
406
|
transform(value) {
|
|
407
407
|
return this.htmlSanitizer.sanitize(value);
|
|
408
408
|
}
|
|
409
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
410
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.
|
|
409
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: HtmlSanitizerService }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
410
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.20", ngImport: i0, type: SafeHtmlPipe, isStandalone: true, name: "safeHtml" }); }
|
|
411
411
|
}
|
|
412
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: SafeHtmlPipe, decorators: [{
|
|
413
413
|
type: Pipe,
|
|
414
414
|
args: [{
|
|
415
415
|
name: "safeHtml",
|
|
@@ -546,10 +546,10 @@ class MapaI18nService {
|
|
|
546
546
|
resolveText(value, context) {
|
|
547
547
|
return typeof value === "function" ? value(context) : value;
|
|
548
548
|
}
|
|
549
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
550
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
549
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaI18nService, deps: [{ token: MAPA_UI_TEXTS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
550
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaI18nService, providedIn: "root" }); }
|
|
551
551
|
}
|
|
552
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
552
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaI18nService, decorators: [{
|
|
553
553
|
type: Injectable,
|
|
554
554
|
args: [{
|
|
555
555
|
providedIn: "root",
|
|
@@ -588,10 +588,10 @@ class MapaCapabilityExpandComponent {
|
|
|
588
588
|
size: "small",
|
|
589
589
|
};
|
|
590
590
|
}
|
|
591
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
592
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
591
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityExpandComponent, deps: [{ token: CapabilityClassificationService }, { token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
592
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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" }] }); }
|
|
593
593
|
}
|
|
594
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityExpandComponent, decorators: [{
|
|
595
595
|
type: Component,
|
|
596
596
|
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"] }]
|
|
597
597
|
}], ctorParameters: () => [{ type: CapabilityClassificationService }, { type: MapaI18nService }], propDecorators: { data: [{
|
|
@@ -599,10 +599,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
|
|
|
599
599
|
}] } });
|
|
600
600
|
|
|
601
601
|
class MapaCapabilityIndicatorComponent {
|
|
602
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
603
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
602
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
603
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
604
604
|
}
|
|
605
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
605
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIndicatorComponent, decorators: [{
|
|
606
606
|
type: Component,
|
|
607
607
|
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"] }]
|
|
608
608
|
}], propDecorators: { item: [{
|
|
@@ -674,10 +674,10 @@ class MapaCapabilityIntervalComponent {
|
|
|
674
674
|
isSVG() {
|
|
675
675
|
return !!this.data.classificationBg && this.data.classificationBg === "SVG";
|
|
676
676
|
}
|
|
677
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
678
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
677
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIntervalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
678
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
679
679
|
}
|
|
680
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
680
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIntervalComponent, decorators: [{
|
|
681
681
|
type: Component,
|
|
682
682
|
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"] }]
|
|
683
683
|
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
@@ -695,10 +695,10 @@ class MapaCapabilityIntervalBarComponent {
|
|
|
695
695
|
isSVG() {
|
|
696
696
|
return !!this.data.classificationBg && this.data.classificationBg === "SVG";
|
|
697
697
|
}
|
|
698
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
699
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
698
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIntervalBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
699
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
700
700
|
}
|
|
701
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
701
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIntervalBarComponent, decorators: [{
|
|
702
702
|
type: Component,
|
|
703
703
|
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"] }]
|
|
704
704
|
}], propDecorators: { data: [{
|
|
@@ -715,10 +715,10 @@ class MapaCapabilityComparativeIndicatorComponent {
|
|
|
715
715
|
getWidth(item) {
|
|
716
716
|
return 32 + (item.interval || 0) * 2 + "px";
|
|
717
717
|
}
|
|
718
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
719
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
718
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
719
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
720
720
|
}
|
|
721
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
721
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeIndicatorComponent, decorators: [{
|
|
722
722
|
type: Component,
|
|
723
723
|
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"] }]
|
|
724
724
|
}], propDecorators: { item: [{
|
|
@@ -737,10 +737,10 @@ class MapaCapabilityComparativeChartComponent {
|
|
|
737
737
|
isIndividually: item.isIndividually,
|
|
738
738
|
};
|
|
739
739
|
}
|
|
740
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
741
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
740
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
741
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
742
742
|
}
|
|
743
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
743
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeChartComponent, decorators: [{
|
|
744
744
|
type: Component,
|
|
745
745
|
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"] }]
|
|
746
746
|
}], propDecorators: { data: [{
|
|
@@ -766,10 +766,10 @@ class MapaCapabilityComparativeHeaderComponent {
|
|
|
766
766
|
items: [],
|
|
767
767
|
};
|
|
768
768
|
}
|
|
769
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
770
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
769
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeHeaderComponent, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
770
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
771
771
|
}
|
|
772
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
772
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeHeaderComponent, decorators: [{
|
|
773
773
|
type: Component,
|
|
774
774
|
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"] }]
|
|
775
775
|
}], ctorParameters: () => [{ type: MapaI18nService }], propDecorators: { data: [{
|
|
@@ -777,10 +777,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
|
|
|
777
777
|
}] } });
|
|
778
778
|
|
|
779
779
|
class MapaCapabilityComparativeComponent {
|
|
780
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
781
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
780
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
781
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
782
782
|
}
|
|
783
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
783
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityComparativeComponent, decorators: [{
|
|
784
784
|
type: Component,
|
|
785
785
|
args: [{ selector: "mapa-capability-comparative", imports: [
|
|
786
786
|
MapaCapabilityComparativeChartComponent,
|
|
@@ -847,10 +847,10 @@ class MapaCapabilityDetailComponent {
|
|
|
847
847
|
isSVG(item) {
|
|
848
848
|
return !!item.classificationBg && item.classificationBg === "SVG";
|
|
849
849
|
}
|
|
850
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
851
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
850
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityDetailComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
851
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.20", 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 }); }
|
|
852
852
|
}
|
|
853
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
853
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityDetailComponent, decorators: [{
|
|
854
854
|
type: Component,
|
|
855
855
|
args: [{ selector: "mapa-capability-detail", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
856
856
|
CommonModule,
|
|
@@ -915,10 +915,10 @@ class MapaCapabilityIndicatorListComponent {
|
|
|
915
915
|
this.dataRiskPrecipitation = this.data.filter((item) => item.risk === true && item.precipitation === true);
|
|
916
916
|
this.dataRiskNegligence = this.data.filter((item) => item.risk === true && item.negligence === true);
|
|
917
917
|
}
|
|
918
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
919
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
918
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIndicatorListComponent, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
919
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
920
920
|
}
|
|
921
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
921
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIndicatorListComponent, decorators: [{
|
|
922
922
|
type: Component,
|
|
923
923
|
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"] }]
|
|
924
924
|
}], ctorParameters: () => [{ type: MapaI18nService }], propDecorators: { data: [{
|
|
@@ -943,10 +943,10 @@ class MapaCapabilityIndicatorChartComponent {
|
|
|
943
943
|
return minWidth + 'px';
|
|
944
944
|
return interval + '%';
|
|
945
945
|
}
|
|
946
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
947
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
946
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
947
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", 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"] }] }); }
|
|
948
948
|
}
|
|
949
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
949
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, decorators: [{
|
|
950
950
|
type: Component,
|
|
951
951
|
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"] }]
|
|
952
952
|
}], ctorParameters: () => [{ type: CapabilityClassificationService }], propDecorators: { data: [{
|
|
@@ -961,10 +961,10 @@ class MapaProgressbarComponent {
|
|
|
961
961
|
constructor() {
|
|
962
962
|
this.showInterval = true;
|
|
963
963
|
}
|
|
964
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
965
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
964
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaProgressbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
965
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", type: MapaProgressbarComponent, isStandalone: true, selector: "mapa-progressbar", inputs: { data: "data", showInterval: "showInterval" }, ngImport: i0, template: "<div class=\"progress-bar\">\n <div class=\"progress-bar--bg\">\n <div\n class=\"progress-bar--filled\"\n [style.width.%]=\"data.interval\"\n [style.backgroundColor]=\"data.classification?.classificationColor\"\n ></div>\n </div>\n <div class=\"progress-bar--interval\" *ngIf=\"showInterval\">\n {{data.interval}}%\n </div>\n</div>\n", styles: [".progress-bar{display:flex;align-items:center;justify-content:space-between;color:#2e2a2a;font-size:18px;font-style:normal;font-weight:400;width:310px;gap:20px}.progress-bar--bg{position:relative;background-color:#eee;border-radius:6px;height:8px;width:247px}.progress-bar--filled{position:absolute;top:0;left:0;background-color:#c6c6c6;border-radius:6px;height:8px}.progress-bar--interval{color:#2e2a2a;text-align:center;font-size:24px;font-style:normal;font-weight:400;line-height:32px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
966
966
|
}
|
|
967
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
967
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaProgressbarComponent, decorators: [{
|
|
968
968
|
type: Component,
|
|
969
969
|
args: [{ selector: "mapa-progressbar", imports: [CommonModule], standalone: true, template: "<div class=\"progress-bar\">\n <div class=\"progress-bar--bg\">\n <div\n class=\"progress-bar--filled\"\n [style.width.%]=\"data.interval\"\n [style.backgroundColor]=\"data.classification?.classificationColor\"\n ></div>\n </div>\n <div class=\"progress-bar--interval\" *ngIf=\"showInterval\">\n {{data.interval}}%\n </div>\n</div>\n", styles: [".progress-bar{display:flex;align-items:center;justify-content:space-between;color:#2e2a2a;font-size:18px;font-style:normal;font-weight:400;width:310px;gap:20px}.progress-bar--bg{position:relative;background-color:#eee;border-radius:6px;height:8px;width:247px}.progress-bar--filled{position:absolute;top:0;left:0;background-color:#c6c6c6;border-radius:6px;height:8px}.progress-bar--interval{color:#2e2a2a;text-align:center;font-size:24px;font-style:normal;font-weight:400;line-height:32px}\n"] }]
|
|
970
970
|
}], propDecorators: { data: [{
|
|
@@ -1022,10 +1022,10 @@ class MapaScaleComponent {
|
|
|
1022
1022
|
}
|
|
1023
1023
|
return `assets/images/icons/${img}.svg`;
|
|
1024
1024
|
}
|
|
1025
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1026
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
1025
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaScaleComponent, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1026
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.20", type: MapaScaleComponent, isStandalone: true, selector: "mapa-scale", inputs: { data: "data", showProgressbar: "showProgressbar" }, ngImport: i0, template: "@for (competence of data; track competence) {\n <section class=\"mapa__card competence\">\n <header class=\"competence__header\">\n <img [src]=\"getCompetenceImg(competence)\" />\n {{ competence.competenceName }}\n </header>\n <section\n class=\"scales\"\n [class.scales--full-sized]=\"!showSummarized(competence.scales[0])\"\n [class.scales--summarized]=\"showSummarized(competence.scales[0])\"\n >\n @for (scale of competence.scales; track scale) {\n <section class=\"mapa__card scale-details\">\n <section class=\"scale-details__top\">\n <header class=\"scale-details__header\">\n <div class=\"scale-details__header--title mapa--display-m\">\n {{ scale.scaleName }}\n @if (scale.classification) {\n <div\n class=\"mapa__tag--bg\"\n [style.backgroundColor]=\"scale.classification.classificationColor\"\n [class.mapa__tag--contrast]=\"scale.classification.classificationId === 1\"\n >\n <span class=\"mapa__tag--text\">\n {{ scale.classification.classificationName }}\n </span>\n </div>\n }\n </div>\n @if (showProgressbar) {\n <div class=\"scale__header--progressbar\">\n @if (!scale.classification?.classificationBg) {\n <mapa-progressbar\n [data]=\"getProgressbarData(scale)\"\n ></mapa-progressbar>\n } @else {\n <mapa-capability-interval-bar\n [data]=\"getIntervalbarData(scale)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval-bar>\n }\n </div>\n }\n </header>\n @if (scale.scaleConcept) {\n <article class=\"scale-details__concept\">\n <strong>{{ conceptTitle }}:</strong> {{ scale.scaleConcept }}\n </article>\n }\n </section>\n <section\n class=\"scale-details__dimensions\"\n [class.dimension--full-sized]=\"!showSummarized(scale)\"\n [class.dimension--summarized]=\"showSummarized(scale)\"\n >\n @for (dimension of scale.dimensions; track dimension) {\n <article class=\"mapa__card--sm dimension\">\n <nav class=\"dimension__main\">\n <div class=\"dimension__title\">\n <div class=\"dimension__title--direction\">\n @if (isPositive(dimension)) {\n <span>↑</span>\n } @else {\n <span>↓</span>\n }\n </div>\n <div class=\"dimension__title--label\">\n {{ dimension.dimensionName }}\n </div>\n </div>\n <div class=\"dimension--classification\">\n @if (dimension.classification) {\n <div\n class=\"mapa__tag--bg\"\n [style.backgroundColor]=\"dimension.classification.classificationColor\"\n [class.mapa__tag--contrast]=\"dimension.classification.classificationId === 1\"\n >\n <span class=\"mapa__tag--text\">\n {{ dimension.classification.classificationName }}\n </span>\n </div>\n }\n </div>\n </nav>\n @if (dimension.dimensionClassificationMessage) {\n <div class=\"dimension__concept\">\n {{ dimension.dimensionClassificationMessage }}\n </div>\n }\n </article>\n }\n </section>\n </section>\n }\n </section>\n </section>\n}\n", styles: [".competence{display:flex;gap:24px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);width:fit-content}.competence__header{display:flex;align-items:center;color:#ea561d;font-size:32px;font-weight:400;line-height:40px;width:100%}.competence__header img{margin-right:16px}.competence .scales--summarized{display:grid;gap:24px;grid-template-columns:1fr 1fr 1fr}@media(max-width:768px){.competence .scales--summarized{grid-template-columns:1fr}}.competence .scale-details{display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;flex-wrap:wrap;gap:16px;width:fit-content;height:fit-content}.competence .scale-details__top{border-bottom:2px solid #8c8f94;width:100%}.competence .scale-details__header{display:flex;align-items:center;justify-content:space-between;width:100%;color:#181818;font-size:24px;font-style:normal;font-weight:500;line-height:32px;margin-bottom:20px;gap:18px}.competence .scale-details__header--title{display:flex;align-items:center;gap:24px}.competence .scale-details__concept{color:#50575e;font-size:16px;font-style:normal;font-weight:400;line-height:24px;padding-bottom:16px}.competence .scale-details__concept strong{color:#181818;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.competence .scale-details__dimensions{display:flex;flex-wrap:wrap;gap:24px;width:100%;height:fit-content}.competence .scale-details .dimension{display:flex;justify-content:flex-start;gap:24px;width:100%;height:fit-content}.competence .scale-details .dimension__main{display:flex;justify-content:space-between;width:100%}.competence .scale-details .dimension--full-sized .dimension{display:flex;gap:32px;width:100%}.competence .scale-details .dimension--full-sized .dimension__main{width:35%}@media(max-width:768px){.competence .scale-details .dimension--full-sized .dimension__main{width:auto;flex-direction:column;justify-content:start;gap:26px}}.competence .scale-details .dimension--full-sized .dimension__concept{width:65%}.competence .scale-details .dimension__title{display:flex;align-items:center;justify-content:center;color:#181818;font-size:16px;font-style:normal;font-weight:400;line-height:24px;gap:8px}.competence .scale-details .dimension--classification{display:flex;align-items:center;justify-content:center}.competence .scale-details .dimension__concept{color:#50575e;font-size:16px;font-style:normal;font-weight:400;line-height:24px}@media(max-width:768px){.competence{overflow-x:auto;width:auto}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MapaCapabilityIntervalBarComponent, selector: "mapa-capability-interval-bar", inputs: ["data", "expanded", "showInterval"], outputs: ["clicked"] }, { kind: "component", type: MapaProgressbarComponent, selector: "mapa-progressbar", inputs: ["data", "showInterval"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1027
1027
|
}
|
|
1028
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1028
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaScaleComponent, decorators: [{
|
|
1029
1029
|
type: Component,
|
|
1030
1030
|
args: [{ selector: "mapa-scale", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
1031
1031
|
CommonModule,
|
|
@@ -1039,10 +1039,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
|
|
|
1039
1039
|
}] } });
|
|
1040
1040
|
|
|
1041
1041
|
class MapaDetailsComponent {
|
|
1042
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1043
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1042
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1043
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.20", type: MapaDetailsComponent, isStandalone: true, selector: "mapa-details", ngImport: i0, template: "<ng-container></ng-container>\n", styles: [""] }); }
|
|
1044
1044
|
}
|
|
1045
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1045
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaDetailsComponent, decorators: [{
|
|
1046
1046
|
type: Component,
|
|
1047
1047
|
args: [{ selector: "mapa-details", standalone: true, template: "<ng-container></ng-container>\n" }]
|
|
1048
1048
|
}] });
|
|
@@ -1136,10 +1136,10 @@ class MapaScaleParameterizationComponent {
|
|
|
1136
1136
|
})),
|
|
1137
1137
|
};
|
|
1138
1138
|
}
|
|
1139
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1140
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: MapaScaleParameterizationComponent, isStandalone: true, selector: "mapa-scale-parameterization", inputs: { data: "data", showProgressbar: "showProgressbar", showInterval: "showInterval", showDots: "showDots" }, viewQueries: [{ propertyName: "accordion", first: true, predicate: ["detailAccordion"], descendants: true }], ngImport: i0, template: "@for (competence of data; track competence) {\n <section class=\"mapa-scale-parameterization\">\n <section\n class=\"mapa-scale-parameterization-scales\"\n [class.scales--full-sized]=\"!showSummarized(competence.scales[0])\"\n [class.scales--summarized]=\"showSummarized(competence.scales[0])\"\n >\n <mat-accordion\n class=\"mapa-scale-parameterization-accordion\"\n #detailAccordion=\"matAccordion\"\n multi\n >\n @for (scale of competence.scales; track scale) {\n <mat-expansion-panel\n class=\"mapa__card mapa-scale-parameterization-details\"\n >\n <mat-expansion-panel-header\n class=\"mapa-scale-parameterization-details__top\"\n >\n <header class=\"mapa-scale-parameterization-details__header\">\n <div\n class=\"mapa-scale-parameterization-details__header--title mapa--display-m\"\n >\n <div\n class=\"mapa-scale-parameterization-details__header--title-text\"\n >\n {{ scale.scaleName }}\n @if (showDots) {\n @let dimensionsCapability = getDimensionsAsCapability(scale);\n <div\n class=\"mapa-scale-parameterization-details__dots\"\n >\n @for (item of dimensionsCapability.items; track item) {\n <mapa-capability-dot\n type=\"small\"\n [item]=\"item\"\n [capability]=\"dimensionsCapability\"\n [tooltip]=\"true\"\n ></mapa-capability-dot>\n }\n </div>\n }\n </div>\n\n @if (scale.classification) {\n <div\n class=\"mapa__tag--bg\"\n [style.backgroundColor]=\"scale.classification.classificationColor\"\n [class.mapa__tag--contrast]=\"scale.classification.classificationId === 1\"\n >\n <span class=\"mapa__tag--text\">\n {{ scale.classification.classificationName }}\n </span>\n </div>\n }\n </div>\n @if (showProgressbar) {\n <div class=\"scale__header--progressbar\">\n @if (!scale.classification?.classificationBg) {\n <mapa-progressbar\n [data]=\"getProgressbarData(scale)\"\n ></mapa-progressbar>\n } @else {\n <mapa-capability-interval-bar\n [data]=\"getIntervalbarData(scale)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval-bar>\n }\n </div>\n }\n </header>\n </mat-expansion-panel-header>\n @if (scale.scaleConcept) {\n <article\n class=\"mapa-scale-parameterization-details__concept\"\n >\n <strong>{{ conceptTitle }}:</strong> {{ scale.scaleConcept }}\n </article>\n }\n <section\n class=\"mapa-scale-parameterization-details__dimensions\"\n [class.dimension--full-sized]=\"!showSummarized(scale)\"\n [class.dimension--summarized]=\"showSummarized(scale)\"\n >\n @for (dimension of scale.dimensions; track dimension) {\n <article class=\"mapa__card--sm dimension\">\n <nav class=\"dimension__main\">\n <div class=\"dimension__title\">\n <div class=\"dimension__title--direction\">\n @if (isPositive(dimension)) {\n <span>↑</span>\n } @else {\n <span>↓</span>\n }\n </div>\n <div class=\"dimension__title--label\">\n {{ dimension.dimensionName }}\n </div>\n </div>\n <div class=\"dimension--classification\">\n @if (dimension.classification) {\n <div\n class=\"mapa__tag--bg\"\n [style.backgroundColor]=\"dimension.classification.classificationColor\"\n [class.mapa__tag--contrast]=\"dimension.classification.classificationId === 1\"\n >\n <span class=\"mapa__tag--text\">\n {{ dimension.classification.classificationName }}\n </span>\n </div>\n }\n </div>\n </nav>\n @if (dimension.dimensionClassificationMessage) {\n <div class=\"dimension__concept\">\n {{ dimension.dimensionClassificationMessage }}\n </div>\n }\n </article>\n }\n </section>\n </mat-expansion-panel>\n }\n </mat-accordion>\n </section>\n </section>\n}\n", styles: [":host{display:block;width:100%}:host ::ng-deep .mapa-scale-parameterization{display:flex;gap:24px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);width:100%;max-width:100%;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-scales{flex:1 1 auto;width:100%;min-width:0}:host ::ng-deep .mapa-scale-parameterization__header{display:flex;align-items:center;color:#ea561d;font-size:32px;font-weight:400;line-height:40px;width:100%;margin-bottom:unset!important}:host ::ng-deep .mapa-scale-parameterization__header img{margin-right:16px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion{width:100%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel:first-of-type{border-top-right-radius:8px;border-top-left-radius:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel:last-of-type{border-bottom-right-radius:8px;border-bottom-left-radius:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel{box-shadow:unset!important;padding:unset!important;width:100%;max-width:100%;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-header{width:100%;height:auto;min-height:96px;padding:0 24px;border-bottom:unset!important;box-sizing:border-box;gap:24px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-header.mat-expanded{height:auto;min-height:96px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-header .mat-content{min-width:0;padding-right:4px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-content,:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-body{width:100%;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-body{padding:24px!important}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-spacing{margin:unset!important}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details{display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;flex-wrap:wrap;gap:unset!important;width:100%;max-width:100%;height:fit-content;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details--summarized{display:grid;gap:24px;grid-template-columns:1fr 1fr 1fr}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details--title-text{display:flex}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__dots{display:flex;align-items:center;margin-top:16px;gap:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__header{display:flex;align-items:center;justify-content:space-between;width:100%;color:#181818;font-size:24px;font-style:normal;font-weight:500;line-height:32px;margin:20px 0}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__header--title{display:flex;align-items:center;gap:24px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__concept{color:#50575e;font-size:16px;font-style:normal;font-weight:400;line-height:24px;padding-bottom:16px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__concept strong{color:#181818;font-size:16px;font-style:normal;font-weight:600;line-height:24px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__dimensions{display:flex;flex-wrap:wrap;gap:24px;width:100%;height:fit-content}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension{display:flex;justify-content:flex-start;gap:24px;width:100%;height:fit-content}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension__main{display:flex;justify-content:space-between;width:100%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--full-sized .dimension{display:flex;gap:32px;width:100%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--full-sized .dimension__main{width:35%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--full-sized .dimension__concept{width:65%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension__title{display:flex;align-items:center;justify-content:center;color:#181818;font-size:16px;font-style:normal;font-weight:400;line-height:24px;gap:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--classification{display:flex;align-items:center;justify-content:center}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension__concept{color:#50575e;font-size:16px;font-style:normal;font-weight:400;line-height:24px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: MapaProgressbarComponent, selector: "mapa-progressbar", inputs: ["data", "showInterval"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1139
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaScaleParameterizationComponent, deps: [{ token: MapaI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1140
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.20", type: MapaScaleParameterizationComponent, isStandalone: true, selector: "mapa-scale-parameterization", inputs: { data: "data", showProgressbar: "showProgressbar", showInterval: "showInterval", showDots: "showDots" }, viewQueries: [{ propertyName: "accordion", first: true, predicate: ["detailAccordion"], descendants: true }], ngImport: i0, template: "@for (competence of data; track competence) {\n <section class=\"mapa-scale-parameterization\">\n <section\n class=\"mapa-scale-parameterization-scales\"\n [class.scales--full-sized]=\"!showSummarized(competence.scales[0])\"\n [class.scales--summarized]=\"showSummarized(competence.scales[0])\"\n >\n <mat-accordion\n class=\"mapa-scale-parameterization-accordion\"\n #detailAccordion=\"matAccordion\"\n multi\n >\n @for (scale of competence.scales; track scale) {\n <mat-expansion-panel\n class=\"mapa__card mapa-scale-parameterization-details\"\n >\n <mat-expansion-panel-header\n class=\"mapa-scale-parameterization-details__top\"\n >\n <header class=\"mapa-scale-parameterization-details__header\">\n <div\n class=\"mapa-scale-parameterization-details__header--title mapa--display-m\"\n >\n <div\n class=\"mapa-scale-parameterization-details__header--title-text\"\n >\n {{ scale.scaleName }}\n @if (showDots) {\n @let dimensionsCapability = getDimensionsAsCapability(scale);\n <div\n class=\"mapa-scale-parameterization-details__dots\"\n >\n @for (item of dimensionsCapability.items; track item) {\n <mapa-capability-dot\n type=\"small\"\n [item]=\"item\"\n [capability]=\"dimensionsCapability\"\n [tooltip]=\"true\"\n ></mapa-capability-dot>\n }\n </div>\n }\n </div>\n\n @if (scale.classification) {\n <div\n class=\"mapa__tag--bg\"\n [style.backgroundColor]=\"scale.classification.classificationColor\"\n [class.mapa__tag--contrast]=\"scale.classification.classificationId === 1\"\n >\n <span class=\"mapa__tag--text\">\n {{ scale.classification.classificationName }}\n </span>\n </div>\n }\n </div>\n @if (showProgressbar) {\n <div class=\"scale__header--progressbar\">\n @if (!scale.classification?.classificationBg) {\n <mapa-progressbar\n [data]=\"getProgressbarData(scale)\"\n ></mapa-progressbar>\n } @else {\n <mapa-capability-interval-bar\n [data]=\"getIntervalbarData(scale)\"\n [showInterval]=\"true\"\n ></mapa-capability-interval-bar>\n }\n </div>\n }\n </header>\n </mat-expansion-panel-header>\n @if (scale.scaleConcept) {\n <article\n class=\"mapa-scale-parameterization-details__concept\"\n >\n <strong>{{ conceptTitle }}:</strong> {{ scale.scaleConcept }}\n </article>\n }\n <section\n class=\"mapa-scale-parameterization-details__dimensions\"\n [class.dimension--full-sized]=\"!showSummarized(scale)\"\n [class.dimension--summarized]=\"showSummarized(scale)\"\n >\n @for (dimension of scale.dimensions; track dimension) {\n <article class=\"mapa__card--sm dimension\">\n <nav class=\"dimension__main\">\n <div class=\"dimension__title\">\n <div class=\"dimension__title--direction\">\n @if (isPositive(dimension)) {\n <span>↑</span>\n } @else {\n <span>↓</span>\n }\n </div>\n <div class=\"dimension__title--label\">\n {{ dimension.dimensionName }}\n </div>\n </div>\n <div class=\"dimension--classification\">\n @if (dimension.classification) {\n <div\n class=\"mapa__tag--bg\"\n [style.backgroundColor]=\"dimension.classification.classificationColor\"\n [class.mapa__tag--contrast]=\"dimension.classification.classificationId === 1\"\n >\n <span class=\"mapa__tag--text\">\n {{ dimension.classification.classificationName }}\n </span>\n </div>\n }\n </div>\n </nav>\n @if (dimension.dimensionClassificationMessage) {\n <div class=\"dimension__concept\">\n {{ dimension.dimensionClassificationMessage }}\n </div>\n }\n </article>\n }\n </section>\n </mat-expansion-panel>\n }\n </mat-accordion>\n </section>\n </section>\n}\n", styles: [":host{display:block;width:100%}:host ::ng-deep .mapa-scale-parameterization{display:flex;gap:24px;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", \"Inter\", sans-serif);width:100%;max-width:100%;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-scales{flex:1 1 auto;width:100%;min-width:0}:host ::ng-deep .mapa-scale-parameterization__header{display:flex;align-items:center;color:#ea561d;font-size:32px;font-weight:400;line-height:40px;width:100%;margin-bottom:unset!important}:host ::ng-deep .mapa-scale-parameterization__header img{margin-right:16px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion{width:100%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel:first-of-type{border-top-right-radius:8px;border-top-left-radius:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel:last-of-type{border-bottom-right-radius:8px;border-bottom-left-radius:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel{box-shadow:unset!important;padding:unset!important;width:100%;max-width:100%;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-header{width:100%;height:auto;min-height:96px;padding:0 24px;border-bottom:unset!important;box-sizing:border-box;gap:24px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-header.mat-expanded{height:auto;min-height:96px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-header .mat-content{min-width:0;padding-right:4px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-content,:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-body{width:100%;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-body{padding:24px!important}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-accordion .mat-expansion-panel-spacing{margin:unset!important}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details{display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;flex-wrap:wrap;gap:unset!important;width:100%;max-width:100%;height:fit-content;box-sizing:border-box}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details--summarized{display:grid;gap:24px;grid-template-columns:1fr 1fr 1fr}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details--title-text{display:flex}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__dots{display:flex;align-items:center;margin-top:16px;gap:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__header{display:flex;align-items:center;justify-content:space-between;width:100%;color:#181818;font-size:24px;font-style:normal;font-weight:500;line-height:32px;margin:20px 0}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__header--title{display:flex;align-items:center;gap:24px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__concept{color:#50575e;font-size:16px;font-style:normal;font-weight:400;line-height:24px;padding-bottom:16px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__concept strong{color:#181818;font-size:16px;font-style:normal;font-weight:600;line-height:24px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details__dimensions{display:flex;flex-wrap:wrap;gap:24px;width:100%;height:fit-content}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension{display:flex;justify-content:flex-start;gap:24px;width:100%;height:fit-content}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension__main{display:flex;justify-content:space-between;width:100%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--full-sized .dimension{display:flex;gap:32px;width:100%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--full-sized .dimension__main{width:35%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--full-sized .dimension__concept{width:65%}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension__title{display:flex;align-items:center;justify-content:center;color:#181818;font-size:16px;font-style:normal;font-weight:400;line-height:24px;gap:8px}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension--classification{display:flex;align-items:center;justify-content:center}:host ::ng-deep .mapa-scale-parameterization .mapa-scale-parameterization-details .dimension__concept{color:#50575e;font-size:16px;font-style:normal;font-weight:400;line-height:24px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: MapaProgressbarComponent, selector: "mapa-progressbar", inputs: ["data", "showInterval"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1141
1141
|
}
|
|
1142
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.20", ngImport: i0, type: MapaScaleParameterizationComponent, decorators: [{
|
|
1143
1143
|
type: Component,
|
|
1144
1144
|
args: [{ selector: "mapa-scale-parameterization", changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
1145
1145
|
CommonModule,
|