mapa-library-ui 0.20.3 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-indicator/capability-indicator.component.mjs +3 -3
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-indicator-chart/capability-indicator-chart.component.mjs +6 -6
- package/fesm2015/mapa-library-ui-src-lib-components-capability.mjs +7 -7
- package/fesm2015/mapa-library-ui-src-lib-components-capability.mjs.map +1 -1
- package/fesm2020/mapa-library-ui-src-lib-components-capability.mjs +7 -7
- package/fesm2020/mapa-library-ui-src-lib-components-capability.mjs.map +1 -1
- package/mapa-library-ui-0.21.0.tgz +0 -0
- package/package.json +1 -1
- package/mapa-library-ui-0.20.3.tgz +0 -0
|
@@ -4,11 +4,11 @@ import * as i1 from "@angular/common";
|
|
|
4
4
|
export class MapaCapabilityIndicatorComponent {
|
|
5
5
|
}
|
|
6
6
|
MapaCapabilityIndicatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7
|
-
MapaCapabilityIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: { item: "item" }, ngImport: i0, template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\"
|
|
7
|
+
MapaCapabilityIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: { item: "item" }, ngImport: i0, template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\">\n {{ item.interval }}%\n </div>\n</div>\n", styles: [".indicator{color:#fff;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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
8
8
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorComponent, decorators: [{
|
|
9
9
|
type: Component,
|
|
10
|
-
args: [{ selector: "mapa-capability-indicator", template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\"
|
|
10
|
+
args: [{ selector: "mapa-capability-indicator", template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\">\n {{ item.interval }}%\n </div>\n</div>\n", styles: [".indicator{color:#fff;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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
11
11
|
}], propDecorators: { item: [{
|
|
12
12
|
type: Input
|
|
13
13
|
}] } });
|
|
14
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
14
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FwYWJpbGl0eS1pbmRpY2F0b3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWFwYS1saWJyYXJ5LXVpL3NyYy9saWIvY29tcG9uZW50cy9jYXBhYmlsaXR5L3NyYy9jYXBhYmlsaXR5LWluZGljYXRvci9jYXBhYmlsaXR5LWluZGljYXRvci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXBhLWxpYnJhcnktdWkvc3JjL2xpYi9jb21wb25lbnRzL2NhcGFiaWxpdHkvc3JjL2NhcGFiaWxpdHktaW5kaWNhdG9yL2NhcGFiaWxpdHktaW5kaWNhdG9yLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFXakQsTUFBTSxPQUFPLGdDQUFnQzs7OEhBQWhDLGdDQUFnQztrSEFBaEMsZ0NBQWdDLDJGQ1g3QywwT0FTQTs0RkRFYSxnQ0FBZ0M7a0JBUjVDLFNBQVM7K0JBQ0UsMkJBQTJCOzhCQVE1QixJQUFJO3NCQUFaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IENhcGFiaWxpdHlJdGVtIH0gZnJvbSBcIi4uL2Vzc2VudGlhbHMvaW50ZXJmYWNlcy9jYXBhYmlsaXR5LWl0ZW0uaW50ZXJmYWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJtYXBhLWNhcGFiaWxpdHktaW5kaWNhdG9yXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vY2FwYWJpbGl0eS1pbmRpY2F0b3IuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmxzOiBbXG4gICAgXCIuL2NhcGFiaWxpdHktaW5kaWNhdG9yLmNvbXBvbmVudC5zY3NzXCIsXG4gICAgXCIuLy4uLy4uL3N0eWxlcy9jYXBhYmlsaXR5LnNjc3NcIixcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgTWFwYUNhcGFiaWxpdHlJbmRpY2F0b3JDb21wb25lbnQge1xuICBASW5wdXQoKSBpdGVtITogQ2FwYWJpbGl0eUl0ZW07XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwiaW5kaWNhdG9yXCJcbiAgW25nQ2xhc3NdPVwiJ2NsYXNzaWZpY2F0aW9uLScgKyBpdGVtLmNsYXNzaWZpY2F0aW9uSWRcIlxuPlxuICA8c3BhbiAqbmdJZj1cIml0ZW0ubmFtZVwiPnt7IGl0ZW0ubmFtZSB9fTwvc3Bhbj5cbiAgPGRpdiBjbGFzcz1cImluZGljYXRvcl9fY2xhc3NpZmljYXRpb25cIj5cbiAgICB7eyBpdGVtLmludGVydmFsIH19JVxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
|
|
@@ -14,19 +14,19 @@ export class MapaCapabilityIndicatorChartComponent {
|
|
|
14
14
|
};
|
|
15
15
|
}
|
|
16
16
|
getWidth(item) {
|
|
17
|
-
const minWidth =
|
|
17
|
+
const minWidth = 42;
|
|
18
18
|
const interval = (item.interval || 0);
|
|
19
|
-
if (interval <
|
|
20
|
-
minWidth + 'px';
|
|
19
|
+
if (interval < 10)
|
|
20
|
+
return minWidth + 'px';
|
|
21
21
|
return interval + '%';
|
|
22
22
|
}
|
|
23
23
|
}
|
|
24
24
|
MapaCapabilityIndicatorChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, deps: [{ token: i1.CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
25
|
-
MapaCapabilityIndicatorChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorChartComponent, selector: "mapa-capability-indicator-chart", inputs: { data: "data" }, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr{border-
|
|
25
|
+
MapaCapabilityIndicatorChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorChartComponent, selector: "mapa-capability-indicator-chart", inputs: { data: "data" }, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr:first-child{border-top:unset!important}.indicator-chart tr:last-child{border-bottom:unset!important}.indicator-chart__column{padding:0;font-size:14px!important}.indicator-chart__column--description{padding-right:24px;width:20%!important}.indicator-chart__column--positive{display:flex;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important;justify-content:flex-end!important}.indicator-chart__column--positive .indicator__classification{margin-right:1px!important}.indicator-chart__column--negative{display:flex;justify-content:flex-end;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--negative .indicator{border-radius:18px 0 0 18px!important;justify-content:flex-start!important;padding:2px!important}.indicator-chart__column--negative .indicator__classification{margin-left:1px!important}.indicator-chart__column--left{width:40%;border-bottom:1px solid #dcdcde}.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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: ["item"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
26
26
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
|
-
args: [{ selector: "mapa-capability-indicator-chart", encapsulation: ViewEncapsulation.None, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr{border-
|
|
28
|
+
args: [{ selector: "mapa-capability-indicator-chart", encapsulation: ViewEncapsulation.None, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr:first-child{border-top:unset!important}.indicator-chart tr:last-child{border-bottom:unset!important}.indicator-chart__column{padding:0;font-size:14px!important}.indicator-chart__column--description{padding-right:24px;width:20%!important}.indicator-chart__column--positive{display:flex;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important;justify-content:flex-end!important}.indicator-chart__column--positive .indicator__classification{margin-right:1px!important}.indicator-chart__column--negative{display:flex;justify-content:flex-end;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--negative .indicator{border-radius:18px 0 0 18px!important;justify-content:flex-start!important;padding:2px!important}.indicator-chart__column--negative .indicator__classification{margin-left:1px!important}.indicator-chart__column--left{width:40%;border-bottom:1px solid #dcdcde}.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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
29
29
|
}], ctorParameters: function () { return [{ type: i1.CapabilityClassificationService }]; }, propDecorators: { data: [{
|
|
30
30
|
type: Input
|
|
31
31
|
}] } });
|
|
32
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
32
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FwYWJpbGl0eS1pbmRpY2F0b3ItY2hhcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWFwYS1saWJyYXJ5LXVpL3NyYy9saWIvY29tcG9uZW50cy9jYXBhYmlsaXR5L3NyYy9jYXBhYmlsaXR5LWluZGljYXRvci1jaGFydC9jYXBhYmlsaXR5LWluZGljYXRvci1jaGFydC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXBhLWxpYnJhcnktdWkvc3JjL2xpYi9jb21wb25lbnRzL2NhcGFiaWxpdHkvc3JjL2NhcGFiaWxpdHktaW5kaWNhdG9yLWNoYXJ0L2NhcGFiaWxpdHktaW5kaWNhdG9yLWNoYXJ0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOzs7OztBQWFwRSxNQUFNLE9BQU8scUNBQXFDO0lBR2hELFlBQW1CLGNBQStDO1FBQS9DLG1CQUFjLEdBQWQsY0FBYyxDQUFpQztJQUFHLENBQUM7SUFFL0QsZ0JBQWdCLENBQUMsSUFBb0I7UUFDMUMsT0FBTztZQUNMLGdCQUFnQixFQUFFLElBQUksQ0FBQyxnQkFBZ0I7WUFDdkMsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRO1NBQ3hCLENBQUE7SUFDSCxDQUFDO0lBRU0sUUFBUSxDQUFDLElBQW9CO1FBQ2xDLE1BQU0sUUFBUSxHQUFHLEVBQUUsQ0FBQztRQUNwQixNQUFNLFFBQVEsR0FBRyxDQUFDLElBQUksQ0FBQyxRQUFRLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDdEMsSUFBSSxRQUFRLEdBQUcsRUFBRTtZQUFFLE9BQU8sUUFBUSxHQUFHLElBQUksQ0FBQztRQUMxQyxPQUFPLFFBQVEsR0FBRyxHQUFHLENBQUM7SUFDeEIsQ0FBQzs7bUlBakJVLHFDQUFxQzt1SEFBckMscUNBQXFDLGlHQ2JsRCxtOEJBMkJBOzRGRGRhLHFDQUFxQztrQkFUakQsU0FBUzsrQkFDRSxpQ0FBaUMsaUJBTTVCLGlCQUFpQixDQUFDLElBQUk7c0hBRzVCLElBQUk7c0JBQVosS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IENhcGFiaWxpdHlJdGVtIH0gZnJvbSBcIi4uL2Vzc2VudGlhbHMvaW50ZXJmYWNlcy9jYXBhYmlsaXR5LWl0ZW0uaW50ZXJmYWNlXCI7XG5pbXBvcnQgeyBDYXBhYmlsaXR5Q2xhc3NpZmljYXRpb25TZXJ2aWNlIH0gZnJvbSBcIi4uL2Vzc2VudGlhbHMvc2VydmljZXMvY2FwYWJpbGl0eS1jbGFzc2lmaWNhdGlvbi5zZXJ2aWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJtYXBhLWNhcGFiaWxpdHktaW5kaWNhdG9yLWNoYXJ0XCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vY2FwYWJpbGl0eS1pbmRpY2F0b3ItY2hhcnQuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmxzOiBbXG4gICAgXCIuL2NhcGFiaWxpdHktaW5kaWNhdG9yLWNoYXJ0LmNvbXBvbmVudC5zY3NzXCIsXG4gICAgXCIuLy4uLy4uL3N0eWxlcy9jYXBhYmlsaXR5LnNjc3NcIixcbiAgXSxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZVxufSlcbmV4cG9ydCBjbGFzcyBNYXBhQ2FwYWJpbGl0eUluZGljYXRvckNoYXJ0Q29tcG9uZW50IHtcbiAgQElucHV0KCkgZGF0YSE6IENhcGFiaWxpdHlJdGVtW107XG5cbiAgY29uc3RydWN0b3IocHVibGljIGNsYXNzaWZpY2F0aW9uOiBDYXBhYmlsaXR5Q2xhc3NpZmljYXRpb25TZXJ2aWNlKSB7fVxuXG4gIHB1YmxpYyBzZXRVbmxhYmVsZWRJdGVtKGl0ZW06IENhcGFiaWxpdHlJdGVtKTogQ2FwYWJpbGl0eUl0ZW0ge1xuICAgIHJldHVybiB7XG4gICAgICBjbGFzc2lmaWNhdGlvbklkOiBpdGVtLmNsYXNzaWZpY2F0aW9uSWQsXG4gICAgICBpbnRlcnZhbDogaXRlbS5pbnRlcnZhbCxcbiAgICB9XG4gIH1cblxuICBwdWJsaWMgZ2V0V2lkdGgoaXRlbTogQ2FwYWJpbGl0eUl0ZW0pOiBzdHJpbmcge1xuICAgIGNvbnN0IG1pbldpZHRoID0gNDI7XG4gICAgY29uc3QgaW50ZXJ2YWwgPSAoaXRlbS5pbnRlcnZhbCB8fCAwKTtcbiAgICBpZiAoaW50ZXJ2YWwgPCAxMCkgcmV0dXJuIG1pbldpZHRoICsgJ3B4JztcbiAgICByZXR1cm4gaW50ZXJ2YWwgKyAnJSc7XG4gIH1cbn1cbiIsIjx0YWJsZSBjbGFzcz1cImluZGljYXRvci1jaGFydFwiPlxuICA8dHIgKm5nRm9yPVwibGV0IGl0ZW0gb2YgZGF0YVwiPlxuICAgIDx0ZCBjbGFzcz1cImluZGljYXRvci1jaGFydF9fY29sdW1uLS1kZXNjcmlwdGlvblwiPnt7IGl0ZW0ubmFtZSB9fTwvdGQ+XG4gICAgPHRkIGNsYXNzPVwiaW5kaWNhdG9yLWNoYXJ0X19jb2x1bW4gaW5kaWNhdG9yLWNoYXJ0X19jb2x1bW4tLWxlZnRcIj5cbiAgICAgIDxkaXZcbiAgICAgICAgY2xhc3M9XCJpbmRpY2F0b3ItY2hhcnRfX2NvbHVtbi0tbmVnYXRpdmVcIlxuICAgICAgICAqbmdJZj1cIiFjbGFzc2lmaWNhdGlvbi5nZXRCeUl0ZW0oaXRlbSkucG9zaXRpdmVcIlxuICAgICAgPlxuICAgICAgICA8bWFwYS1jYXBhYmlsaXR5LWluZGljYXRvclxuICAgICAgICAgIFtpdGVtXT1cInNldFVubGFiZWxlZEl0ZW0oaXRlbSlcIlxuICAgICAgICAgIFtzdHlsZS53aWR0aF09XCJnZXRXaWR0aChpdGVtKVwiXG4gICAgICAgID48L21hcGEtY2FwYWJpbGl0eS1pbmRpY2F0b3I+XG4gICAgICA8L2Rpdj5cbiAgICA8L3RkPlxuICAgIDx0ZCBjbGFzcz1cImluZGljYXRvci1jaGFydF9fY29sdW1uIGluZGljYXRvci1jaGFydF9fY29sdW1uLS1yaWdodFwiPlxuICAgICAgPGRpdlxuICAgICAgICBjbGFzcz1cImluZGljYXRvci1jaGFydF9fY29sdW1uLS1wb3NpdGl2ZVwiXG4gICAgICAgICpuZ0lmPVwiY2xhc3NpZmljYXRpb24uZ2V0QnlJdGVtKGl0ZW0pLnBvc2l0aXZlXCJcbiAgICAgID5cbiAgICAgICAgPG1hcGEtY2FwYWJpbGl0eS1pbmRpY2F0b3JcbiAgICAgICAgICBbaXRlbV09XCJzZXRVbmxhYmVsZWRJdGVtKGl0ZW0pXCJcbiAgICAgICAgICBbc3R5bGUud2lkdGhdPVwiZ2V0V2lkdGgoaXRlbSlcIlxuICAgICAgICA+PC9tYXBhLWNhcGFiaWxpdHktaW5kaWNhdG9yPlxuICAgICAgPC9kaXY+XG4gICAgPC90ZD5cbiAgPC90cj5cbjwvdGFibGU+XG4iXX0=
|
|
@@ -688,10 +688,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
688
688
|
class MapaCapabilityIndicatorComponent {
|
|
689
689
|
}
|
|
690
690
|
MapaCapabilityIndicatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
691
|
-
MapaCapabilityIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: { item: "item" }, ngImport: i0, template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\"
|
|
691
|
+
MapaCapabilityIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: { item: "item" }, ngImport: i0, template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\">\n {{ item.interval }}%\n </div>\n</div>\n", styles: [".indicator{color:#fff;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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
692
692
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorComponent, decorators: [{
|
|
693
693
|
type: Component,
|
|
694
|
-
args: [{ selector: "mapa-capability-indicator", template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\"
|
|
694
|
+
args: [{ selector: "mapa-capability-indicator", template: "<div\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span *ngIf=\"item.name\">{{ item.name }}</span>\n <div class=\"indicator__classification\">\n {{ item.interval }}%\n </div>\n</div>\n", styles: [".indicator{color:#fff;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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
695
695
|
}], propDecorators: { item: [{
|
|
696
696
|
type: Input
|
|
697
697
|
}] } });
|
|
@@ -1203,18 +1203,18 @@ class MapaCapabilityIndicatorChartComponent {
|
|
|
1203
1203
|
};
|
|
1204
1204
|
}
|
|
1205
1205
|
getWidth(item) {
|
|
1206
|
-
const minWidth =
|
|
1206
|
+
const minWidth = 42;
|
|
1207
1207
|
const interval = (item.interval || 0);
|
|
1208
|
-
if (interval <
|
|
1209
|
-
minWidth + 'px';
|
|
1208
|
+
if (interval < 10)
|
|
1209
|
+
return minWidth + 'px';
|
|
1210
1210
|
return interval + '%';
|
|
1211
1211
|
}
|
|
1212
1212
|
}
|
|
1213
1213
|
MapaCapabilityIndicatorChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, deps: [{ token: CapabilityClassificationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1214
|
-
MapaCapabilityIndicatorChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorChartComponent, selector: "mapa-capability-indicator-chart", inputs: { data: "data" }, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr{border-
|
|
1214
|
+
MapaCapabilityIndicatorChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorChartComponent, selector: "mapa-capability-indicator-chart", inputs: { data: "data" }, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr:first-child{border-top:unset!important}.indicator-chart tr:last-child{border-bottom:unset!important}.indicator-chart__column{padding:0;font-size:14px!important}.indicator-chart__column--description{padding-right:24px;width:20%!important}.indicator-chart__column--positive{display:flex;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important;justify-content:flex-end!important}.indicator-chart__column--positive .indicator__classification{margin-right:1px!important}.indicator-chart__column--negative{display:flex;justify-content:flex-end;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--negative .indicator{border-radius:18px 0 0 18px!important;justify-content:flex-start!important;padding:2px!important}.indicator-chart__column--negative .indicator__classification{margin-left:1px!important}.indicator-chart__column--left{width:40%;border-bottom:1px solid #dcdcde}.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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"], dependencies: [{ 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"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1215
1215
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, decorators: [{
|
|
1216
1216
|
type: Component,
|
|
1217
|
-
args: [{ selector: "mapa-capability-indicator-chart", encapsulation: ViewEncapsulation.None, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr{border-
|
|
1217
|
+
args: [{ selector: "mapa-capability-indicator-chart", encapsulation: ViewEncapsulation.None, 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=\"!classification.getByItem(item).positive\"\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=\"classification.getByItem(item).positive\"\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: [".indicator-chart{width:100%;border-collapse:collapse}.indicator-chart tr:first-child{border-top:unset!important}.indicator-chart tr:last-child{border-bottom:unset!important}.indicator-chart__column{padding:0;font-size:14px!important}.indicator-chart__column--description{padding-right:24px;width:20%!important}.indicator-chart__column--positive{display:flex;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important;justify-content:flex-end!important}.indicator-chart__column--positive .indicator__classification{margin-right:1px!important}.indicator-chart__column--negative{display:flex;justify-content:flex-end;border-spacing:0px;padding:8px 0!important}.indicator-chart__column--negative .indicator{border-radius:18px 0 0 18px!important;justify-content:flex-start!important;padding:2px!important}.indicator-chart__column--negative .indicator__classification{margin-left:1px!important}.indicator-chart__column--left{width:40%;border-bottom:1px solid #dcdcde}.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:SF-Pro;font-size:16px;font-style:normal;font-weight:400}.display-S{font-family:SF-Pro;font-size:20px;font-style:normal;font-weight:400}.display-L{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400}.display-XG{font-family:SF-Pro;font-size:48px;font-style:normal;font-weight:400}*{transition:opacity .4s ease-out,max-height .4s ease-out}\n"] }]
|
|
1218
1218
|
}], ctorParameters: function () { return [{ type: CapabilityClassificationService }]; }, propDecorators: { data: [{
|
|
1219
1219
|
type: Input
|
|
1220
1220
|
}] } });
|