mapa-library-ui 2.5.0 → 2.5.1

package/fesm2022/mapa-library-ui.mjs

@@ -8439,7 +8439,12 @@ class MapaResultTrackComponent {
         this.direction = input('positive', ...(ngDevMode ? [{ debugName: "direction" }] : []));
         this.showValue = input(true, ...(ngDevMode ? [{ debugName: "showValue" }] : []));
         this.ariaLabel = input(...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : []));
+        this.steps = Array.from({ length: 10 }, (_, index) => index);
         this.safeValue = computed(() => clamp(this.value()), ...(ngDevMode ? [{ debugName: "safeValue" }] : []));
+        this.filledSteps = computed(() => {
+            const value = this.safeValue();
+            return value === 100 ? 10 : Math.floor(value / 10);
+        }, ...(ngDevMode ? [{ debugName: "filledSteps" }] : []));
         this.fillLeft = computed(() => {
             if (this.mode() === 'linear')
                 return 0;
@@ -8456,12 +8461,15 @@ class MapaResultTrackComponent {
         this.label = computed(() => this.ariaLabel() ??
             this.i18n.texts.report.meterLabel(this.name(), this.safeValue()), ...(ngDevMode ? [{ debugName: "label" }] : []));
     }
+    stepFill(step) {
+        return Math.min(100, Math.max(0, (this.safeValue() - step * 10) * 10));
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.21", ngImport: i0, type: MapaResultTrackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.21", type: MapaResultTrackComponent, isStandalone: true, selector: "mapa-result-track", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"mapa-result-track\"\n  [class.mapa-result-track--plain]=\"!showValue()\"\n  [class.mapa-result-track--segmented]=\"appearance() === 'segmented'\"\n  role=\"meter\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [attr.aria-valuenow]=\"safeValue()\"\n  [attr.aria-label]=\"label()\"\n  [style.--mapa-result-color]=\"color()\"\n  [style.--mapa-result-left]=\"fillLeft() + '%'\"\n  [style.--mapa-result-width]=\"fillWidth() + '%'\"\n  [style.--mapa-result-position]=\"badgePosition() + '%'\"\n>\n  <span class=\"mapa-result-track__rail\" aria-hidden=\"true\">\n    @if (mode() === \"diverging\") {\n      <span class=\"mapa-result-track__midpoint\"></span>\n    }\n    <span\n      class=\"mapa-result-track__fill\"\n      [class.negative]=\"mode() === 'diverging' && direction() === 'negative'\"\n      [class.positive]=\"mode() === 'diverging' && direction() === 'positive'\"\n    ></span>\n  </span>\n  @if (showValue()) {\n    <span class=\"mapa-result-track__badge\" aria-hidden=\"true\"\n      >{{ safeValue() }}%</span\n    >\n  }\n</div>\n", styles: [".mapa-result-track{--mapa-result-badge-height: 24px;--mapa-result-fill-height: calc(var(--mapa-result-track-height, 14px) - 2px);min-height:28px;padding:10px 0 8px;position:relative}.mapa-result-track .negative{border-top-right-radius:0%;border-bottom-right-radius:0%}.mapa-result-track .positive{border-top-left-radius:0%;border-bottom-left-radius:0%}.mapa-result-track__rail{background:#e7ebed;border-radius:999px;display:block;height:var(--mapa-result-track-height, 14px);overflow:visible;position:relative}.mapa-result-track__fill{background:var(--mapa-result-color);border-radius:999px;height:var(--mapa-result-fill-height);left:var(--mapa-result-left);position:absolute;top:50%;transform:translateY(-50%);width:var(--mapa-result-width)}.mapa-result-track__midpoint{background:#aeb7bc;height:10px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:1px}.mapa-result-track__badge{align-items:center;background:#fff;border:2px solid var(--mapa-result-color);border-radius:999px;box-sizing:border-box;display:inline-flex;font:650 10px/1 var(--mapa-font-body, \"Asap\", sans-serif);height:var(--mapa-result-badge-height);justify-content:center;left:clamp(18px,var(--mapa-result-position),100% - 18px);min-width:34px;padding:0 5px;position:absolute;text-align:center;top:6px;transform:translate(-50%);z-index:1}.mapa-result-track--plain{min-height:0;padding:0}.mapa-result-track--segmented{--mapa-result-badge-height: 22px;--mapa-result-fill-height: 12px;min-height:24px;padding:3px 0}.mapa-result-track--segmented .mapa-result-track__rail{background:repeating-linear-gradient(90deg,#fff 0 calc(20% - 1px),#d9e0e3 calc(20% - 1px) 20%);border:1px solid #d9e0e3;border-radius:0;height:18px}.mapa-result-track--segmented .mapa-result-track__fill{border-radius:0}.mapa-result-track--segmented .mapa-result-track__badge{background:#fff;border-width:1px;min-width:29px;padding:0 4px;top:50%;transform:translate(-50%,-50%)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.21", type: MapaResultTrackComponent, isStandalone: true, selector: "mapa-result-track", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"mapa-result-track\"\n  [class.mapa-result-track--plain]=\"!showValue()\"\n  [class.mapa-result-track--segmented]=\"appearance() === 'segmented'\"\n  [class.mapa-result-track--stepped]=\"appearance() === 'stepped'\"\n  role=\"meter\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [attr.aria-valuenow]=\"safeValue()\"\n  [attr.aria-label]=\"label()\"\n  [style.--mapa-result-color]=\"color()\"\n  [style.--mapa-result-left]=\"fillLeft() + '%'\"\n  [style.--mapa-result-width]=\"fillWidth() + '%'\"\n  [style.--mapa-result-position]=\"badgePosition() + '%'\"\n>\n  @if (appearance() === \"stepped\") {\n    <span class=\"mapa-result-track__steps\" aria-hidden=\"true\">\n      @for (step of steps; track step) {\n        <i\n          [class.mapa-result-track__step--filled]=\"step < filledSteps()\"\n          [style.--mapa-result-step-fill]=\"stepFill(step) + '%'\"\n        ></i>\n      }\n    </span>\n    @if (showValue()) {\n      <strong class=\"mapa-result-track__value\" aria-hidden=\"true\"\n        >{{ safeValue() }}%</strong\n      >\n    }\n  } @else {\n    <span class=\"mapa-result-track__rail\" aria-hidden=\"true\">\n      @if (mode() === \"diverging\") {\n        <span class=\"mapa-result-track__midpoint\"></span>\n      }\n      <span\n        class=\"mapa-result-track__fill\"\n        [class.negative]=\"mode() === 'diverging' && direction() === 'negative'\"\n        [class.positive]=\"mode() === 'diverging' && direction() === 'positive'\"\n      ></span>\n    </span>\n    @if (showValue()) {\n      <span class=\"mapa-result-track__badge\" aria-hidden=\"true\"\n        >{{ safeValue() }}%</span\n      >\n    }\n  }\n</div>\n", styles: [".mapa-result-track{--mapa-result-badge-height: 24px;--mapa-result-fill-height: calc(var(--mapa-result-track-height, 14px) - 2px);min-height:28px;padding:10px 0 8px;position:relative}.mapa-result-track .negative{border-top-right-radius:0%;border-bottom-right-radius:0%}.mapa-result-track .positive{border-top-left-radius:0%;border-bottom-left-radius:0%}.mapa-result-track__rail{background:#e7ebed;border-radius:999px;display:block;height:var(--mapa-result-track-height, 14px);overflow:visible;position:relative}.mapa-result-track__fill{background:var(--mapa-result-color);border-radius:999px;height:var(--mapa-result-fill-height);left:var(--mapa-result-left);position:absolute;top:50%;transform:translateY(-50%);width:var(--mapa-result-width)}.mapa-result-track__midpoint{background:#aeb7bc;height:10px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:1px}.mapa-result-track__badge{align-items:center;background:#fff;border:2px solid var(--mapa-result-color);border-radius:999px;box-sizing:border-box;color:var(--mapa-result-color);display:inline-flex;font:650 10px/1 var(--mapa-font-body, \"Asap\", sans-serif);height:var(--mapa-result-badge-height);justify-content:center;left:clamp(18px,var(--mapa-result-position),100% - 18px);min-width:34px;padding:0 5px;position:absolute;text-align:center;top:6px;transform:translate(-50%);z-index:1}.mapa-result-track--plain{min-height:0;padding:0}.mapa-result-track--segmented{--mapa-result-badge-height: 22px;--mapa-result-fill-height: 12px;min-height:24px;padding:3px 0}.mapa-result-track--segmented .mapa-result-track__rail{background:repeating-linear-gradient(90deg,#fff 0 calc(20% - 1px),#d9e0e3 calc(20% - 1px) 20%);border:1px solid #d9e0e3;border-radius:0;height:18px}.mapa-result-track--segmented .mapa-result-track__fill{border-radius:0}.mapa-result-track--segmented .mapa-result-track__badge{background:#fff;border-width:1px;min-width:29px;padding:0 4px;top:50%;transform:translate(-50%,-50%)}.mapa-result-track--stepped{align-items:center;display:grid;gap:12px;grid-template-columns:minmax(0,1fr) auto;min-height:40px;padding:0;width:100%}.mapa-result-track--stepped .mapa-result-track__steps{display:grid;gap:5px;grid-template-columns:repeat(10,minmax(0,18px));min-width:0;width:100%}.mapa-result-track--stepped .mapa-result-track__steps i{background:#d8dee7;border-radius:7px;display:block;height:40px;min-width:0;overflow:hidden}.mapa-result-track--stepped .mapa-result-track__steps i:before{background:var(--mapa-result-color);content:\"\";display:block;height:100%;width:var(--mapa-result-step-fill, 0%)}.mapa-result-track--stepped .mapa-result-track__value{color:var(--mapa-result-color);font-size:17px;min-width:44px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.21", ngImport: i0, type: MapaResultTrackComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mapa-result-track', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"mapa-result-track\"\n  [class.mapa-result-track--plain]=\"!showValue()\"\n  [class.mapa-result-track--segmented]=\"appearance() === 'segmented'\"\n  role=\"meter\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [attr.aria-valuenow]=\"safeValue()\"\n  [attr.aria-label]=\"label()\"\n  [style.--mapa-result-color]=\"color()\"\n  [style.--mapa-result-left]=\"fillLeft() + '%'\"\n  [style.--mapa-result-width]=\"fillWidth() + '%'\"\n  [style.--mapa-result-position]=\"badgePosition() + '%'\"\n>\n  <span class=\"mapa-result-track__rail\" aria-hidden=\"true\">\n    @if (mode() === \"diverging\") {\n      <span class=\"mapa-result-track__midpoint\"></span>\n    }\n    <span\n      class=\"mapa-result-track__fill\"\n      [class.negative]=\"mode() === 'diverging' && direction() === 'negative'\"\n      [class.positive]=\"mode() === 'diverging' && direction() === 'positive'\"\n    ></span>\n  </span>\n  @if (showValue()) {\n    <span class=\"mapa-result-track__badge\" aria-hidden=\"true\"\n      >{{ safeValue() }}%</span\n    >\n  }\n</div>\n", styles: [".mapa-result-track{--mapa-result-badge-height: 24px;--mapa-result-fill-height: calc(var(--mapa-result-track-height, 14px) - 2px);min-height:28px;padding:10px 0 8px;position:relative}.mapa-result-track .negative{border-top-right-radius:0%;border-bottom-right-radius:0%}.mapa-result-track .positive{border-top-left-radius:0%;border-bottom-left-radius:0%}.mapa-result-track__rail{background:#e7ebed;border-radius:999px;display:block;height:var(--mapa-result-track-height, 14px);overflow:visible;position:relative}.mapa-result-track__fill{background:var(--mapa-result-color);border-radius:999px;height:var(--mapa-result-fill-height);left:var(--mapa-result-left);position:absolute;top:50%;transform:translateY(-50%);width:var(--mapa-result-width)}.mapa-result-track__midpoint{background:#aeb7bc;height:10px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:1px}.mapa-result-track__badge{align-items:center;background:#fff;border:2px solid var(--mapa-result-color);border-radius:999px;box-sizing:border-box;display:inline-flex;font:650 10px/1 var(--mapa-font-body, \"Asap\", sans-serif);height:var(--mapa-result-badge-height);justify-content:center;left:clamp(18px,var(--mapa-result-position),100% - 18px);min-width:34px;padding:0 5px;position:absolute;text-align:center;top:6px;transform:translate(-50%);z-index:1}.mapa-result-track--plain{min-height:0;padding:0}.mapa-result-track--segmented{--mapa-result-badge-height: 22px;--mapa-result-fill-height: 12px;min-height:24px;padding:3px 0}.mapa-result-track--segmented .mapa-result-track__rail{background:repeating-linear-gradient(90deg,#fff 0 calc(20% - 1px),#d9e0e3 calc(20% - 1px) 20%);border:1px solid #d9e0e3;border-radius:0;height:18px}.mapa-result-track--segmented .mapa-result-track__fill{border-radius:0}.mapa-result-track--segmented .mapa-result-track__badge{background:#fff;border-width:1px;min-width:29px;padding:0 4px;top:50%;transform:translate(-50%,-50%)}\n"] }]
+            args: [{ selector: 'mapa-result-track', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"mapa-result-track\"\n  [class.mapa-result-track--plain]=\"!showValue()\"\n  [class.mapa-result-track--segmented]=\"appearance() === 'segmented'\"\n  [class.mapa-result-track--stepped]=\"appearance() === 'stepped'\"\n  role=\"meter\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [attr.aria-valuenow]=\"safeValue()\"\n  [attr.aria-label]=\"label()\"\n  [style.--mapa-result-color]=\"color()\"\n  [style.--mapa-result-left]=\"fillLeft() + '%'\"\n  [style.--mapa-result-width]=\"fillWidth() + '%'\"\n  [style.--mapa-result-position]=\"badgePosition() + '%'\"\n>\n  @if (appearance() === \"stepped\") {\n    <span class=\"mapa-result-track__steps\" aria-hidden=\"true\">\n      @for (step of steps; track step) {\n        <i\n          [class.mapa-result-track__step--filled]=\"step < filledSteps()\"\n          [style.--mapa-result-step-fill]=\"stepFill(step) + '%'\"\n        ></i>\n      }\n    </span>\n    @if (showValue()) {\n      <strong class=\"mapa-result-track__value\" aria-hidden=\"true\"\n        >{{ safeValue() }}%</strong\n      >\n    }\n  } @else {\n    <span class=\"mapa-result-track__rail\" aria-hidden=\"true\">\n      @if (mode() === \"diverging\") {\n        <span class=\"mapa-result-track__midpoint\"></span>\n      }\n      <span\n        class=\"mapa-result-track__fill\"\n        [class.negative]=\"mode() === 'diverging' && direction() === 'negative'\"\n        [class.positive]=\"mode() === 'diverging' && direction() === 'positive'\"\n      ></span>\n    </span>\n    @if (showValue()) {\n      <span class=\"mapa-result-track__badge\" aria-hidden=\"true\"\n        >{{ safeValue() }}%</span\n      >\n    }\n  }\n</div>\n", styles: [".mapa-result-track{--mapa-result-badge-height: 24px;--mapa-result-fill-height: calc(var(--mapa-result-track-height, 14px) - 2px);min-height:28px;padding:10px 0 8px;position:relative}.mapa-result-track .negative{border-top-right-radius:0%;border-bottom-right-radius:0%}.mapa-result-track .positive{border-top-left-radius:0%;border-bottom-left-radius:0%}.mapa-result-track__rail{background:#e7ebed;border-radius:999px;display:block;height:var(--mapa-result-track-height, 14px);overflow:visible;position:relative}.mapa-result-track__fill{background:var(--mapa-result-color);border-radius:999px;height:var(--mapa-result-fill-height);left:var(--mapa-result-left);position:absolute;top:50%;transform:translateY(-50%);width:var(--mapa-result-width)}.mapa-result-track__midpoint{background:#aeb7bc;height:10px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:1px}.mapa-result-track__badge{align-items:center;background:#fff;border:2px solid var(--mapa-result-color);border-radius:999px;box-sizing:border-box;color:var(--mapa-result-color);display:inline-flex;font:650 10px/1 var(--mapa-font-body, \"Asap\", sans-serif);height:var(--mapa-result-badge-height);justify-content:center;left:clamp(18px,var(--mapa-result-position),100% - 18px);min-width:34px;padding:0 5px;position:absolute;text-align:center;top:6px;transform:translate(-50%);z-index:1}.mapa-result-track--plain{min-height:0;padding:0}.mapa-result-track--segmented{--mapa-result-badge-height: 22px;--mapa-result-fill-height: 12px;min-height:24px;padding:3px 0}.mapa-result-track--segmented .mapa-result-track__rail{background:repeating-linear-gradient(90deg,#fff 0 calc(20% - 1px),#d9e0e3 calc(20% - 1px) 20%);border:1px solid #d9e0e3;border-radius:0;height:18px}.mapa-result-track--segmented .mapa-result-track__fill{border-radius:0}.mapa-result-track--segmented .mapa-result-track__badge{background:#fff;border-width:1px;min-width:29px;padding:0 4px;top:50%;transform:translate(-50%,-50%)}.mapa-result-track--stepped{align-items:center;display:grid;gap:12px;grid-template-columns:minmax(0,1fr) auto;min-height:40px;padding:0;width:100%}.mapa-result-track--stepped .mapa-result-track__steps{display:grid;gap:5px;grid-template-columns:repeat(10,minmax(0,18px));min-width:0;width:100%}.mapa-result-track--stepped .mapa-result-track__steps i{background:#d8dee7;border-radius:7px;display:block;height:40px;min-width:0;overflow:hidden}.mapa-result-track--stepped .mapa-result-track__steps i:before{background:var(--mapa-result-color);content:\"\";display:block;height:100%;width:var(--mapa-result-step-fill, 0%)}.mapa-result-track--stepped .mapa-result-track__value{color:var(--mapa-result-color);font-size:17px;min-width:44px}\n"] }]
         }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], showValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValue", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
 function clamp(value) {
     if (!Number.isFinite(value))
@@ -9023,23 +9031,17 @@ class MapaReportParameterizationWidgetComponent {
         this.legend = input([], ...(ngDevMode ? [{ debugName: "legend" }] : []));
         this.palette = input('current', ...(ngDevMode ? [{ debugName: "palette" }] : []));
         this.content = input('all', ...(ngDevMode ? [{ debugName: "content" }] : []));
+        this.mode = model('summarized', ...(ngDevMode ? [{ debugName: "mode" }] : []));
         this.metadata = computed(() => (this.data().metadata ?? []).filter((item) => !!item.value?.trim()), ...(ngDevMode ? [{ debugName: "metadata" }] : []));
-        this.summaryRows = computed(() => this.data().sections.flatMap((section) => {
-            if (section.name?.trim() && this.isNumber(section.value)) {
-                return [
-                    {
-                        id: `section:${section.id}`,
-                        name: section.name,
-                        value: section.value,
-                    },
-                ];
-            }
-            return section.competences.map((competence) => ({
-                id: `competence:${competence.id}`,
-                name: competence.name,
-                value: competence.value,
-            }));
-        }), ...(ngDevMode ? [{ debugName: "summaryRows" }] : []));
+        this.summaryRows = computed(() => this.data().sections.flatMap((section) => section.competences.flatMap((competence) => this.isNumber(competence.value)
+            ? [
+                {
+                    id: `competence:${section.id}:${competence.id}`,
+                    name: competence.name,
+                    value: competence.value,
+                },
+            ]
+            : [])), ...(ngDevMode ? [{ debugName: "summaryRows" }] : []));
         this.rankingViews = computed(() => {
             const groupEntries = this.data()
                 .sections.filter((section) => !!section.name?.trim() && this.isNumber(section.value))
@@ -9115,17 +9117,19 @@ class MapaReportParameterizationWidgetComponent {
         return typeof value === 'number' && Number.isFinite(value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.21", ngImport: i0, type: MapaReportParameterizationWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.21", type: MapaReportParameterizationWidgetComponent, isStandalone: true, selector: "mapa-report-parameterization-widget", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, legend: { classPropertyName: "legend", publicName: "legend", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section class=\"mapa-report-widget\" [attr.data-palette]=\"palette()\">\n  <header class=\"mapa-report-widget__header\">\n    <div class=\"mapa-report-widget__heading\">\n      <h2>{{ heading().title }}</h2>\n      @if (heading().description) {\n        <div\n          class=\"mapa-report-widget__description\"\n          [innerHTML]=\"heading().description | safeHtml\"\n        ></div>\n      }\n    </div>\n  </header>\n\n  @if (content() !== \"ranking\") {\n    <section class=\"mapa-parameterization-overview\">\n      <div class=\"mapa-parameterization-overview__headline\">\n        <div>\n          <span class=\"mapa-parameterization-overview__eyebrow\">{{\n            heading().title\n          }}</span>\n          <h3>{{ data().name }}</h3>\n        </div>\n\n        <div class=\"mapa-parameterization-overview__score\">\n          <span>{{ i18n.texts.report.overallPercentageTitle }}</span>\n          <div\n            class=\"mapa-parameterization-segments\"\n            role=\"meter\"\n            aria-valuemin=\"0\"\n            aria-valuemax=\"100\"\n            [attr.aria-valuenow]=\"safeValue(data().value)\"\n            [attr.aria-label]=\"\n              i18n.texts.report.meterLabel(data().name, safeValue(data().value))\n            \"\n          >\n            <span\n              class=\"mapa-parameterization-segments__cells\"\n              aria-hidden=\"true\"\n            >\n              @for (segment of segments; track segment) {\n                <i\n                  [class.mapa-parameterization-segments__cell--filled]=\"\n                    segment < filledSegments(data().value)\n                  \"\n                ></i>\n              }\n            </span>\n            <strong aria-hidden=\"true\">{{ safeValue(data().value) }}%</strong>\n          </div>\n        </div>\n      </div>\n\n      @if (metadata().length) {\n        <dl class=\"mapa-parameterization-overview__metadata\">\n          @for (item of metadata(); track item.id ?? $index) {\n            <div>\n              <dt>{{ item.label }}</dt>\n              <dd>{{ item.value }}</dd>\n            </div>\n          }\n        </dl>\n      }\n    </section>\n\n    @if (legend().length) {\n      <mapa-report-legend\n        class=\"mapa-parameterization-legend\"\n        [expanded]=\"true\"\n        [groups]=\"legend()\"\n      />\n    }\n\n    @if (summaryRows().length) {\n      <section class=\"mapa-parameterization-summary\">\n        <h3>{{ i18n.texts.report.summarizedReportTitle }}</h3>\n        <div class=\"mapa-parameterization-summary__rows\">\n          @for (row of summaryRows(); track row.id) {\n            <div class=\"mapa-parameterization-summary__row\">\n              <span>{{ row.name }}</span>\n              <span\n                class=\"mapa-parameterization-summary__track\"\n                role=\"meter\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                [attr.aria-valuenow]=\"safeValue(row.value)\"\n                [attr.aria-label]=\"\n                  i18n.texts.report.meterLabel(row.name, safeValue(row.value))\n                \"\n              >\n                <i\n                  [style.width.%]=\"safeValue(row.value)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </span>\n              <strong>{{ safeValue(row.value) }}%</strong>\n            </div>\n          }\n        </div>\n      </section>\n    }\n\n    @if (data().sections.length) {\n      <section class=\"mapa-parameterization-detail\">\n        <h3>{{ i18n.texts.report.detailedReportTitle }}</h3>\n\n        <div class=\"mapa-parameterization-detail__sections\">\n          @for (section of data().sections; track section.id) {\n            <section class=\"mapa-parameterization-group\">\n              @if (section.name || section.value !== undefined) {\n                <header class=\"mapa-parameterization-group__header\">\n                  <div>\n                    @if (section.name) {\n                      <h4>{{ section.name }}</h4>\n                    }\n                    @if (section.description) {\n                      <div [innerHTML]=\"section.description | safeHtml\"></div>\n                    }\n                  </div>\n                  @if (section.value !== undefined) {\n                    <div\n                      class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                    >\n                      <span\n                        class=\"mapa-parameterization-segments__cells\"\n                        role=\"meter\"\n                        aria-valuemin=\"0\"\n                        aria-valuemax=\"100\"\n                        [attr.aria-valuenow]=\"safeValue(section.value)\"\n                        [attr.aria-label]=\"\n                          i18n.texts.report.meterLabel(\n                            section.name || i18n.texts.report.groupsTitle,\n                            safeValue(section.value)\n                          )\n                        \"\n                      >\n                        @for (segment of segments; track segment) {\n                          <i\n                            [class.mapa-parameterization-segments__cell--filled]=\"\n                              segment < filledSegments(section.value)\n                            \"\n                          ></i>\n                        }\n                      </span>\n                      <strong aria-hidden=\"true\"\n                        >{{ safeValue(section.value) }}%</strong\n                      >\n                    </div>\n                  }\n                </header>\n              }\n\n              @if (section.competences.length) {\n                <div class=\"mapa-parameterization-group__label\">\n                  {{ i18n.texts.report.competenciesAndDimensionsTitle }}\n                </div>\n\n                <div class=\"mapa-parameterization-group__grid\">\n                  @for (\n                    competence of section.competences;\n                    track competence.id\n                  ) {\n                    <article class=\"mapa-parameterization-competence\">\n                      <header class=\"mapa-parameterization-competence__header\">\n                        <h5>{{ competence.name }}</h5>\n                        <div\n                          class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                        >\n                          <span\n                            class=\"mapa-parameterization-segments__cells\"\n                            role=\"meter\"\n                            aria-valuemin=\"0\"\n                            aria-valuemax=\"100\"\n                            [attr.aria-valuenow]=\"safeValue(competence.value)\"\n                            [attr.aria-label]=\"\n                              i18n.texts.report.meterLabel(\n                                competence.name,\n                                safeValue(competence.value)\n                              )\n                            \"\n                          >\n                            @for (segment of segments; track segment) {\n                              <i\n                                [class.mapa-parameterization-segments__cell--filled]=\"\n                                  segment < filledSegments(competence.value)\n                                \"\n                              ></i>\n                            }\n                          </span>\n                          <strong aria-hidden=\"true\"\n                            >{{ safeValue(competence.value) }}%</strong\n                          >\n                        </div>\n                      </header>\n\n                      @if (competence.description) {\n                        <div\n                          class=\"mapa-parameterization-competence__description\"\n                          [innerHTML]=\"competence.description | safeHtml\"\n                        ></div>\n                      }\n\n                      @if (competence.dimensions?.length) {\n                        <ul class=\"mapa-parameterization-dimensions\">\n                          @for (\n                            dimension of competence.dimensions;\n                            track dimension.id\n                          ) {\n                            <li>\n                              <span\n                                class=\"mapa-parameterization-dimensions__name\"\n                              >\n                                <span\n                                  class=\"mapa-direction-indicator\"\n                                  [attr.aria-label]=\"\n                                    directionLabel(dimension.direction)\n                                  \"\n                                  >{{\n                                    directionArrow(dimension.direction)\n                                  }}</span\n                                >\n                                <span>{{ dimension.name }}</span>\n                              </span>\n                              @if (hasClassification(dimension)) {\n                                <mapa-classification-tag\n                                  appearance=\"solid\"\n                                  [classification]=\"dimension.classification\"\n                                />\n                              }\n                              @if (dimension.description) {\n                                <div\n                                  class=\"mapa-parameterization-dimensions__description\"\n                                  [innerHTML]=\"dimension.description | safeHtml\"\n                                ></div>\n                              }\n                            </li>\n                          }\n                        </ul>\n                      }\n                    </article>\n                  }\n                </div>\n              }\n            </section>\n          }\n        </div>\n      </section>\n    }\n  }\n\n  @if (content() !== \"report\" && rankingViews().length) {\n    <section class=\"mapa-parameterization-ranking\">\n      @if (content() === \"all\") {\n        <h3>{{ i18n.texts.report.parameterizationRankingTitle }}</h3>\n      }\n      <mapa-report-ranking-table-widget\n        [palette]=\"palette()\"\n        [showAverage]=\"false\"\n        [views]=\"rankingViews()\"\n      />\n    </section>\n  }\n</section>\n", styles: [":host{--mapa-report-accent: #ff560b;--mapa-report-accent-soft: #fff0e9;--mapa-report-surface: #fff;--mapa-report-surface-muted: #eef2f3;--mapa-report-border: #e1e5e7;--mapa-report-text: #263238;--mapa-report-muted: #68747a;--mapa-report-pill-width: 104px;--mapa-report-radius: 8px;--mapa-report-space: 20px;color:var(--mapa-report-text);display:block;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", sans-serif)}.mapa-report-widget{display:grid;gap:var(--mapa-report-space)}.mapa-report-widget__header{align-items:flex-start;column-gap:16px;display:grid;grid-template-columns:minmax(0,1fr) auto}.mapa-report-widget__heading{display:contents}.mapa-report-widget__heading h2{color:var(--mapa-report-accent);font-size:20px;font-weight:650;grid-column:1;grid-row:1;line-height:1.25;margin:0}.mapa-report-widget__description{color:var(--mapa-report-muted);font-size:13px;grid-column:1/-1;grid-row:2;line-height:1.5;margin:5px 0 0}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep p,.mapa-report-widget__description ::ng-deep ul{margin:0 0 8px}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep ul{padding-left:20px}.mapa-report-widget__description ::ng-deep li{margin:0 0 3px}.mapa-report-widget__description ::ng-deep b,.mapa-report-widget__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-report-widget__description ::ng-deep :last-child{margin-bottom:0}.mapa-report-widget__modes{--mat-button-toggle-background-color: var(--mapa-report-surface);--mat-button-toggle-divider-color: #cbd5da;--mat-button-toggle-height: 32px;--mat-button-toggle-label-text-font: var( --mapa-font-body, \"Asap\", sans-serif );--mat-button-toggle-label-text-size: 13px;--mat-button-toggle-label-text-weight: 500;--mat-button-toggle-selected-state-background-color: #59636a;--mat-button-toggle-selected-state-text-color: #fffaf7;--mat-button-toggle-shape: 4px;--mat-button-toggle-text-color: #344b5e;border:1px solid #cbd5da;border-radius:4px;grid-column:2;grid-row:1;overflow:hidden}.mapa-report-widget__modes mat-button-toggle{font:500 13px/1 var(--mapa-font-body, \"Asap\", sans-serif)}.mapa-report-widget__modes mat-icon{font-size:14px;height:14px;margin-right:5px;width:14px}.mapa-report-widget__empty{color:var(--mapa-report-muted);margin:0;padding:24px 0;text-align:center}@media(max-width:760px){.mapa-report-widget__header{align-items:stretch;grid-template-columns:minmax(0,1fr)}.mapa-report-widget__modes{grid-column:1;grid-row:3;justify-self:start;margin-top:12px}}.mapa-direction-indicator{background:var(--mapa-report-surface, var(--mapa-color-surface, #fafbfc));border:1px solid currentColor;border-radius:50%;box-sizing:border-box;color:var(--mapa-report-muted, var(--mapa-color-text-subtle, #68747a));display:inline-grid;flex:0 0 20px;font-size:11px;font-weight:700;height:20px;line-height:1;place-items:center;width:20px}:host{--mapa-parameterization-accent: #ff560b;--mapa-parameterization-rail: #dfe4ea;--mapa-parameterization-line: #e7ebee;--mapa-report-card-radius: 10px;--mapa-report-line-soft: #edf1f3;--mapa-report-surface-soft: #fafbfc}.mapa-parameterization-overview{border:1px solid var(--mapa-report-border);border-radius:16px;display:grid;gap:22px;padding:24px}.mapa-parameterization-overview__headline{align-items:start;display:grid;gap:24px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-overview__eyebrow{color:#8a95a5;display:block;font-size:12px;line-height:1.3;margin-bottom:6px;text-transform:uppercase}.mapa-parameterization-overview h3{color:#2c2e3a;font-size:24px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-overview__score{display:grid;gap:7px;min-width:290px}.mapa-parameterization-overview__score>span{color:#8a95a5;font-size:12px;text-transform:uppercase}.mapa-parameterization-overview__metadata{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));margin:0}.mapa-parameterization-overview__metadata div{border:1px solid var(--mapa-report-border);border-radius:12px;min-width:0;padding:13px 15px}.mapa-parameterization-overview__metadata dt{color:#8a95a5;font-size:11px;line-height:1.3;margin-bottom:8px;text-transform:uppercase}.mapa-parameterization-overview__metadata dd{color:#2c2e3a;font-size:15px;font-weight:650;line-height:1.35;margin:0;overflow-wrap:anywhere}.mapa-parameterization-segments{align-items:center;display:flex;gap:12px}.mapa-parameterization-segments__cells{display:grid;flex:0 0 auto;gap:5px;grid-template-columns:repeat(10,var(--mapa-parameterization-segment-width, 18px))}.mapa-parameterization-segments i{background:#d8dee7;border-radius:7px;display:block;height:40px}.mapa-parameterization-segments i.mapa-parameterization-segments__cell--filled{background:var(--mapa-parameterization-accent)}.mapa-parameterization-segments strong{color:var(--mapa-parameterization-accent);font-size:17px;min-width:44px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 10px;min-width:min(270px,100%)}.mapa-parameterization-segments--small i{border-radius:5px;height:30px}.mapa-parameterization-segments--small strong{color:#596575;font-size:14px;min-width:36px}.mapa-parameterization-legend{--mapa-classification-tag-min-width: var(--mapa-report-pill-width)}.mapa-parameterization-summary,.mapa-parameterization-detail,.mapa-parameterization-ranking{display:grid;gap:16px;min-width:0}.mapa-parameterization-summary>h3,.mapa-parameterization-detail>h3,.mapa-parameterization-ranking>h3{color:#596575;font-size:18px;font-weight:650;line-height:1.3;margin:0}.mapa-parameterization-summary__rows{border:1px solid var(--mapa-report-border);border-radius:14px;padding:16px 20px}.mapa-parameterization-summary__row{align-items:center;display:grid;gap:20px;grid-template-columns:minmax(200px,36%) minmax(140px,1fr) 48px;min-height:48px}.mapa-parameterization-summary__row+.mapa-parameterization-summary__row{border-top:1px solid var(--mapa-parameterization-line)}.mapa-parameterization-summary__row>span:first-child{color:#4f5d70;font-size:14px;line-height:1.35;overflow-wrap:anywhere}.mapa-parameterization-summary__row>strong{color:#596575;font-size:14px;text-align:right}.mapa-parameterization-summary__track{background:var(--mapa-parameterization-rail);border-radius:999px;display:block;height:14px;overflow:hidden}.mapa-parameterization-summary__track i{background:var(--mapa-parameterization-accent);border-radius:inherit;display:block;height:100%}@media(max-width:900px){.mapa-parameterization-overview__headline,.mapa-parameterization-group__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-overview__score,.mapa-parameterization-segments--small{min-width:0}.mapa-parameterization-dimensions li{grid-template-columns:minmax(150px,1fr) auto}.mapa-parameterization-dimensions__description{grid-column:1/-1;padding-left:28px}}@media(max-width:600px){.mapa-parameterization-overview,.mapa-parameterization-group{padding:16px}.mapa-parameterization-overview h3{font-size:20px}.mapa-parameterization-segments{--mapa-parameterization-segment-width: 12px;align-items:flex-end;gap:8px}.mapa-parameterization-segments__cells{gap:3px}.mapa-parameterization-segments i{height:32px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 8px}.mapa-parameterization-summary__rows{padding:8px 14px}.mapa-parameterization-summary__row{gap:9px;grid-template-columns:minmax(0,1fr) 44px;padding:10px 0}.mapa-parameterization-summary__row .mapa-parameterization-summary__track{grid-column:1/-1;grid-row:2}.mapa-parameterization-summary__row>strong{grid-column:2;grid-row:1}.mapa-parameterization-dimensions li{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-dimensions__description{grid-column:auto;padding-left:28px}}@media print{.mapa-parameterization-overview,.mapa-parameterization-group,.mapa-parameterization-competence{break-inside:avoid}}\n", ".mapa-parameterization-detail__sections{display:grid;gap:22px}.mapa-parameterization-group{--mapa-classification-tag-min-width: var(--mapa-report-pill-width);border:1px solid var(--mapa-report-border);border-radius:14px;min-width:0;padding:18px}.mapa-parameterization-group__header{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-group__header h4{color:#2c2e3a;font-size:20px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-group__header>div:first-child>div{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:5px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep p,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{padding-left:20px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep li{margin:0 0 3px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep b,.mapa-parameterization-group__header>div:first-child>div ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-group__header>div:first-child>div ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-group__label{background:#f1f4f8;border:1px solid var(--mapa-report-border);border-radius:7px;color:#405064;font-size:13px;font-weight:650;margin-top:16px;padding:7px 10px}.mapa-parameterization-group__grid{display:grid;column-gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px;row-gap:14px}.mapa-parameterization-dimensions mapa-classification-tag{flex:0 0 auto;max-width:var(--mapa-report-pill-width)}.mapa-parameterization-competence{background:var(--mapa-report-surface);border:1px solid var(--mapa-report-border);border-radius:var(--mapa-report-card-radius);min-width:0;padding:16px 14px 13px}.mapa-parameterization-competence__header{align-items:center;display:grid;gap:14px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:end;min-width:0}.mapa-parameterization-competence__header h5{color:#2c2e3a;font-size:16px;font-weight:650;line-height:1.3;margin:0;overflow-wrap:anywhere}.mapa-parameterization-competence__description{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:12px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep p,.mapa-parameterization-competence__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-competence__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-competence__description ::ng-deep b,.mapa-parameterization-competence__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-competence__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-dimensions{border-top:1px solid var(--mapa-report-line-soft);display:grid;gap:7px;list-style:none;margin:14px 0 0;padding:12px 0 0}.mapa-parameterization-dimensions li{align-items:center;background:var(--mapa-report-surface-soft);border:1px solid var(--mapa-report-line-soft);border-radius:9px;display:grid;gap:10px;grid-template-columns:minmax(0,1fr) auto;padding:9px 10px}.mapa-parameterization-dimensions__name{align-items:center;color:#4f5d70;display:flex;font-size:12px;gap:8px;line-height:1.4;min-width:0}.mapa-parameterization-dimensions__name span:last-child{overflow-wrap:anywhere}.mapa-parameterization-dimensions__description{color:var(--mapa-report-muted);font-size:11px;grid-column:1/-1;line-height:1.45;padding-left:28px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep p,.mapa-parameterization-dimensions__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-dimensions__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-dimensions__description ::ng-deep b,.mapa-parameterization-dimensions__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-dimensions__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-ranking mapa-report-ranking-table-widget{display:block;min-width:0}@media(max-width:1100px){.mapa-parameterization-group__grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:600px){.mapa-parameterization-competence__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:start}}\n"], dependencies: [{ kind: "component", type: MapaClassificationTagComponent, selector: "mapa-classification-tag", inputs: ["classification", "size", "appearance", "shape", "casing", "fallbackLabel"] }, { kind: "component", type: MapaReportLegendComponent, selector: "mapa-report-legend", inputs: ["title", "intro", "groupsTitle", "groups", "expanded", "appearance"] }, { kind: "component", type: MapaReportRankingTableWidgetComponent, selector: "mapa-report-ranking-table-widget", inputs: ["heading", "views", "view", "palette", "showAverage", "showScoreOnHover", "entryColumnLabel", "note", "averageLabel"], outputs: ["viewChange"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.21", type: MapaReportParameterizationWidgetComponent, isStandalone: true, selector: "mapa-report-parameterization-widget", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, legend: { classPropertyName: "legend", publicName: "legend", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mode: "modeChange" }, ngImport: i0, template: "<section class=\"mapa-report-widget\" [attr.data-palette]=\"palette()\">\n  <header class=\"mapa-report-widget__header\">\n    <div class=\"mapa-report-widget__heading\">\n      <h2>{{ heading().title }}</h2>\n      @if (heading().description) {\n        <div\n          class=\"mapa-report-widget__description\"\n          [innerHTML]=\"heading().description | safeHtml\"\n        ></div>\n      }\n    </div>\n    @if (content() !== \"ranking\") {\n      <mat-button-toggle-group\n        class=\"mapa-report-widget__modes\"\n        hideSingleSelectionIndicator\n        [attr.aria-label]=\"i18n.texts.report.viewModeLabel\"\n        [value]=\"mode()\"\n        (change)=\"mode.set($event.value)\"\n      >\n        <mat-button-toggle value=\"summarized\">\n          {{ i18n.texts.report.summarized }}\n        </mat-button-toggle>\n        <mat-button-toggle value=\"detailed\">\n          {{ i18n.texts.report.detailed }}\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    }\n  </header>\n\n  @if (content() !== \"ranking\") {\n    <section class=\"mapa-parameterization-overview\">\n      <div class=\"mapa-parameterization-overview__headline\">\n        <div>\n          <span class=\"mapa-parameterization-overview__eyebrow\">{{\n            heading().title\n          }}</span>\n          <h3>{{ data().name }}</h3>\n        </div>\n\n        <div class=\"mapa-parameterization-overview__score\">\n          <span>{{ i18n.texts.report.overallPercentageTitle }}</span>\n          <mapa-result-track\n            appearance=\"stepped\"\n            color=\"#59636a\"\n            [name]=\"data().name\"\n            [value]=\"data().value\"\n          />\n        </div>\n      </div>\n    </section>\n\n    @if (legend().length) {\n      <mapa-report-legend\n        class=\"mapa-parameterization-legend\"\n        appearance=\"psychosocial\"\n        [expanded]=\"true\"\n        [groups]=\"legend()\"\n      />\n    }\n\n    @if (mode() === \"summarized\" && summaryRows().length) {\n      <section class=\"mapa-parameterization-summary\">\n        <h3>{{ i18n.texts.report.summarizedReportTitle }}</h3>\n        <div class=\"mapa-parameterization-summary__rows\">\n          @for (row of summaryRows(); track row.id) {\n            <div class=\"mapa-parameterization-summary__row\">\n              <span>{{ row.name }}</span>\n              <span\n                class=\"mapa-parameterization-summary__track\"\n                role=\"meter\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                [attr.aria-valuenow]=\"safeValue(row.value)\"\n                [attr.aria-label]=\"\n                  i18n.texts.report.meterLabel(row.name, safeValue(row.value))\n                \"\n              >\n                <i\n                  [style.width.%]=\"safeValue(row.value)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </span>\n              <strong>{{ safeValue(row.value) }}%</strong>\n            </div>\n          }\n        </div>\n      </section>\n    }\n\n    @if (mode() === \"detailed\" && data().sections.length) {\n      <section class=\"mapa-parameterization-detail\">\n        <h3>{{ i18n.texts.report.detailedReportTitle }}</h3>\n\n        <div class=\"mapa-parameterization-detail__sections\">\n          @for (section of data().sections; track section.id) {\n            <section class=\"mapa-parameterization-group\">\n              @if (section.name || section.value !== undefined) {\n                <header class=\"mapa-parameterization-group__header\">\n                  <div>\n                    @if (section.name) {\n                      <h4>{{ section.name }}</h4>\n                    }\n                    @if (section.description) {\n                      <div [innerHTML]=\"section.description | safeHtml\"></div>\n                    }\n                  </div>\n                  @if (section.value !== undefined) {\n                    <div\n                      class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                    >\n                      <span\n                        class=\"mapa-parameterization-segments__cells\"\n                        role=\"meter\"\n                        aria-valuemin=\"0\"\n                        aria-valuemax=\"100\"\n                        [attr.aria-valuenow]=\"safeValue(section.value)\"\n                        [attr.aria-label]=\"\n                          i18n.texts.report.meterLabel(\n                            section.name || i18n.texts.report.groupsTitle,\n                            safeValue(section.value)\n                          )\n                        \"\n                      >\n                        @for (segment of segments; track segment) {\n                          <i\n                            [class.mapa-parameterization-segments__cell--filled]=\"\n                              segment < filledSegments(section.value)\n                            \"\n                          ></i>\n                        }\n                      </span>\n                      <strong aria-hidden=\"true\"\n                        >{{ safeValue(section.value) }}%</strong\n                      >\n                    </div>\n                  }\n                </header>\n              }\n\n              @if (section.competences.length) {\n                <div class=\"mapa-parameterization-group__label\">\n                  {{ i18n.texts.report.competenciesAndDimensionsTitle }}\n                </div>\n\n                <div class=\"mapa-parameterization-group__grid\">\n                  @for (\n                    competence of section.competences;\n                    track competence.id\n                  ) {\n                    <article class=\"mapa-parameterization-competence\">\n                      <header class=\"mapa-parameterization-competence__header\">\n                        <h5>{{ competence.name }}</h5>\n                        <div\n                          class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                        >\n                          <span\n                            class=\"mapa-parameterization-segments__cells\"\n                            role=\"meter\"\n                            aria-valuemin=\"0\"\n                            aria-valuemax=\"100\"\n                            [attr.aria-valuenow]=\"safeValue(competence.value)\"\n                            [attr.aria-label]=\"\n                              i18n.texts.report.meterLabel(\n                                competence.name,\n                                safeValue(competence.value)\n                              )\n                            \"\n                          >\n                            @for (segment of segments; track segment) {\n                              <i\n                                [class.mapa-parameterization-segments__cell--filled]=\"\n                                  segment < filledSegments(competence.value)\n                                \"\n                              ></i>\n                            }\n                          </span>\n                          <strong aria-hidden=\"true\"\n                            >{{ safeValue(competence.value) }}%</strong\n                          >\n                        </div>\n                      </header>\n\n                      @if (competence.description) {\n                        <div\n                          class=\"mapa-parameterization-competence__description\"\n                          [innerHTML]=\"competence.description | safeHtml\"\n                        ></div>\n                      }\n\n                      @if (competence.dimensions?.length) {\n                        <ul class=\"mapa-parameterization-dimensions\">\n                          @for (\n                            dimension of competence.dimensions;\n                            track dimension.id\n                          ) {\n                            <li>\n                              <span\n                                class=\"mapa-parameterization-dimensions__name\"\n                              >\n                                <span\n                                  class=\"mapa-direction-indicator\"\n                                  [attr.aria-label]=\"\n                                    directionLabel(dimension.direction)\n                                  \"\n                                  >{{\n                                    directionArrow(dimension.direction)\n                                  }}</span\n                                >\n                                <span>{{ dimension.name }}</span>\n                              </span>\n                              @if (hasClassification(dimension)) {\n                                <mapa-classification-tag\n                                  appearance=\"solid\"\n                                  [classification]=\"dimension.classification\"\n                                />\n                              }\n                              @if (dimension.description) {\n                                <div\n                                  class=\"mapa-parameterization-dimensions__description\"\n                                  [innerHTML]=\"dimension.description | safeHtml\"\n                                ></div>\n                              }\n                            </li>\n                          }\n                        </ul>\n                      }\n                    </article>\n                  }\n                </div>\n              }\n            </section>\n          }\n        </div>\n      </section>\n    }\n  }\n\n  @if (content() !== \"report\" && rankingViews().length) {\n    <section class=\"mapa-parameterization-ranking\">\n      @if (content() === \"all\") {\n        <h3>{{ i18n.texts.report.parameterizationRankingTitle }}</h3>\n      }\n      <mapa-report-ranking-table-widget\n        [palette]=\"palette()\"\n        [showAverage]=\"false\"\n        [views]=\"rankingViews()\"\n      />\n    </section>\n  }\n</section>\n", styles: [":host{--mapa-report-accent: #ff560b;--mapa-report-accent-soft: #fff0e9;--mapa-report-surface: #fff;--mapa-report-surface-muted: #eef2f3;--mapa-report-border: #e1e5e7;--mapa-report-text: #263238;--mapa-report-muted: #68747a;--mapa-report-pill-width: 104px;--mapa-report-radius: 8px;--mapa-report-space: 20px;color:var(--mapa-report-text);display:block;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", sans-serif)}.mapa-report-widget{display:grid;gap:var(--mapa-report-space)}.mapa-report-widget__header{align-items:flex-start;column-gap:16px;display:grid;grid-template-columns:minmax(0,1fr) auto}.mapa-report-widget__heading{display:contents}.mapa-report-widget__heading h2{color:var(--mapa-report-accent);font-size:20px;font-weight:650;grid-column:1;grid-row:1;line-height:1.25;margin:0}.mapa-report-widget__description{color:var(--mapa-report-muted);font-size:13px;grid-column:1/-1;grid-row:2;line-height:1.5;margin:5px 0 0}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep p,.mapa-report-widget__description ::ng-deep ul{margin:0 0 8px}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep ul{padding-left:20px}.mapa-report-widget__description ::ng-deep li{margin:0 0 3px}.mapa-report-widget__description ::ng-deep b,.mapa-report-widget__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-report-widget__description ::ng-deep :last-child{margin-bottom:0}.mapa-report-widget__modes{--mat-button-toggle-background-color: var(--mapa-report-surface);--mat-button-toggle-divider-color: #cbd5da;--mat-button-toggle-height: 32px;--mat-button-toggle-label-text-font: var( --mapa-font-body, \"Asap\", sans-serif );--mat-button-toggle-label-text-size: 13px;--mat-button-toggle-label-text-weight: 500;--mat-button-toggle-selected-state-background-color: #59636a;--mat-button-toggle-selected-state-text-color: #fffaf7;--mat-button-toggle-shape: 4px;--mat-button-toggle-text-color: #344b5e;border:1px solid #cbd5da;border-radius:4px;grid-column:2;grid-row:1;overflow:hidden}.mapa-report-widget__modes mat-button-toggle{font:500 13px/1 var(--mapa-font-body, \"Asap\", sans-serif)}.mapa-report-widget__modes mat-icon{font-size:14px;height:14px;margin-right:5px;width:14px}.mapa-report-widget__empty{color:var(--mapa-report-muted);margin:0;padding:24px 0;text-align:center}@media(max-width:760px){.mapa-report-widget__header{align-items:stretch;grid-template-columns:minmax(0,1fr)}.mapa-report-widget__modes{grid-column:1;grid-row:3;justify-self:start;margin-top:12px}}.mapa-direction-indicator{background:var(--mapa-report-surface, var(--mapa-color-surface, #fafbfc));border:1px solid currentColor;border-radius:50%;box-sizing:border-box;color:var(--mapa-report-muted, var(--mapa-color-text-subtle, #68747a));display:inline-grid;flex:0 0 20px;font-size:11px;font-weight:700;height:20px;line-height:1;place-items:center;width:20px}:host{--mapa-parameterization-accent: #59636a;--mapa-parameterization-rail: #dfe4ea;--mapa-parameterization-line: #e7ebee;--mapa-report-card-radius: 10px;--mapa-report-line-soft: #edf1f3;--mapa-report-surface-soft: #fafbfc}.mapa-parameterization-overview{border:1px solid var(--mapa-report-border);border-radius:16px;display:grid;gap:22px;padding:24px}.mapa-parameterization-overview__headline{align-items:start;display:grid;gap:24px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-overview__eyebrow{color:#8a95a5;display:block;font-size:12px;line-height:1.3;margin-bottom:6px;text-transform:uppercase}.mapa-parameterization-overview h3{color:#2c2e3a;font-size:24px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-overview__score{display:grid;gap:7px;min-width:290px}.mapa-parameterization-overview__score mapa-result-track{display:block;min-width:0;width:100%}.mapa-parameterization-overview__score>span{color:#8a95a5;font-size:12px;text-transform:uppercase}.mapa-parameterization-overview__metadata{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));margin:0}.mapa-parameterization-overview__metadata div{border:1px solid var(--mapa-report-border);border-radius:12px;min-width:0;padding:13px 15px}.mapa-parameterization-overview__metadata dt{color:#8a95a5;font-size:11px;line-height:1.3;margin-bottom:8px;text-transform:uppercase}.mapa-parameterization-overview__metadata dd{color:#2c2e3a;font-size:15px;font-weight:650;line-height:1.35;margin:0;overflow-wrap:anywhere}.mapa-parameterization-segments{align-items:center;display:flex;gap:12px}.mapa-parameterization-segments__cells{display:grid;flex:0 0 auto;gap:5px;grid-template-columns:repeat(10,var(--mapa-parameterization-segment-width, 18px))}.mapa-parameterization-segments i{background:#d8dee7;border-radius:7px;display:block;height:40px}.mapa-parameterization-segments i.mapa-parameterization-segments__cell--filled{background:var(--mapa-parameterization-accent)}.mapa-parameterization-segments strong{color:var(--mapa-parameterization-accent);font-size:17px;min-width:44px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 10px;min-width:min(270px,100%)}.mapa-parameterization-segments--small i{border-radius:5px;height:30px}.mapa-parameterization-segments--small strong{color:#596575;font-size:14px;min-width:36px}.mapa-parameterization-legend{--mapa-classification-tag-min-width: var(--mapa-report-pill-width)}.mapa-parameterization-summary,.mapa-parameterization-detail,.mapa-parameterization-ranking{display:grid;gap:16px;min-width:0}.mapa-parameterization-summary>h3,.mapa-parameterization-detail>h3,.mapa-parameterization-ranking>h3{color:#596575;font-size:18px;font-weight:650;line-height:1.3;margin:0}.mapa-parameterization-summary__rows{border:1px solid var(--mapa-report-border);border-radius:14px;padding:16px 20px}.mapa-parameterization-summary__row{align-items:center;display:grid;gap:20px;grid-template-columns:minmax(200px,36%) minmax(140px,1fr) 48px;min-height:48px}.mapa-parameterization-summary__row+.mapa-parameterization-summary__row{border-top:1px solid var(--mapa-parameterization-line)}.mapa-parameterization-summary__row>span:first-child{color:#4f5d70;font-size:14px;line-height:1.35;overflow-wrap:anywhere}.mapa-parameterization-summary__row>strong{color:#596575;font-size:14px;text-align:right}.mapa-parameterization-summary__track{background:var(--mapa-parameterization-rail);border-radius:999px;display:block;height:14px;overflow:hidden}.mapa-parameterization-summary__track i{background:var(--mapa-parameterization-accent);border-radius:inherit;display:block;height:100%}@media(max-width:900px){.mapa-parameterization-overview__headline,.mapa-parameterization-group__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-overview__score,.mapa-parameterization-segments--small{min-width:0}.mapa-parameterization-dimensions li{grid-template-columns:minmax(150px,1fr) auto}.mapa-parameterization-dimensions__description{grid-column:1/-1;padding-left:28px}}@media(max-width:600px){.mapa-parameterization-overview,.mapa-parameterization-group{padding:16px}.mapa-parameterization-overview h3{font-size:20px}.mapa-parameterization-segments{--mapa-parameterization-segment-width: 12px;align-items:flex-end;gap:8px}.mapa-parameterization-segments__cells{gap:3px}.mapa-parameterization-segments i{height:32px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 8px}.mapa-parameterization-summary__rows{padding:8px 14px}.mapa-parameterization-summary__row{gap:9px;grid-template-columns:minmax(0,1fr) 44px;padding:10px 0}.mapa-parameterization-summary__row .mapa-parameterization-summary__track{grid-column:1/-1;grid-row:2}.mapa-parameterization-summary__row>strong{grid-column:2;grid-row:1}.mapa-parameterization-dimensions li{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-dimensions__description{grid-column:auto;padding-left:28px}}@media print{.mapa-parameterization-overview,.mapa-parameterization-group,.mapa-parameterization-competence{break-inside:avoid}}\n", ".mapa-parameterization-detail__sections{display:grid;gap:22px}.mapa-parameterization-group{--mapa-classification-tag-min-width: var(--mapa-report-pill-width);border:1px solid var(--mapa-report-border);border-radius:14px;min-width:0;padding:18px}.mapa-parameterization-group__header{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-group__header h4{color:#2c2e3a;font-size:20px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-group__header>div:first-child>div{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:5px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep p,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{padding-left:20px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep li{margin:0 0 3px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep b,.mapa-parameterization-group__header>div:first-child>div ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-group__header>div:first-child>div ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-group__label{background:#f1f4f8;border:1px solid var(--mapa-report-border);border-radius:7px;color:#405064;font-size:13px;font-weight:650;margin-top:16px;padding:7px 10px}.mapa-parameterization-group__grid{display:grid;column-gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px;row-gap:14px}.mapa-parameterization-dimensions mapa-classification-tag{flex:0 0 auto;max-width:var(--mapa-report-pill-width)}.mapa-parameterization-competence{background:var(--mapa-report-surface);border:1px solid var(--mapa-report-border);border-radius:var(--mapa-report-card-radius);min-width:0;padding:16px 14px 13px}.mapa-parameterization-competence__header{align-items:center;display:grid;gap:14px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:end;min-width:0}.mapa-parameterization-competence__header h5{color:#2c2e3a;font-size:16px;font-weight:650;line-height:1.3;margin:0;overflow-wrap:anywhere}.mapa-parameterization-competence__description{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:12px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep p,.mapa-parameterization-competence__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-competence__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-competence__description ::ng-deep b,.mapa-parameterization-competence__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-competence__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-dimensions{border-top:1px solid var(--mapa-report-line-soft);display:grid;gap:7px;list-style:none;margin:14px 0 0;padding:12px 0 0}.mapa-parameterization-dimensions li{align-items:center;background:var(--mapa-report-surface-soft);border:1px solid var(--mapa-report-line-soft);border-radius:9px;display:grid;gap:10px;grid-template-columns:minmax(0,1fr) auto;padding:9px 10px}.mapa-parameterization-dimensions__name{align-items:center;color:#4f5d70;display:flex;font-size:12px;gap:8px;line-height:1.4;min-width:0}.mapa-parameterization-dimensions__name span:last-child{overflow-wrap:anywhere}.mapa-parameterization-dimensions__description{color:var(--mapa-report-muted);font-size:11px;grid-column:1/-1;line-height:1.45;padding-left:28px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep p,.mapa-parameterization-dimensions__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-dimensions__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-dimensions__description ::ng-deep b,.mapa-parameterization-dimensions__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-dimensions__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-ranking mapa-report-ranking-table-widget{display:block;min-width:0}@media(max-width:1100px){.mapa-parameterization-group__grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:600px){.mapa-parameterization-competence__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:start}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$6.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$6.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: MapaClassificationTagComponent, selector: "mapa-classification-tag", inputs: ["classification", "size", "appearance", "shape", "casing", "fallbackLabel"] }, { kind: "component", type: MapaReportLegendComponent, selector: "mapa-report-legend", inputs: ["title", "intro", "groupsTitle", "groups", "expanded", "appearance"] }, { kind: "component", type: MapaReportRankingTableWidgetComponent, selector: "mapa-report-ranking-table-widget", inputs: ["heading", "views", "view", "palette", "showAverage", "showScoreOnHover", "entryColumnLabel", "note", "averageLabel"], outputs: ["viewChange"] }, { kind: "component", type: MapaResultTrackComponent, selector: "mapa-result-track", inputs: ["name", "value", "color", "mode", "appearance", "direction", "showValue", "ariaLabel"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.21", ngImport: i0, type: MapaReportParameterizationWidgetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mapa-report-parameterization-widget', standalone: true, imports: [
+                        MatButtonToggleModule,
                         MapaClassificationTagComponent,
                         MapaReportLegendComponent,
                         MapaReportRankingTableWidgetComponent,
+                        MapaResultTrackComponent,
                         SafeHtmlPipe,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"mapa-report-widget\" [attr.data-palette]=\"palette()\">\n  <header class=\"mapa-report-widget__header\">\n    <div class=\"mapa-report-widget__heading\">\n      <h2>{{ heading().title }}</h2>\n      @if (heading().description) {\n        <div\n          class=\"mapa-report-widget__description\"\n          [innerHTML]=\"heading().description | safeHtml\"\n        ></div>\n      }\n    </div>\n  </header>\n\n  @if (content() !== \"ranking\") {\n    <section class=\"mapa-parameterization-overview\">\n      <div class=\"mapa-parameterization-overview__headline\">\n        <div>\n          <span class=\"mapa-parameterization-overview__eyebrow\">{{\n            heading().title\n          }}</span>\n          <h3>{{ data().name }}</h3>\n        </div>\n\n        <div class=\"mapa-parameterization-overview__score\">\n          <span>{{ i18n.texts.report.overallPercentageTitle }}</span>\n          <div\n            class=\"mapa-parameterization-segments\"\n            role=\"meter\"\n            aria-valuemin=\"0\"\n            aria-valuemax=\"100\"\n            [attr.aria-valuenow]=\"safeValue(data().value)\"\n            [attr.aria-label]=\"\n              i18n.texts.report.meterLabel(data().name, safeValue(data().value))\n            \"\n          >\n            <span\n              class=\"mapa-parameterization-segments__cells\"\n              aria-hidden=\"true\"\n            >\n              @for (segment of segments; track segment) {\n                <i\n                  [class.mapa-parameterization-segments__cell--filled]=\"\n                    segment < filledSegments(data().value)\n                  \"\n                ></i>\n              }\n            </span>\n            <strong aria-hidden=\"true\">{{ safeValue(data().value) }}%</strong>\n          </div>\n        </div>\n      </div>\n\n      @if (metadata().length) {\n        <dl class=\"mapa-parameterization-overview__metadata\">\n          @for (item of metadata(); track item.id ?? $index) {\n            <div>\n              <dt>{{ item.label }}</dt>\n              <dd>{{ item.value }}</dd>\n            </div>\n          }\n        </dl>\n      }\n    </section>\n\n    @if (legend().length) {\n      <mapa-report-legend\n        class=\"mapa-parameterization-legend\"\n        [expanded]=\"true\"\n        [groups]=\"legend()\"\n      />\n    }\n\n    @if (summaryRows().length) {\n      <section class=\"mapa-parameterization-summary\">\n        <h3>{{ i18n.texts.report.summarizedReportTitle }}</h3>\n        <div class=\"mapa-parameterization-summary__rows\">\n          @for (row of summaryRows(); track row.id) {\n            <div class=\"mapa-parameterization-summary__row\">\n              <span>{{ row.name }}</span>\n              <span\n                class=\"mapa-parameterization-summary__track\"\n                role=\"meter\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                [attr.aria-valuenow]=\"safeValue(row.value)\"\n                [attr.aria-label]=\"\n                  i18n.texts.report.meterLabel(row.name, safeValue(row.value))\n                \"\n              >\n                <i\n                  [style.width.%]=\"safeValue(row.value)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </span>\n              <strong>{{ safeValue(row.value) }}%</strong>\n            </div>\n          }\n        </div>\n      </section>\n    }\n\n    @if (data().sections.length) {\n      <section class=\"mapa-parameterization-detail\">\n        <h3>{{ i18n.texts.report.detailedReportTitle }}</h3>\n\n        <div class=\"mapa-parameterization-detail__sections\">\n          @for (section of data().sections; track section.id) {\n            <section class=\"mapa-parameterization-group\">\n              @if (section.name || section.value !== undefined) {\n                <header class=\"mapa-parameterization-group__header\">\n                  <div>\n                    @if (section.name) {\n                      <h4>{{ section.name }}</h4>\n                    }\n                    @if (section.description) {\n                      <div [innerHTML]=\"section.description | safeHtml\"></div>\n                    }\n                  </div>\n                  @if (section.value !== undefined) {\n                    <div\n                      class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                    >\n                      <span\n                        class=\"mapa-parameterization-segments__cells\"\n                        role=\"meter\"\n                        aria-valuemin=\"0\"\n                        aria-valuemax=\"100\"\n                        [attr.aria-valuenow]=\"safeValue(section.value)\"\n                        [attr.aria-label]=\"\n                          i18n.texts.report.meterLabel(\n                            section.name || i18n.texts.report.groupsTitle,\n                            safeValue(section.value)\n                          )\n                        \"\n                      >\n                        @for (segment of segments; track segment) {\n                          <i\n                            [class.mapa-parameterization-segments__cell--filled]=\"\n                              segment < filledSegments(section.value)\n                            \"\n                          ></i>\n                        }\n                      </span>\n                      <strong aria-hidden=\"true\"\n                        >{{ safeValue(section.value) }}%</strong\n                      >\n                    </div>\n                  }\n                </header>\n              }\n\n              @if (section.competences.length) {\n                <div class=\"mapa-parameterization-group__label\">\n                  {{ i18n.texts.report.competenciesAndDimensionsTitle }}\n                </div>\n\n                <div class=\"mapa-parameterization-group__grid\">\n                  @for (\n                    competence of section.competences;\n                    track competence.id\n                  ) {\n                    <article class=\"mapa-parameterization-competence\">\n                      <header class=\"mapa-parameterization-competence__header\">\n                        <h5>{{ competence.name }}</h5>\n                        <div\n                          class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                        >\n                          <span\n                            class=\"mapa-parameterization-segments__cells\"\n                            role=\"meter\"\n                            aria-valuemin=\"0\"\n                            aria-valuemax=\"100\"\n                            [attr.aria-valuenow]=\"safeValue(competence.value)\"\n                            [attr.aria-label]=\"\n                              i18n.texts.report.meterLabel(\n                                competence.name,\n                                safeValue(competence.value)\n                              )\n                            \"\n                          >\n                            @for (segment of segments; track segment) {\n                              <i\n                                [class.mapa-parameterization-segments__cell--filled]=\"\n                                  segment < filledSegments(competence.value)\n                                \"\n                              ></i>\n                            }\n                          </span>\n                          <strong aria-hidden=\"true\"\n                            >{{ safeValue(competence.value) }}%</strong\n                          >\n                        </div>\n                      </header>\n\n                      @if (competence.description) {\n                        <div\n                          class=\"mapa-parameterization-competence__description\"\n                          [innerHTML]=\"competence.description | safeHtml\"\n                        ></div>\n                      }\n\n                      @if (competence.dimensions?.length) {\n                        <ul class=\"mapa-parameterization-dimensions\">\n                          @for (\n                            dimension of competence.dimensions;\n                            track dimension.id\n                          ) {\n                            <li>\n                              <span\n                                class=\"mapa-parameterization-dimensions__name\"\n                              >\n                                <span\n                                  class=\"mapa-direction-indicator\"\n                                  [attr.aria-label]=\"\n                                    directionLabel(dimension.direction)\n                                  \"\n                                  >{{\n                                    directionArrow(dimension.direction)\n                                  }}</span\n                                >\n                                <span>{{ dimension.name }}</span>\n                              </span>\n                              @if (hasClassification(dimension)) {\n                                <mapa-classification-tag\n                                  appearance=\"solid\"\n                                  [classification]=\"dimension.classification\"\n                                />\n                              }\n                              @if (dimension.description) {\n                                <div\n                                  class=\"mapa-parameterization-dimensions__description\"\n                                  [innerHTML]=\"dimension.description | safeHtml\"\n                                ></div>\n                              }\n                            </li>\n                          }\n                        </ul>\n                      }\n                    </article>\n                  }\n                </div>\n              }\n            </section>\n          }\n        </div>\n      </section>\n    }\n  }\n\n  @if (content() !== \"report\" && rankingViews().length) {\n    <section class=\"mapa-parameterization-ranking\">\n      @if (content() === \"all\") {\n        <h3>{{ i18n.texts.report.parameterizationRankingTitle }}</h3>\n      }\n      <mapa-report-ranking-table-widget\n        [palette]=\"palette()\"\n        [showAverage]=\"false\"\n        [views]=\"rankingViews()\"\n      />\n    </section>\n  }\n</section>\n", styles: [":host{--mapa-report-accent: #ff560b;--mapa-report-accent-soft: #fff0e9;--mapa-report-surface: #fff;--mapa-report-surface-muted: #eef2f3;--mapa-report-border: #e1e5e7;--mapa-report-text: #263238;--mapa-report-muted: #68747a;--mapa-report-pill-width: 104px;--mapa-report-radius: 8px;--mapa-report-space: 20px;color:var(--mapa-report-text);display:block;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", sans-serif)}.mapa-report-widget{display:grid;gap:var(--mapa-report-space)}.mapa-report-widget__header{align-items:flex-start;column-gap:16px;display:grid;grid-template-columns:minmax(0,1fr) auto}.mapa-report-widget__heading{display:contents}.mapa-report-widget__heading h2{color:var(--mapa-report-accent);font-size:20px;font-weight:650;grid-column:1;grid-row:1;line-height:1.25;margin:0}.mapa-report-widget__description{color:var(--mapa-report-muted);font-size:13px;grid-column:1/-1;grid-row:2;line-height:1.5;margin:5px 0 0}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep p,.mapa-report-widget__description ::ng-deep ul{margin:0 0 8px}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep ul{padding-left:20px}.mapa-report-widget__description ::ng-deep li{margin:0 0 3px}.mapa-report-widget__description ::ng-deep b,.mapa-report-widget__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-report-widget__description ::ng-deep :last-child{margin-bottom:0}.mapa-report-widget__modes{--mat-button-toggle-background-color: var(--mapa-report-surface);--mat-button-toggle-divider-color: #cbd5da;--mat-button-toggle-height: 32px;--mat-button-toggle-label-text-font: var( --mapa-font-body, \"Asap\", sans-serif );--mat-button-toggle-label-text-size: 13px;--mat-button-toggle-label-text-weight: 500;--mat-button-toggle-selected-state-background-color: #59636a;--mat-button-toggle-selected-state-text-color: #fffaf7;--mat-button-toggle-shape: 4px;--mat-button-toggle-text-color: #344b5e;border:1px solid #cbd5da;border-radius:4px;grid-column:2;grid-row:1;overflow:hidden}.mapa-report-widget__modes mat-button-toggle{font:500 13px/1 var(--mapa-font-body, \"Asap\", sans-serif)}.mapa-report-widget__modes mat-icon{font-size:14px;height:14px;margin-right:5px;width:14px}.mapa-report-widget__empty{color:var(--mapa-report-muted);margin:0;padding:24px 0;text-align:center}@media(max-width:760px){.mapa-report-widget__header{align-items:stretch;grid-template-columns:minmax(0,1fr)}.mapa-report-widget__modes{grid-column:1;grid-row:3;justify-self:start;margin-top:12px}}.mapa-direction-indicator{background:var(--mapa-report-surface, var(--mapa-color-surface, #fafbfc));border:1px solid currentColor;border-radius:50%;box-sizing:border-box;color:var(--mapa-report-muted, var(--mapa-color-text-subtle, #68747a));display:inline-grid;flex:0 0 20px;font-size:11px;font-weight:700;height:20px;line-height:1;place-items:center;width:20px}:host{--mapa-parameterization-accent: #ff560b;--mapa-parameterization-rail: #dfe4ea;--mapa-parameterization-line: #e7ebee;--mapa-report-card-radius: 10px;--mapa-report-line-soft: #edf1f3;--mapa-report-surface-soft: #fafbfc}.mapa-parameterization-overview{border:1px solid var(--mapa-report-border);border-radius:16px;display:grid;gap:22px;padding:24px}.mapa-parameterization-overview__headline{align-items:start;display:grid;gap:24px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-overview__eyebrow{color:#8a95a5;display:block;font-size:12px;line-height:1.3;margin-bottom:6px;text-transform:uppercase}.mapa-parameterization-overview h3{color:#2c2e3a;font-size:24px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-overview__score{display:grid;gap:7px;min-width:290px}.mapa-parameterization-overview__score>span{color:#8a95a5;font-size:12px;text-transform:uppercase}.mapa-parameterization-overview__metadata{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));margin:0}.mapa-parameterization-overview__metadata div{border:1px solid var(--mapa-report-border);border-radius:12px;min-width:0;padding:13px 15px}.mapa-parameterization-overview__metadata dt{color:#8a95a5;font-size:11px;line-height:1.3;margin-bottom:8px;text-transform:uppercase}.mapa-parameterization-overview__metadata dd{color:#2c2e3a;font-size:15px;font-weight:650;line-height:1.35;margin:0;overflow-wrap:anywhere}.mapa-parameterization-segments{align-items:center;display:flex;gap:12px}.mapa-parameterization-segments__cells{display:grid;flex:0 0 auto;gap:5px;grid-template-columns:repeat(10,var(--mapa-parameterization-segment-width, 18px))}.mapa-parameterization-segments i{background:#d8dee7;border-radius:7px;display:block;height:40px}.mapa-parameterization-segments i.mapa-parameterization-segments__cell--filled{background:var(--mapa-parameterization-accent)}.mapa-parameterization-segments strong{color:var(--mapa-parameterization-accent);font-size:17px;min-width:44px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 10px;min-width:min(270px,100%)}.mapa-parameterization-segments--small i{border-radius:5px;height:30px}.mapa-parameterization-segments--small strong{color:#596575;font-size:14px;min-width:36px}.mapa-parameterization-legend{--mapa-classification-tag-min-width: var(--mapa-report-pill-width)}.mapa-parameterization-summary,.mapa-parameterization-detail,.mapa-parameterization-ranking{display:grid;gap:16px;min-width:0}.mapa-parameterization-summary>h3,.mapa-parameterization-detail>h3,.mapa-parameterization-ranking>h3{color:#596575;font-size:18px;font-weight:650;line-height:1.3;margin:0}.mapa-parameterization-summary__rows{border:1px solid var(--mapa-report-border);border-radius:14px;padding:16px 20px}.mapa-parameterization-summary__row{align-items:center;display:grid;gap:20px;grid-template-columns:minmax(200px,36%) minmax(140px,1fr) 48px;min-height:48px}.mapa-parameterization-summary__row+.mapa-parameterization-summary__row{border-top:1px solid var(--mapa-parameterization-line)}.mapa-parameterization-summary__row>span:first-child{color:#4f5d70;font-size:14px;line-height:1.35;overflow-wrap:anywhere}.mapa-parameterization-summary__row>strong{color:#596575;font-size:14px;text-align:right}.mapa-parameterization-summary__track{background:var(--mapa-parameterization-rail);border-radius:999px;display:block;height:14px;overflow:hidden}.mapa-parameterization-summary__track i{background:var(--mapa-parameterization-accent);border-radius:inherit;display:block;height:100%}@media(max-width:900px){.mapa-parameterization-overview__headline,.mapa-parameterization-group__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-overview__score,.mapa-parameterization-segments--small{min-width:0}.mapa-parameterization-dimensions li{grid-template-columns:minmax(150px,1fr) auto}.mapa-parameterization-dimensions__description{grid-column:1/-1;padding-left:28px}}@media(max-width:600px){.mapa-parameterization-overview,.mapa-parameterization-group{padding:16px}.mapa-parameterization-overview h3{font-size:20px}.mapa-parameterization-segments{--mapa-parameterization-segment-width: 12px;align-items:flex-end;gap:8px}.mapa-parameterization-segments__cells{gap:3px}.mapa-parameterization-segments i{height:32px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 8px}.mapa-parameterization-summary__rows{padding:8px 14px}.mapa-parameterization-summary__row{gap:9px;grid-template-columns:minmax(0,1fr) 44px;padding:10px 0}.mapa-parameterization-summary__row .mapa-parameterization-summary__track{grid-column:1/-1;grid-row:2}.mapa-parameterization-summary__row>strong{grid-column:2;grid-row:1}.mapa-parameterization-dimensions li{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-dimensions__description{grid-column:auto;padding-left:28px}}@media print{.mapa-parameterization-overview,.mapa-parameterization-group,.mapa-parameterization-competence{break-inside:avoid}}\n", ".mapa-parameterization-detail__sections{display:grid;gap:22px}.mapa-parameterization-group{--mapa-classification-tag-min-width: var(--mapa-report-pill-width);border:1px solid var(--mapa-report-border);border-radius:14px;min-width:0;padding:18px}.mapa-parameterization-group__header{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-group__header h4{color:#2c2e3a;font-size:20px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-group__header>div:first-child>div{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:5px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep p,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{padding-left:20px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep li{margin:0 0 3px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep b,.mapa-parameterization-group__header>div:first-child>div ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-group__header>div:first-child>div ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-group__label{background:#f1f4f8;border:1px solid var(--mapa-report-border);border-radius:7px;color:#405064;font-size:13px;font-weight:650;margin-top:16px;padding:7px 10px}.mapa-parameterization-group__grid{display:grid;column-gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px;row-gap:14px}.mapa-parameterization-dimensions mapa-classification-tag{flex:0 0 auto;max-width:var(--mapa-report-pill-width)}.mapa-parameterization-competence{background:var(--mapa-report-surface);border:1px solid var(--mapa-report-border);border-radius:var(--mapa-report-card-radius);min-width:0;padding:16px 14px 13px}.mapa-parameterization-competence__header{align-items:center;display:grid;gap:14px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:end;min-width:0}.mapa-parameterization-competence__header h5{color:#2c2e3a;font-size:16px;font-weight:650;line-height:1.3;margin:0;overflow-wrap:anywhere}.mapa-parameterization-competence__description{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:12px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep p,.mapa-parameterization-competence__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-competence__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-competence__description ::ng-deep b,.mapa-parameterization-competence__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-competence__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-dimensions{border-top:1px solid var(--mapa-report-line-soft);display:grid;gap:7px;list-style:none;margin:14px 0 0;padding:12px 0 0}.mapa-parameterization-dimensions li{align-items:center;background:var(--mapa-report-surface-soft);border:1px solid var(--mapa-report-line-soft);border-radius:9px;display:grid;gap:10px;grid-template-columns:minmax(0,1fr) auto;padding:9px 10px}.mapa-parameterization-dimensions__name{align-items:center;color:#4f5d70;display:flex;font-size:12px;gap:8px;line-height:1.4;min-width:0}.mapa-parameterization-dimensions__name span:last-child{overflow-wrap:anywhere}.mapa-parameterization-dimensions__description{color:var(--mapa-report-muted);font-size:11px;grid-column:1/-1;line-height:1.45;padding-left:28px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep p,.mapa-parameterization-dimensions__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-dimensions__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-dimensions__description ::ng-deep b,.mapa-parameterization-dimensions__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-dimensions__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-ranking mapa-report-ranking-table-widget{display:block;min-width:0}@media(max-width:1100px){.mapa-parameterization-group__grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:600px){.mapa-parameterization-competence__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:start}}\n"] }]
-        }], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], legend: [{ type: i0.Input, args: [{ isSignal: true, alias: "legend", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }] } });
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"mapa-report-widget\" [attr.data-palette]=\"palette()\">\n  <header class=\"mapa-report-widget__header\">\n    <div class=\"mapa-report-widget__heading\">\n      <h2>{{ heading().title }}</h2>\n      @if (heading().description) {\n        <div\n          class=\"mapa-report-widget__description\"\n          [innerHTML]=\"heading().description | safeHtml\"\n        ></div>\n      }\n    </div>\n    @if (content() !== \"ranking\") {\n      <mat-button-toggle-group\n        class=\"mapa-report-widget__modes\"\n        hideSingleSelectionIndicator\n        [attr.aria-label]=\"i18n.texts.report.viewModeLabel\"\n        [value]=\"mode()\"\n        (change)=\"mode.set($event.value)\"\n      >\n        <mat-button-toggle value=\"summarized\">\n          {{ i18n.texts.report.summarized }}\n        </mat-button-toggle>\n        <mat-button-toggle value=\"detailed\">\n          {{ i18n.texts.report.detailed }}\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    }\n  </header>\n\n  @if (content() !== \"ranking\") {\n    <section class=\"mapa-parameterization-overview\">\n      <div class=\"mapa-parameterization-overview__headline\">\n        <div>\n          <span class=\"mapa-parameterization-overview__eyebrow\">{{\n            heading().title\n          }}</span>\n          <h3>{{ data().name }}</h3>\n        </div>\n\n        <div class=\"mapa-parameterization-overview__score\">\n          <span>{{ i18n.texts.report.overallPercentageTitle }}</span>\n          <mapa-result-track\n            appearance=\"stepped\"\n            color=\"#59636a\"\n            [name]=\"data().name\"\n            [value]=\"data().value\"\n          />\n        </div>\n      </div>\n    </section>\n\n    @if (legend().length) {\n      <mapa-report-legend\n        class=\"mapa-parameterization-legend\"\n        appearance=\"psychosocial\"\n        [expanded]=\"true\"\n        [groups]=\"legend()\"\n      />\n    }\n\n    @if (mode() === \"summarized\" && summaryRows().length) {\n      <section class=\"mapa-parameterization-summary\">\n        <h3>{{ i18n.texts.report.summarizedReportTitle }}</h3>\n        <div class=\"mapa-parameterization-summary__rows\">\n          @for (row of summaryRows(); track row.id) {\n            <div class=\"mapa-parameterization-summary__row\">\n              <span>{{ row.name }}</span>\n              <span\n                class=\"mapa-parameterization-summary__track\"\n                role=\"meter\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                [attr.aria-valuenow]=\"safeValue(row.value)\"\n                [attr.aria-label]=\"\n                  i18n.texts.report.meterLabel(row.name, safeValue(row.value))\n                \"\n              >\n                <i\n                  [style.width.%]=\"safeValue(row.value)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </span>\n              <strong>{{ safeValue(row.value) }}%</strong>\n            </div>\n          }\n        </div>\n      </section>\n    }\n\n    @if (mode() === \"detailed\" && data().sections.length) {\n      <section class=\"mapa-parameterization-detail\">\n        <h3>{{ i18n.texts.report.detailedReportTitle }}</h3>\n\n        <div class=\"mapa-parameterization-detail__sections\">\n          @for (section of data().sections; track section.id) {\n            <section class=\"mapa-parameterization-group\">\n              @if (section.name || section.value !== undefined) {\n                <header class=\"mapa-parameterization-group__header\">\n                  <div>\n                    @if (section.name) {\n                      <h4>{{ section.name }}</h4>\n                    }\n                    @if (section.description) {\n                      <div [innerHTML]=\"section.description | safeHtml\"></div>\n                    }\n                  </div>\n                  @if (section.value !== undefined) {\n                    <div\n                      class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                    >\n                      <span\n                        class=\"mapa-parameterization-segments__cells\"\n                        role=\"meter\"\n                        aria-valuemin=\"0\"\n                        aria-valuemax=\"100\"\n                        [attr.aria-valuenow]=\"safeValue(section.value)\"\n                        [attr.aria-label]=\"\n                          i18n.texts.report.meterLabel(\n                            section.name || i18n.texts.report.groupsTitle,\n                            safeValue(section.value)\n                          )\n                        \"\n                      >\n                        @for (segment of segments; track segment) {\n                          <i\n                            [class.mapa-parameterization-segments__cell--filled]=\"\n                              segment < filledSegments(section.value)\n                            \"\n                          ></i>\n                        }\n                      </span>\n                      <strong aria-hidden=\"true\"\n                        >{{ safeValue(section.value) }}%</strong\n                      >\n                    </div>\n                  }\n                </header>\n              }\n\n              @if (section.competences.length) {\n                <div class=\"mapa-parameterization-group__label\">\n                  {{ i18n.texts.report.competenciesAndDimensionsTitle }}\n                </div>\n\n                <div class=\"mapa-parameterization-group__grid\">\n                  @for (\n                    competence of section.competences;\n                    track competence.id\n                  ) {\n                    <article class=\"mapa-parameterization-competence\">\n                      <header class=\"mapa-parameterization-competence__header\">\n                        <h5>{{ competence.name }}</h5>\n                        <div\n                          class=\"mapa-parameterization-segments mapa-parameterization-segments--small\"\n                        >\n                          <span\n                            class=\"mapa-parameterization-segments__cells\"\n                            role=\"meter\"\n                            aria-valuemin=\"0\"\n                            aria-valuemax=\"100\"\n                            [attr.aria-valuenow]=\"safeValue(competence.value)\"\n                            [attr.aria-label]=\"\n                              i18n.texts.report.meterLabel(\n                                competence.name,\n                                safeValue(competence.value)\n                              )\n                            \"\n                          >\n                            @for (segment of segments; track segment) {\n                              <i\n                                [class.mapa-parameterization-segments__cell--filled]=\"\n                                  segment < filledSegments(competence.value)\n                                \"\n                              ></i>\n                            }\n                          </span>\n                          <strong aria-hidden=\"true\"\n                            >{{ safeValue(competence.value) }}%</strong\n                          >\n                        </div>\n                      </header>\n\n                      @if (competence.description) {\n                        <div\n                          class=\"mapa-parameterization-competence__description\"\n                          [innerHTML]=\"competence.description | safeHtml\"\n                        ></div>\n                      }\n\n                      @if (competence.dimensions?.length) {\n                        <ul class=\"mapa-parameterization-dimensions\">\n                          @for (\n                            dimension of competence.dimensions;\n                            track dimension.id\n                          ) {\n                            <li>\n                              <span\n                                class=\"mapa-parameterization-dimensions__name\"\n                              >\n                                <span\n                                  class=\"mapa-direction-indicator\"\n                                  [attr.aria-label]=\"\n                                    directionLabel(dimension.direction)\n                                  \"\n                                  >{{\n                                    directionArrow(dimension.direction)\n                                  }}</span\n                                >\n                                <span>{{ dimension.name }}</span>\n                              </span>\n                              @if (hasClassification(dimension)) {\n                                <mapa-classification-tag\n                                  appearance=\"solid\"\n                                  [classification]=\"dimension.classification\"\n                                />\n                              }\n                              @if (dimension.description) {\n                                <div\n                                  class=\"mapa-parameterization-dimensions__description\"\n                                  [innerHTML]=\"dimension.description | safeHtml\"\n                                ></div>\n                              }\n                            </li>\n                          }\n                        </ul>\n                      }\n                    </article>\n                  }\n                </div>\n              }\n            </section>\n          }\n        </div>\n      </section>\n    }\n  }\n\n  @if (content() !== \"report\" && rankingViews().length) {\n    <section class=\"mapa-parameterization-ranking\">\n      @if (content() === \"all\") {\n        <h3>{{ i18n.texts.report.parameterizationRankingTitle }}</h3>\n      }\n      <mapa-report-ranking-table-widget\n        [palette]=\"palette()\"\n        [showAverage]=\"false\"\n        [views]=\"rankingViews()\"\n      />\n    </section>\n  }\n</section>\n", styles: [":host{--mapa-report-accent: #ff560b;--mapa-report-accent-soft: #fff0e9;--mapa-report-surface: #fff;--mapa-report-surface-muted: #eef2f3;--mapa-report-border: #e1e5e7;--mapa-report-text: #263238;--mapa-report-muted: #68747a;--mapa-report-pill-width: 104px;--mapa-report-radius: 8px;--mapa-report-space: 20px;color:var(--mapa-report-text);display:block;font-family:var(--mapa-font-body, \"Asap\", \"Roboto\", sans-serif)}.mapa-report-widget{display:grid;gap:var(--mapa-report-space)}.mapa-report-widget__header{align-items:flex-start;column-gap:16px;display:grid;grid-template-columns:minmax(0,1fr) auto}.mapa-report-widget__heading{display:contents}.mapa-report-widget__heading h2{color:var(--mapa-report-accent);font-size:20px;font-weight:650;grid-column:1;grid-row:1;line-height:1.25;margin:0}.mapa-report-widget__description{color:var(--mapa-report-muted);font-size:13px;grid-column:1/-1;grid-row:2;line-height:1.5;margin:5px 0 0}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep p,.mapa-report-widget__description ::ng-deep ul{margin:0 0 8px}.mapa-report-widget__description ::ng-deep ol,.mapa-report-widget__description ::ng-deep ul{padding-left:20px}.mapa-report-widget__description ::ng-deep li{margin:0 0 3px}.mapa-report-widget__description ::ng-deep b,.mapa-report-widget__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-report-widget__description ::ng-deep :last-child{margin-bottom:0}.mapa-report-widget__modes{--mat-button-toggle-background-color: var(--mapa-report-surface);--mat-button-toggle-divider-color: #cbd5da;--mat-button-toggle-height: 32px;--mat-button-toggle-label-text-font: var( --mapa-font-body, \"Asap\", sans-serif );--mat-button-toggle-label-text-size: 13px;--mat-button-toggle-label-text-weight: 500;--mat-button-toggle-selected-state-background-color: #59636a;--mat-button-toggle-selected-state-text-color: #fffaf7;--mat-button-toggle-shape: 4px;--mat-button-toggle-text-color: #344b5e;border:1px solid #cbd5da;border-radius:4px;grid-column:2;grid-row:1;overflow:hidden}.mapa-report-widget__modes mat-button-toggle{font:500 13px/1 var(--mapa-font-body, \"Asap\", sans-serif)}.mapa-report-widget__modes mat-icon{font-size:14px;height:14px;margin-right:5px;width:14px}.mapa-report-widget__empty{color:var(--mapa-report-muted);margin:0;padding:24px 0;text-align:center}@media(max-width:760px){.mapa-report-widget__header{align-items:stretch;grid-template-columns:minmax(0,1fr)}.mapa-report-widget__modes{grid-column:1;grid-row:3;justify-self:start;margin-top:12px}}.mapa-direction-indicator{background:var(--mapa-report-surface, var(--mapa-color-surface, #fafbfc));border:1px solid currentColor;border-radius:50%;box-sizing:border-box;color:var(--mapa-report-muted, var(--mapa-color-text-subtle, #68747a));display:inline-grid;flex:0 0 20px;font-size:11px;font-weight:700;height:20px;line-height:1;place-items:center;width:20px}:host{--mapa-parameterization-accent: #59636a;--mapa-parameterization-rail: #dfe4ea;--mapa-parameterization-line: #e7ebee;--mapa-report-card-radius: 10px;--mapa-report-line-soft: #edf1f3;--mapa-report-surface-soft: #fafbfc}.mapa-parameterization-overview{border:1px solid var(--mapa-report-border);border-radius:16px;display:grid;gap:22px;padding:24px}.mapa-parameterization-overview__headline{align-items:start;display:grid;gap:24px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-overview__eyebrow{color:#8a95a5;display:block;font-size:12px;line-height:1.3;margin-bottom:6px;text-transform:uppercase}.mapa-parameterization-overview h3{color:#2c2e3a;font-size:24px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-overview__score{display:grid;gap:7px;min-width:290px}.mapa-parameterization-overview__score mapa-result-track{display:block;min-width:0;width:100%}.mapa-parameterization-overview__score>span{color:#8a95a5;font-size:12px;text-transform:uppercase}.mapa-parameterization-overview__metadata{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));margin:0}.mapa-parameterization-overview__metadata div{border:1px solid var(--mapa-report-border);border-radius:12px;min-width:0;padding:13px 15px}.mapa-parameterization-overview__metadata dt{color:#8a95a5;font-size:11px;line-height:1.3;margin-bottom:8px;text-transform:uppercase}.mapa-parameterization-overview__metadata dd{color:#2c2e3a;font-size:15px;font-weight:650;line-height:1.35;margin:0;overflow-wrap:anywhere}.mapa-parameterization-segments{align-items:center;display:flex;gap:12px}.mapa-parameterization-segments__cells{display:grid;flex:0 0 auto;gap:5px;grid-template-columns:repeat(10,var(--mapa-parameterization-segment-width, 18px))}.mapa-parameterization-segments i{background:#d8dee7;border-radius:7px;display:block;height:40px}.mapa-parameterization-segments i.mapa-parameterization-segments__cell--filled{background:var(--mapa-parameterization-accent)}.mapa-parameterization-segments strong{color:var(--mapa-parameterization-accent);font-size:17px;min-width:44px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 10px;min-width:min(270px,100%)}.mapa-parameterization-segments--small i{border-radius:5px;height:30px}.mapa-parameterization-segments--small strong{color:#596575;font-size:14px;min-width:36px}.mapa-parameterization-legend{--mapa-classification-tag-min-width: var(--mapa-report-pill-width)}.mapa-parameterization-summary,.mapa-parameterization-detail,.mapa-parameterization-ranking{display:grid;gap:16px;min-width:0}.mapa-parameterization-summary>h3,.mapa-parameterization-detail>h3,.mapa-parameterization-ranking>h3{color:#596575;font-size:18px;font-weight:650;line-height:1.3;margin:0}.mapa-parameterization-summary__rows{border:1px solid var(--mapa-report-border);border-radius:14px;padding:16px 20px}.mapa-parameterization-summary__row{align-items:center;display:grid;gap:20px;grid-template-columns:minmax(200px,36%) minmax(140px,1fr) 48px;min-height:48px}.mapa-parameterization-summary__row+.mapa-parameterization-summary__row{border-top:1px solid var(--mapa-parameterization-line)}.mapa-parameterization-summary__row>span:first-child{color:#4f5d70;font-size:14px;line-height:1.35;overflow-wrap:anywhere}.mapa-parameterization-summary__row>strong{color:#596575;font-size:14px;text-align:right}.mapa-parameterization-summary__track{background:var(--mapa-parameterization-rail);border-radius:999px;display:block;height:14px;overflow:hidden}.mapa-parameterization-summary__track i{background:var(--mapa-parameterization-accent);border-radius:inherit;display:block;height:100%}@media(max-width:900px){.mapa-parameterization-overview__headline,.mapa-parameterization-group__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-overview__score,.mapa-parameterization-segments--small{min-width:0}.mapa-parameterization-dimensions li{grid-template-columns:minmax(150px,1fr) auto}.mapa-parameterization-dimensions__description{grid-column:1/-1;padding-left:28px}}@media(max-width:600px){.mapa-parameterization-overview,.mapa-parameterization-group{padding:16px}.mapa-parameterization-overview h3{font-size:20px}.mapa-parameterization-segments{--mapa-parameterization-segment-width: 12px;align-items:flex-end;gap:8px}.mapa-parameterization-segments__cells{gap:3px}.mapa-parameterization-segments i{height:32px}.mapa-parameterization-segments--small{--mapa-parameterization-segment-width: 8px}.mapa-parameterization-summary__rows{padding:8px 14px}.mapa-parameterization-summary__row{gap:9px;grid-template-columns:minmax(0,1fr) 44px;padding:10px 0}.mapa-parameterization-summary__row .mapa-parameterization-summary__track{grid-column:1/-1;grid-row:2}.mapa-parameterization-summary__row>strong{grid-column:2;grid-row:1}.mapa-parameterization-dimensions li{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-dimensions__description{grid-column:auto;padding-left:28px}}@media print{.mapa-parameterization-overview,.mapa-parameterization-group,.mapa-parameterization-competence{break-inside:avoid}}\n", ".mapa-parameterization-detail__sections{display:grid;gap:22px}.mapa-parameterization-group{--mapa-classification-tag-min-width: var(--mapa-report-pill-width);border:1px solid var(--mapa-report-border);border-radius:14px;min-width:0;padding:18px}.mapa-parameterization-group__header{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-group__header h4{color:#2c2e3a;font-size:20px;font-weight:650;line-height:1.25;margin:0;overflow-wrap:anywhere}.mapa-parameterization-group__header>div:first-child>div{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:5px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep p,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep ol,.mapa-parameterization-group__header>div:first-child>div ::ng-deep ul{padding-left:20px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep li{margin:0 0 3px}.mapa-parameterization-group__header>div:first-child>div ::ng-deep b,.mapa-parameterization-group__header>div:first-child>div ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-group__header>div:first-child>div ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-group__label{background:#f1f4f8;border:1px solid var(--mapa-report-border);border-radius:7px;color:#405064;font-size:13px;font-weight:650;margin-top:16px;padding:7px 10px}.mapa-parameterization-group__grid{display:grid;column-gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px;row-gap:14px}.mapa-parameterization-dimensions mapa-classification-tag{flex:0 0 auto;max-width:var(--mapa-report-pill-width)}.mapa-parameterization-competence{background:var(--mapa-report-surface);border:1px solid var(--mapa-report-border);border-radius:var(--mapa-report-card-radius);min-width:0;padding:16px 14px 13px}.mapa-parameterization-competence__header{align-items:center;display:grid;gap:14px;grid-template-columns:minmax(0,1fr) auto}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:end;min-width:0}.mapa-parameterization-competence__header h5{color:#2c2e3a;font-size:16px;font-weight:650;line-height:1.3;margin:0;overflow-wrap:anywhere}.mapa-parameterization-competence__description{color:var(--mapa-report-muted);font-size:12px;line-height:1.5;margin-top:12px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep p,.mapa-parameterization-competence__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-competence__description ::ng-deep ol,.mapa-parameterization-competence__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-competence__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-competence__description ::ng-deep b,.mapa-parameterization-competence__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-competence__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-dimensions{border-top:1px solid var(--mapa-report-line-soft);display:grid;gap:7px;list-style:none;margin:14px 0 0;padding:12px 0 0}.mapa-parameterization-dimensions li{align-items:center;background:var(--mapa-report-surface-soft);border:1px solid var(--mapa-report-line-soft);border-radius:9px;display:grid;gap:10px;grid-template-columns:minmax(0,1fr) auto;padding:9px 10px}.mapa-parameterization-dimensions__name{align-items:center;color:#4f5d70;display:flex;font-size:12px;gap:8px;line-height:1.4;min-width:0}.mapa-parameterization-dimensions__name span:last-child{overflow-wrap:anywhere}.mapa-parameterization-dimensions__description{color:var(--mapa-report-muted);font-size:11px;grid-column:1/-1;line-height:1.45;padding-left:28px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep p,.mapa-parameterization-dimensions__description ::ng-deep ul{margin:0 0 8px}.mapa-parameterization-dimensions__description ::ng-deep ol,.mapa-parameterization-dimensions__description ::ng-deep ul{padding-left:20px}.mapa-parameterization-dimensions__description ::ng-deep li{margin:0 0 3px}.mapa-parameterization-dimensions__description ::ng-deep b,.mapa-parameterization-dimensions__description ::ng-deep strong{color:var(--mapa-report-text, inherit);font-weight:600}.mapa-parameterization-dimensions__description ::ng-deep :last-child{margin-bottom:0}.mapa-parameterization-ranking mapa-report-ranking-table-widget{display:block;min-width:0}@media(max-width:1100px){.mapa-parameterization-group__grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:600px){.mapa-parameterization-competence__header{grid-template-columns:minmax(0,1fr)}.mapa-parameterization-competence__header .mapa-parameterization-segments{justify-self:start}}\n"] }]
+        }], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], legend: [{ type: i0.Input, args: [{ isSignal: true, alias: "legend", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }, { type: i0.Output, args: ["modeChange"] }] } });
 
 class MapaProgressbarComponent {
     constructor() {