mapa-library-ui 0.0.18 → 0.0.19
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/capability.interfaces.mjs +1 -1
- package/esm2020/src/lib/components/capability/lib/components/capability/public-api.mjs +3 -1
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-dot/capability-dot.component.mjs +6 -8
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-expand/capability-expand.component.mjs +3 -3
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-indicator/capability-indicator.component.mjs +8 -3
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-indicator-chart/capability-indicator-chart.component.mjs +21 -0
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-indicator-chart/capability-indicator-chart.module.mjs +19 -0
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-indicator-list/capability-indicator-list.component.mjs +3 -3
- package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-interval/capability-interval.component.mjs +7 -6
- package/fesm2015/mapa-library-ui-src-lib-components-capability.mjs +64 -91
- package/fesm2015/mapa-library-ui-src-lib-components-capability.mjs.map +1 -1
- package/fesm2020/mapa-library-ui-src-lib-components-capability.mjs +63 -91
- package/fesm2020/mapa-library-ui-src-lib-components-capability.mjs.map +1 -1
- package/mapa-library-ui-0.0.19.tgz +0 -0
- package/package.json +1 -1
- package/src/lib/components/capability/lib/components/capability/capability.interfaces.d.ts +2 -2
- package/src/lib/components/capability/lib/components/capability/public-api.d.ts +2 -0
- package/src/lib/components/capability/lib/components/capability/src/capability-dot/capability-dot.component.d.ts +1 -1
- package/src/lib/components/capability/lib/components/capability/src/capability-indicator/capability-indicator.component.d.ts +3 -1
- package/src/lib/components/capability/lib/components/capability/src/capability-indicator-chart/capability-indicator-chart.component.d.ts +8 -0
- package/src/lib/components/capability/lib/components/capability/src/capability-indicator-chart/capability-indicator-chart.module.d.ts +9 -0
- package/src/lib/components/capability/lib/components/capability/src/capability-interval/capability-interval.component.d.ts +1 -1
- package/mapa-library-ui-0.0.18.tgz +0 -0
|
@@ -282,63 +282,57 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
282
282
|
* Public API Surface of mapa-library-ui icon
|
|
283
283
|
*/
|
|
284
284
|
|
|
285
|
-
const
|
|
286
|
-
{
|
|
287
|
-
interval: 100,
|
|
288
|
-
classificationName: "Destaque",
|
|
289
|
-
color: "#96f2ee",
|
|
290
|
-
positive: true,
|
|
291
|
-
},
|
|
285
|
+
const CapabilityClassification = [
|
|
292
286
|
{
|
|
293
|
-
|
|
287
|
+
classificationId: 1,
|
|
294
288
|
classificationName: "Destaque",
|
|
295
289
|
color: "#96f2ee",
|
|
296
290
|
positive: true,
|
|
297
291
|
},
|
|
298
292
|
{
|
|
299
|
-
|
|
293
|
+
classificationId: 2,
|
|
300
294
|
classificationName: "Satisfatório",
|
|
301
295
|
color: "#68ceee",
|
|
302
296
|
positive: true,
|
|
303
297
|
},
|
|
304
298
|
{
|
|
305
|
-
|
|
299
|
+
classificationId: 3,
|
|
306
300
|
classificationName: "Adequado",
|
|
307
301
|
color: "#2d9ced",
|
|
308
302
|
positive: true,
|
|
309
303
|
},
|
|
310
304
|
{
|
|
311
|
-
|
|
305
|
+
classificationId: 4,
|
|
312
306
|
classificationName: "A desenvolver",
|
|
313
307
|
color: "#0e6ece",
|
|
314
308
|
positive: true,
|
|
315
309
|
},
|
|
316
310
|
{
|
|
317
|
-
|
|
311
|
+
classificationId: 5,
|
|
318
312
|
classificationName: "Crítico baixo",
|
|
319
313
|
color: "#073e92",
|
|
320
314
|
positive: true,
|
|
321
315
|
},
|
|
322
316
|
{
|
|
323
|
-
|
|
317
|
+
classificationId: 6,
|
|
324
318
|
classificationName: "Merece atenção baixo",
|
|
325
319
|
color: "#f56580",
|
|
326
320
|
positive: false,
|
|
327
321
|
},
|
|
328
322
|
{
|
|
329
|
-
|
|
323
|
+
classificationId: 7,
|
|
330
324
|
classificationName: "Adequado",
|
|
331
325
|
color: "#f598a7",
|
|
332
326
|
positive: false,
|
|
333
327
|
},
|
|
334
328
|
{
|
|
335
|
-
|
|
329
|
+
classificationId: 8,
|
|
336
330
|
classificationName: "Merece atenção alto",
|
|
337
331
|
color: "#f4284e",
|
|
338
332
|
positive: false,
|
|
339
333
|
},
|
|
340
334
|
{
|
|
341
|
-
|
|
335
|
+
classificationId: 9,
|
|
342
336
|
classificationName: "Crítico alto",
|
|
343
337
|
color: "#c11c2f",
|
|
344
338
|
positive: false,
|
|
@@ -359,17 +353,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
359
353
|
}] } });
|
|
360
354
|
|
|
361
355
|
class MapaCapabilityDotComponent {
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
const intervalObject = CapabilityInterval.find((cp) => cp.interval === interval);
|
|
365
|
-
return intervalObject?.classificationName || interval.toString();
|
|
356
|
+
getClassificationName(item) {
|
|
357
|
+
return (CapabilityClassification.find((classification) => classification.classificationId === item.classificationId)?.classificationName || "");
|
|
366
358
|
}
|
|
367
359
|
}
|
|
368
360
|
MapaCapabilityDotComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityDotComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
369
|
-
MapaCapabilityDotComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: { type: "type", item: "item", tooltip: "tooltip", capability: "capability" }, ngImport: i0, template: "<p\n *ngIf=\"!tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n></p>\n<p\n *ngIf=\"tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n [tooltip]=\"tooltipTemplate\"\n></p>\n<ng-template #tooltipTemplate>\n <div class=\"tooltip-info\">\n <strong *ngIf=\"item.
|
|
361
|
+
MapaCapabilityDotComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: { type: "type", item: "item", tooltip: "tooltip", capability: "capability" }, ngImport: i0, template: "<p\n *ngIf=\"!tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n></p>\n<p\n *ngIf=\"tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n [tooltip]=\"tooltipTemplate\"\n></p>\n<ng-template #tooltipTemplate>\n <div class=\"tooltip-info\">\n <strong *ngIf=\"item.direction === 'Negativa'\">\u2198\uFE0E</strong>\n <strong *ngIf=\"item.direction === 'Positiva'\">\u2197</strong>\n\n <h5>{{ capability?.name }}</h5>\n\n <mapa-tag size=\"small\">\n <p\n class=\"small-dot\"\n [ngClass]=\"'classification-' + item.classificationId\"\n ></p>\n {{ getClassificationName(item) }}\n </mapa-tag>\n </div>\n</ng-template>\n", styles: [".tooltip-info{display:flex;align-items:center}.tooltip-info .small-dot{margin-right:4px}.tooltip-info strong{margin-right:2px}.tooltip-info h5{margin:0 5px 0 0}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MapaTooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "position", "theme", "showDelay", "hideDelay"] }, { kind: "component", type: TagComponent, selector: "mapa-tag", inputs: ["color", "size"] }] });
|
|
370
362
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityDotComponent, decorators: [{
|
|
371
363
|
type: Component,
|
|
372
|
-
args: [{ selector: "mapa-capability-dot", template: "<p\n *ngIf=\"!tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n></p>\n<p\n *ngIf=\"tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n [tooltip]=\"tooltipTemplate\"\n></p>\n<ng-template #tooltipTemplate>\n <div class=\"tooltip-info\">\n <strong *ngIf=\"item.
|
|
364
|
+
args: [{ selector: "mapa-capability-dot", template: "<p\n *ngIf=\"!tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n></p>\n<p\n *ngIf=\"tooltip\"\n [class.dot]=\"type !== 'small'\"\n [class.small-dot]=\"type === 'small'\"\n [ngClass]=\"'classification-' + item.classificationId\"\n [tooltip]=\"tooltipTemplate\"\n></p>\n<ng-template #tooltipTemplate>\n <div class=\"tooltip-info\">\n <strong *ngIf=\"item.direction === 'Negativa'\">\u2198\uFE0E</strong>\n <strong *ngIf=\"item.direction === 'Positiva'\">\u2197</strong>\n\n <h5>{{ capability?.name }}</h5>\n\n <mapa-tag size=\"small\">\n <p\n class=\"small-dot\"\n [ngClass]=\"'classification-' + item.classificationId\"\n ></p>\n {{ getClassificationName(item) }}\n </mapa-tag>\n </div>\n</ng-template>\n", styles: [".tooltip-info{display:flex;align-items:center}.tooltip-info .small-dot{margin-right:4px}.tooltip-info strong{margin-right:2px}.tooltip-info h5{margin:0 5px 0 0}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"] }]
|
|
373
365
|
}], propDecorators: { type: [{
|
|
374
366
|
type: Input
|
|
375
367
|
}], item: [{
|
|
@@ -418,73 +410,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
418
410
|
}]
|
|
419
411
|
}] });
|
|
420
412
|
|
|
421
|
-
const CapabilityClassification = [
|
|
422
|
-
{
|
|
423
|
-
classificationId: 1,
|
|
424
|
-
classificationName: "Destaque",
|
|
425
|
-
color: "#96f2ee",
|
|
426
|
-
positive: true,
|
|
427
|
-
},
|
|
428
|
-
{
|
|
429
|
-
classificationId: 2,
|
|
430
|
-
classificationName: "Satisfatório",
|
|
431
|
-
color: "#68ceee",
|
|
432
|
-
positive: true,
|
|
433
|
-
},
|
|
434
|
-
{
|
|
435
|
-
classificationId: 3,
|
|
436
|
-
classificationName: "Adequado",
|
|
437
|
-
color: "#2d9ced",
|
|
438
|
-
positive: true,
|
|
439
|
-
},
|
|
440
|
-
{
|
|
441
|
-
classificationId: 4,
|
|
442
|
-
classificationName: "A desenvolver",
|
|
443
|
-
color: "#0e6ece",
|
|
444
|
-
positive: true,
|
|
445
|
-
},
|
|
446
|
-
{
|
|
447
|
-
classificationId: 5,
|
|
448
|
-
classificationName: "Crítico baixo",
|
|
449
|
-
color: "#073e92",
|
|
450
|
-
positive: true,
|
|
451
|
-
},
|
|
452
|
-
{
|
|
453
|
-
classificationId: 6,
|
|
454
|
-
classificationName: "Merece atenção baixo",
|
|
455
|
-
color: "#f56580",
|
|
456
|
-
positive: false,
|
|
457
|
-
},
|
|
458
|
-
{
|
|
459
|
-
classificationId: 7,
|
|
460
|
-
classificationName: "Adequado",
|
|
461
|
-
color: "#f598a7",
|
|
462
|
-
positive: false,
|
|
463
|
-
},
|
|
464
|
-
{
|
|
465
|
-
classificationId: 8,
|
|
466
|
-
classificationName: "Merece atenção alto",
|
|
467
|
-
color: "#f4284e",
|
|
468
|
-
positive: false,
|
|
469
|
-
},
|
|
470
|
-
{
|
|
471
|
-
classificationId: 9,
|
|
472
|
-
classificationName: "Crítico alto",
|
|
473
|
-
color: "#c11c2f",
|
|
474
|
-
positive: false,
|
|
475
|
-
},
|
|
476
|
-
];
|
|
477
|
-
|
|
478
413
|
class MapaCapabilityExpandComponent {
|
|
479
414
|
getClassificationName(item) {
|
|
480
415
|
return CapabilityClassification.find((classification) => classification.classificationId === item.classificationId)?.classificationName || '';
|
|
481
416
|
}
|
|
482
417
|
}
|
|
483
418
|
MapaCapabilityExpandComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityExpandComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
484
|
-
MapaCapabilityExpandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityExpandComponent, selector: "mapa-capability-expand", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"capability__concept\">\n <div>\n <strong>Conceito</strong>\n <p>\n {{ data.concept }}\n </p>\n </div>\n <div>\n <strong>Resultado</strong>\n <p>\n {{ data.result }}\n </p>\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 <strong>{{ item.name }}</strong>\n <mapa-tag size=\"small\">\n <mapa-capability-dot\n [item]=\"item\"\n ></mapa-capability-dot>\n {{ getClassificationName(item) }}\n </mapa-tag>\n </div>\n\n <p class=\"classificationName\">\n <strong *ngIf=\"item.
|
|
419
|
+
MapaCapabilityExpandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityExpandComponent, selector: "mapa-capability-expand", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"capability__concept\">\n <div>\n <strong>Conceito</strong>\n <p>\n {{ data.concept }}\n </p>\n </div>\n <div>\n <strong>Resultado</strong>\n <p>\n {{ data.result }}\n </p>\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 <strong>{{ item.name }}</strong>\n <mapa-tag size=\"small\">\n <mapa-capability-dot\n [item]=\"item\"\n ></mapa-capability-dot>\n {{ getClassificationName(item) }}\n </mapa-tag>\n </div>\n\n <p class=\"classificationName\">\n <strong *ngIf=\"item.direction === 'Negativa'\">\u2198\uFE0E Dire\u00E7\u00E3o Negativa</strong> \n <strong *ngIf=\"item.direction === 'Positiva'\">\u2197 Dire\u00E7\u00E3o Positiva</strong>\n | {{ item.description }}\n </p>\n </div>\n</div>\n", styles: [".capability__concept{display:flex;flex:1 1 48%;gap:42px;margin:24px 0 60px}.capability__concept div{width:48%}.capability__concept strong{display:block;margin-bottom:16px}.capability__expanded{border-top:1px solid #8c8f94;padding:36px 16px 16px;display:flex;flex-wrap:wrap;flex:0 0 30%;justify-content:flex-start;gap:30px}.capability__expanded--item{width:30%}.capability__expanded--item .name{display:flex;justify-content:space-between;margin-bottom:16px}.capability__expanded--item .classificationName{color:#8c8f94}.capability__expanded--item mapa-tag .tag{display:flex;align-items:center;gap:8px;padding:2px 8px 2px 3px!important;font-size:14px;height:18px}\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: TagComponent, selector: "mapa-tag", inputs: ["color", "size"] }, { kind: "component", type: MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: ["type", "item", "tooltip", "capability"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
485
420
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityExpandComponent, decorators: [{
|
|
486
421
|
type: Component,
|
|
487
|
-
args: [{ selector: "mapa-capability-expand", encapsulation: ViewEncapsulation.None, template: "<div class=\"capability__concept\">\n <div>\n <strong>Conceito</strong>\n <p>\n {{ data.concept }}\n </p>\n </div>\n <div>\n <strong>Resultado</strong>\n <p>\n {{ data.result }}\n </p>\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 <strong>{{ item.name }}</strong>\n <mapa-tag size=\"small\">\n <mapa-capability-dot\n [item]=\"item\"\n ></mapa-capability-dot>\n {{ getClassificationName(item) }}\n </mapa-tag>\n </div>\n\n <p class=\"classificationName\">\n <strong *ngIf=\"item.
|
|
422
|
+
args: [{ selector: "mapa-capability-expand", encapsulation: ViewEncapsulation.None, template: "<div class=\"capability__concept\">\n <div>\n <strong>Conceito</strong>\n <p>\n {{ data.concept }}\n </p>\n </div>\n <div>\n <strong>Resultado</strong>\n <p>\n {{ data.result }}\n </p>\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 <strong>{{ item.name }}</strong>\n <mapa-tag size=\"small\">\n <mapa-capability-dot\n [item]=\"item\"\n ></mapa-capability-dot>\n {{ getClassificationName(item) }}\n </mapa-tag>\n </div>\n\n <p class=\"classificationName\">\n <strong *ngIf=\"item.direction === 'Negativa'\">\u2198\uFE0E Dire\u00E7\u00E3o Negativa</strong> \n <strong *ngIf=\"item.direction === 'Positiva'\">\u2197 Dire\u00E7\u00E3o Positiva</strong>\n | {{ item.description }}\n </p>\n </div>\n</div>\n", styles: [".capability__concept{display:flex;flex:1 1 48%;gap:42px;margin:24px 0 60px}.capability__concept div{width:48%}.capability__concept strong{display:block;margin-bottom:16px}.capability__expanded{border-top:1px solid #8c8f94;padding:36px 16px 16px;display:flex;flex-wrap:wrap;flex:0 0 30%;justify-content:flex-start;gap:30px}.capability__expanded--item{width:30%}.capability__expanded--item .name{display:flex;justify-content:space-between;margin-bottom:16px}.capability__expanded--item .classificationName{color:#8c8f94}.capability__expanded--item mapa-tag .tag{display:flex;align-items:center;gap:8px;padding:2px 8px 2px 3px!important;font-size:14px;height:18px}\n"] }]
|
|
488
423
|
}], propDecorators: { data: [{
|
|
489
424
|
type: Input
|
|
490
425
|
}] } });
|
|
@@ -504,14 +439,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
504
439
|
}] });
|
|
505
440
|
|
|
506
441
|
class MapaCapabilityIndicatorComponent {
|
|
442
|
+
getWidth(item) {
|
|
443
|
+
return 32 + ((item.interval || 0) * 2) + 'px';
|
|
444
|
+
}
|
|
507
445
|
}
|
|
508
446
|
MapaCapabilityIndicatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
509
|
-
MapaCapabilityIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: { item: "item" }, ngImport: i0, template: "<p\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span>{{ item.name }}</span>\n <span class=\"indicator__classification\"
|
|
447
|
+
MapaCapabilityIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: { item: "item", fullWidth: "fullWidth" }, ngImport: i0, template: "<p\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n [style.width]=\"fullWidth ? '100%' : getWidth(item)\"\n>\n <span>{{ item.name }}</span>\n <span class=\"indicator__classification\">\n {{ item.interval }}%\n </span>\n</p>\n", styles: [".indicator{color:#fff}.indicator__classification{background-color:#fff;border-radius:16px;color:#000;padding:4px 8px;margin-right:4px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
510
448
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorComponent, decorators: [{
|
|
511
449
|
type: Component,
|
|
512
|
-
args: [{ selector: "mapa-capability-indicator", template: "<p\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n>\n <span>{{ item.name }}</span>\n <span class=\"indicator__classification\"
|
|
450
|
+
args: [{ selector: "mapa-capability-indicator", template: "<p\n class=\"indicator\"\n [ngClass]=\"'classification-' + item.classificationId\"\n [style.width]=\"fullWidth ? '100%' : getWidth(item)\"\n>\n <span>{{ item.name }}</span>\n <span class=\"indicator__classification\">\n {{ item.interval }}%\n </span>\n</p>\n", styles: [".indicator{color:#fff}.indicator__classification{background-color:#fff;border-radius:16px;color:#000;padding:4px 8px;margin-right:4px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"] }]
|
|
513
451
|
}], propDecorators: { item: [{
|
|
514
452
|
type: Input
|
|
453
|
+
}], fullWidth: [{
|
|
454
|
+
type: Input
|
|
515
455
|
}] } });
|
|
516
456
|
|
|
517
457
|
class MapaCapabilityIndicatorModule {
|
|
@@ -529,22 +469,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
529
469
|
}] });
|
|
530
470
|
|
|
531
471
|
class MapaCapabilityIntervalComponent {
|
|
532
|
-
|
|
472
|
+
getWidth(index) {
|
|
533
473
|
if (!this.data)
|
|
534
474
|
return 0;
|
|
535
|
-
const
|
|
475
|
+
const interval = this.data.interval || 0;
|
|
476
|
+
const intervalMod10 = Math.floor(interval / 10) % 10;
|
|
536
477
|
return index < intervalMod10
|
|
537
478
|
? 100
|
|
538
479
|
: index === intervalMod10
|
|
539
|
-
? (
|
|
480
|
+
? (interval % 10) * 10
|
|
540
481
|
: 0;
|
|
541
482
|
}
|
|
542
483
|
}
|
|
543
484
|
MapaCapabilityIntervalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIntervalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
544
|
-
MapaCapabilityIntervalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIntervalComponent, selector: "mapa-capability-interval", inputs: { data: "data" }, ngImport: i0, template: "<ul class=\"capability__interval\">\n <li class=\"capability__interval--item\" *ngFor=\"let item of [].constructor(9); let i = index\">\n <div\n class=\"capability__interval--percentage\"\n [style.width.%]=\"
|
|
485
|
+
MapaCapabilityIntervalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIntervalComponent, selector: "mapa-capability-interval", inputs: { data: "data" }, ngImport: i0, template: "<ul class=\"capability__interval\">\n <li class=\"capability__interval--item\" *ngFor=\"let item of [].constructor(9); let i = index\">\n <div\n class=\"capability__interval--percentage\"\n [style.width.%]=\"getWidth(i)\"\n ></div>\n </li>\n <li>\n <h1>{{ data.interval }}</h1>\n </li>\n</ul>\n", styles: [".capability__interval{display:flex;list-style-type:none;margin-block-start:0px;margin-block-end:0px;padding-inline-start:0px}.capability__interval h1{margin-bottom:0;margin-left:16px}.capability__interval--item{height:35px;width:20px;background-color:#d9d9d9;border-radius:6px;margin-right:6px}.capability__interval--item:last-of-type{margin-right:0}.capability__interval--percentage{height:35px;width:20px;background-color:#8c8f94;border-radius:6px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
545
486
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIntervalComponent, decorators: [{
|
|
546
487
|
type: Component,
|
|
547
|
-
args: [{ selector: "mapa-capability-interval", template: "<ul class=\"capability__interval\">\n <li class=\"capability__interval--item\" *ngFor=\"let item of [].constructor(9); let i = index\">\n <div\n class=\"capability__interval--percentage\"\n [style.width.%]=\"
|
|
488
|
+
args: [{ selector: "mapa-capability-interval", template: "<ul class=\"capability__interval\">\n <li class=\"capability__interval--item\" *ngFor=\"let item of [].constructor(9); let i = index\">\n <div\n class=\"capability__interval--percentage\"\n [style.width.%]=\"getWidth(i)\"\n ></div>\n </li>\n <li>\n <h1>{{ data.interval }}</h1>\n </li>\n</ul>\n", styles: [".capability__interval{display:flex;list-style-type:none;margin-block-start:0px;margin-block-end:0px;padding-inline-start:0px}.capability__interval h1{margin-bottom:0;margin-left:16px}.capability__interval--item{height:35px;width:20px;background-color:#d9d9d9;border-radius:6px;margin-right:6px}.capability__interval--item:last-of-type{margin-right:0}.capability__interval--percentage{height:35px;width:20px;background-color:#8c8f94;border-radius:6px}\n"] }]
|
|
548
489
|
}], propDecorators: { data: [{
|
|
549
490
|
type: Input
|
|
550
491
|
}] } });
|
|
@@ -774,10 +715,10 @@ class MapaCapabilityIndicatorListComponent {
|
|
|
774
715
|
}
|
|
775
716
|
}
|
|
776
717
|
MapaCapabilityIndicatorListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
777
|
-
MapaCapabilityIndicatorListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorListComponent, selector: "mapa-capability-indicator-list", inputs: { data: "data" }, ngImport: i0, template: "<section class=\"indicator-list\">\n <article class=\"indicator-list__column\">\n <h2>Indicadores positivos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataPositive\"\n [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores negativos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataNegative\"\n [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores de risco</h2>\n <h3>Risco de acidente por precipita\u00E7\u00E3o</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskPrecipitation\"\n [item]=\"item\">\n </mapa-capability-indicator>\n <h3>Risco de acidente por neglig\u00EAncia</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskNegligence\"\n [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n</section>\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:SF-Pro;font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}.indicator-list__column h3{font-family:SF-Pro;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:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: ["item"] }] });
|
|
718
|
+
MapaCapabilityIndicatorListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityIndicatorListComponent, selector: "mapa-capability-indicator-list", inputs: { data: "data" }, ngImport: i0, template: "<section class=\"indicator-list\">\n <article class=\"indicator-list__column\">\n <h2>Indicadores positivos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataPositive\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores negativos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataNegative\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores de risco</h2>\n <h3>Risco de acidente por precipita\u00E7\u00E3o</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskPrecipitation\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n <h3>Risco de acidente por neglig\u00EAncia</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskNegligence\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n </article>\n</section>\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:SF-Pro;font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}.indicator-list__column h3{font-family:SF-Pro;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:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MapaCapabilityIndicatorComponent, selector: "mapa-capability-indicator", inputs: ["item", "fullWidth"] }] });
|
|
778
719
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorListComponent, decorators: [{
|
|
779
720
|
type: Component,
|
|
780
|
-
args: [{ selector: "mapa-capability-indicator-list", template: "<section class=\"indicator-list\">\n <article class=\"indicator-list__column\">\n <h2>Indicadores positivos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataPositive\"\n [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores negativos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataNegative\"\n [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores de risco</h2>\n <h3>Risco de acidente por precipita\u00E7\u00E3o</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskPrecipitation\"\n [item]=\"item\">\n </mapa-capability-indicator>\n <h3>Risco de acidente por neglig\u00EAncia</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskNegligence\"\n [item]=\"item\">\n </mapa-capability-indicator>\n </article>\n</section>\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:SF-Pro;font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}.indicator-list__column h3{font-family:SF-Pro;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:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"] }]
|
|
721
|
+
args: [{ selector: "mapa-capability-indicator-list", template: "<section class=\"indicator-list\">\n <article class=\"indicator-list__column\">\n <h2>Indicadores positivos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataPositive\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores negativos</h2>\n <mapa-capability-indicator\n *ngFor=\"let item of dataNegative\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n </article>\n <article class=\"indicator-list__column\">\n <h2>Indicadores de risco</h2>\n <h3>Risco de acidente por precipita\u00E7\u00E3o</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskPrecipitation\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n <h3>Risco de acidente por neglig\u00EAncia</h3>\n <mapa-capability-indicator\n *ngFor=\"let item of dataRiskNegligence\"\n [item]=\"item\"\n [fullWidth]=\"true\">\n </mapa-capability-indicator>\n </article>\n</section>\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:SF-Pro;font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:24px}.indicator-list__column h3{font-family:SF-Pro;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:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"] }]
|
|
781
722
|
}], ctorParameters: function () { return []; }, propDecorators: { data: [{
|
|
782
723
|
type: Input
|
|
783
724
|
}] } });
|
|
@@ -796,6 +737,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
796
737
|
}]
|
|
797
738
|
}] });
|
|
798
739
|
|
|
740
|
+
class MapaCapabilityIndicatorChartComponent {
|
|
741
|
+
setUnlabeledItem(item) {
|
|
742
|
+
return {
|
|
743
|
+
classificationId: item.classificationId,
|
|
744
|
+
interval: item.interval,
|
|
745
|
+
};
|
|
746
|
+
}
|
|
747
|
+
}
|
|
748
|
+
MapaCapabilityIndicatorChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
749
|
+
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--negative\">\n <mapa-capability-indicator\n *ngIf=\"item.direction === 'Negativa'\"\n [item]=\"setUnlabeledItem(item)\"\n ></mapa-capability-indicator>\n </td>\n <td class=\"indicator-chart__column indicator-chart__column--positive\">\n <mapa-capability-indicator\n *ngIf=\"item.direction === 'Positiva'\"\n [item]=\"setUnlabeledItem(item)\"\n ></mapa-capability-indicator>\n </td>\n </tr>\n</table>\n", styles: [".indicator-chart{width:100%}.indicator-chart__column{width:275px}.indicator-chart__column--description{width:1%;white-space:nowrap;padding-right:24px}.indicator-chart__column--negative{display:flex;justify-content:flex-end}.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--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important}.indicator-chart__column--positive .indicator__classification{margin-right:1px!important}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\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", "fullWidth"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
750
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartComponent, decorators: [{
|
|
751
|
+
type: Component,
|
|
752
|
+
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--negative\">\n <mapa-capability-indicator\n *ngIf=\"item.direction === 'Negativa'\"\n [item]=\"setUnlabeledItem(item)\"\n ></mapa-capability-indicator>\n </td>\n <td class=\"indicator-chart__column indicator-chart__column--positive\">\n <mapa-capability-indicator\n *ngIf=\"item.direction === 'Positiva'\"\n [item]=\"setUnlabeledItem(item)\"\n ></mapa-capability-indicator>\n </td>\n </tr>\n</table>\n", styles: [".indicator-chart{width:100%}.indicator-chart__column{width:275px}.indicator-chart__column--description{width:1%;white-space:nowrap;padding-right:24px}.indicator-chart__column--negative{display:flex;justify-content:flex-end}.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--positive .indicator{border-radius:0 18px 18px 0!important;padding:2px!important}.indicator-chart__column--positive .indicator__classification{margin-right:1px!important}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f56580;color:#000}.classification-7{background-color:#f598a7;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}\n"] }]
|
|
753
|
+
}], propDecorators: { data: [{
|
|
754
|
+
type: Input
|
|
755
|
+
}] } });
|
|
756
|
+
|
|
757
|
+
class MapaCapabilityIndicatorChartModule {
|
|
758
|
+
}
|
|
759
|
+
MapaCapabilityIndicatorChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
760
|
+
MapaCapabilityIndicatorChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartModule, declarations: [MapaCapabilityIndicatorChartComponent], imports: [CommonModule, MapaCapabilityIndicatorModule], exports: [MapaCapabilityIndicatorChartComponent] });
|
|
761
|
+
MapaCapabilityIndicatorChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartModule, imports: [CommonModule, MapaCapabilityIndicatorModule] });
|
|
762
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityIndicatorChartModule, decorators: [{
|
|
763
|
+
type: NgModule,
|
|
764
|
+
args: [{
|
|
765
|
+
declarations: [MapaCapabilityIndicatorChartComponent],
|
|
766
|
+
exports: [MapaCapabilityIndicatorChartComponent],
|
|
767
|
+
imports: [CommonModule, MapaCapabilityIndicatorModule],
|
|
768
|
+
}]
|
|
769
|
+
}] });
|
|
770
|
+
|
|
799
771
|
/*
|
|
800
772
|
* Public API Surface of mapa-library-ui capability-detail
|
|
801
773
|
*/
|
|
@@ -808,5 +780,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
808
780
|
* Generated bundle index. Do not edit.
|
|
809
781
|
*/
|
|
810
782
|
|
|
811
|
-
export { ButtonComponent, IconComponent, MapaButtonModule, MapaCapabilityDetailComponent, MapaCapabilityDetailModule, MapaCapabilityDotComponent, MapaCapabilityDotModule, MapaCapabilityExpandComponent, MapaCapabilityExpandModule, MapaCapabilityIndicatorComponent, MapaCapabilityIndicatorListComponent, MapaCapabilityIndicatorListModule, MapaCapabilityIndicatorModule, MapaCapabilityIntervalComponent, MapaCapabilityIntervalModule, MapaIconModule, MapaTooltipComponent, MapaTooltipDirective, MapaTooltipModule };
|
|
783
|
+
export { ButtonComponent, IconComponent, MapaButtonModule, MapaCapabilityDetailComponent, MapaCapabilityDetailModule, MapaCapabilityDotComponent, MapaCapabilityDotModule, MapaCapabilityExpandComponent, MapaCapabilityExpandModule, MapaCapabilityIndicatorChartComponent, MapaCapabilityIndicatorChartModule, MapaCapabilityIndicatorComponent, MapaCapabilityIndicatorListComponent, MapaCapabilityIndicatorListModule, MapaCapabilityIndicatorModule, MapaCapabilityIntervalComponent, MapaCapabilityIntervalModule, MapaIconModule, MapaTooltipComponent, MapaTooltipDirective, MapaTooltipModule };
|
|
812
784
|
//# sourceMappingURL=mapa-library-ui-src-lib-components-capability.mjs.map
|