desy-angular 12.1.0 → 13.0.0

package/fesm2022/desy-angular.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, Input, ViewChild, Directive, Pipe, EventEmitter, HostBinding, Output, QueryList, ElementRef, ContentChildren, HostListener, ViewChildren, forwardRef, Optional, ChangeDetectionStrategy, ViewContainerRef, Type as Type$2, TemplateRef, ComponentRef, Injectable, ContentChild, SecurityContext, NgModule } from '@angular/core';
+import { Component, Input, ViewChild, HostBinding, Directive, Pipe, EventEmitter, Output, QueryList, ElementRef, ContentChildren, HostListener, ViewChildren, forwardRef, Optional, ChangeDetectionStrategy, ViewContainerRef, Type as Type$2, TemplateRef, ComponentRef, Injectable, ContentChild, SecurityContext, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2 from '@angular/router';
@@ -15,17 +15,21 @@ import { A11yModule } from '@angular/cdk/a11y';
 import { trigger, state, style, transition, animate } from '@angular/animations';
 import * as i1$3 from '@angular/platform-browser';
 
-class AccessibilityComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AccessibilityComponent, selector: "desy-accessibility", inputs: { role: "role", ariaLabel: "ariaLabel", ariaDescribedBy: "ariaDescribedBy", ariaLabelledBy: "ariaLabelledBy", ariaHidden: "ariaHidden", ariaDisabled: "ariaDisabled", ariaControls: "ariaControls", ariaCurrent: "ariaCurrent", ariaLive: "ariaLive", ariaExpanded: "ariaExpanded", ariaErrorMessage: "ariaErrorMessage", ariaHasPopup: "ariaHasPopup", ariaModal: "ariaModal", ariaChecked: "ariaChecked", ariaPressed: "ariaPressed", ariaReadonly: "ariaReadonly", ariaRequired: "ariaRequired", ariaSelected: "ariaSelected", ariaValuemin: "ariaValuemin", ariaValuemax: "ariaValuemax", ariaValuenow: "ariaValuenow", ariaValuetext: "ariaValuetext", ariaOrientation: "ariaOrientation", ariaLevel: "ariaLevel", ariaMultiselectable: "ariaMultiselectable", ariaPlaceholder: "ariaPlaceholder", ariaPosinset: "ariaPosinset", ariaSetsize: "ariaSetsize", ariaSort: "ariaSort", ariaBusy: "ariaBusy", ariaDropeffect: "ariaDropeffect", ariaGrabbed: "ariaGrabbed", ariaActivedescendant: "ariaActivedescendant", ariaAtomic: "ariaAtomic", ariaAutocomplete: "ariaAutocomplete", ariaBraillelabel: "ariaBraillelabel", ariaBrailleroledescription: "ariaBrailleroledescription", ariaColcount: "ariaColcount", ariaColindex: "ariaColindex", ariaColindextext: "ariaColindextext", ariaColspan: "ariaColspan", ariaDescription: "ariaDescription", ariaDetails: "ariaDetails", ariaFlowto: "ariaFlowto", ariaInvalid: "ariaInvalid", ariaKeyshortcuts: "ariaKeyshortcuts", ariaOwns: "ariaOwns", ariaRelevant: "ariaRelevant", ariaRoledescription: "ariaRoledescription", ariaRowcount: "ariaRowcount", ariaRowindex: "ariaRowindex", ariaRowindextext: "ariaRowindextext", ariaRowspan: "ariaRowspan", tabindex: "tabindex", title: "title", alt: "alt", lang: "lang", accesskey: "accesskey", autocomplete: "autocomplete", autofocus: "autofocus", contenteditable: "contenteditable", dir: "dir", draggable: "draggable", enterkeyhint: "enterkeyhint", hidden: "hidden", inputmode: "inputmode", spellcheck: "spellcheck", translate: "translate", ariaMultiline: "ariaMultiline", for: "for", form: "form", headers: "headers", placeholder: "placeholder", readonly: "readonly", required: "required" }, ngImport: i0, template: '<div></div>', isInline: true }); }
+class AccessibilityAndContentRequiredComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityAndContentRequiredComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AccessibilityAndContentRequiredComponent, selector: "desy-accessibility-and-content-required", inputs: { html: "html", text: "text", role: "role", ariaLabel: "ariaLabel", ariaDescribedBy: "ariaDescribedBy", ariaLabelledBy: "ariaLabelledBy", ariaHidden: "ariaHidden", ariaDisabled: "ariaDisabled", ariaControls: "ariaControls", ariaCurrent: "ariaCurrent", ariaLive: "ariaLive", ariaExpanded: "ariaExpanded", ariaErrorMessage: "ariaErrorMessage", ariaHasPopup: "ariaHasPopup", ariaModal: "ariaModal", ariaChecked: "ariaChecked", ariaPressed: "ariaPressed", ariaReadonly: "ariaReadonly", ariaRequired: "ariaRequired", ariaSelected: "ariaSelected", ariaValuemin: "ariaValuemin", ariaValuemax: "ariaValuemax", ariaValuenow: "ariaValuenow", ariaValuetext: "ariaValuetext", ariaOrientation: "ariaOrientation", ariaLevel: "ariaLevel", ariaMultiselectable: "ariaMultiselectable", ariaPlaceholder: "ariaPlaceholder", ariaPosinset: "ariaPosinset", ariaSetsize: "ariaSetsize", ariaSort: "ariaSort", ariaBus: "ariaBus", required: "required", ariaDropeffect: "ariaDropeffect", ariaGrabbed: "ariaGrabbed", ariaActivedescendant: "ariaActivedescendant", ariaAtomic: "ariaAtomic", ariaAutocomplete: "ariaAutocomplete", ariaBraillelabel: "ariaBraillelabel", ariaBrailleroledescription: "ariaBrailleroledescription", ariaColcount: "ariaColcount", ariaColindex: "ariaColindex", ariaColindextext: "ariaColindextext", ariaColspan: "ariaColspan", ariaDescription: "ariaDescription", ariaDetails: "ariaDetails", ariaFlowto: "ariaFlowto", ariaInvalid: "ariaInvalid", ariaKeyshortcuts: "ariaKeyshortcuts", ariaOwns: "ariaOwns", ariaRelevant: "ariaRelevant", ariaRoledescription: "ariaRoledescription", ariaRowcount: "ariaRowcount", ariaRowindex: "ariaRowindex", ariaRowindextext: "ariaRowindextext", ariaRowspan: "ariaRowspan", tabindex: "tabindex", title: "title", alt: "alt", lang: "lang", accesskey: "accesskey", autocomplete: "autocomplete", autofocus: "autofocus", contenteditable: "contenteditable", dir: "dir", draggable: "draggable", enterkeyhint: "enterkeyhint", hidden: "hidden", inputmode: "inputmode", spellcheck: "spellcheck", translate: "translate", ariaMultiline: "ariaMultiline", for: "for", form: "form", headers: "headers", placeholder: "placeholder", readonly: "readonly" }, ngImport: i0, template: '<div></div>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityAndContentRequiredComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'desy-accessibility',
+                    selector: 'desy-accessibility-and-content-required',
                     template: '<div></div>'
                 }]
-        }], propDecorators: { role: [{
+        }], propDecorators: { html: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], role: [{
                 type: Input
             }], ariaLabel: [{
                 type: Input
@@ -83,7 +87,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], ariaSort: [{
                 type: Input
-            }], ariaBusy: [{
+            }], ariaBus: [{
+                type: Input
+            }], required: [{
                 type: Input
             }], ariaDropeffect: [{
                 type: Input
@@ -173,26 +179,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], readonly: [{
                 type: Input
-            }], required: [{
-                type: Input
-            }] } });
-
-class ContentBaseComponent extends AccessibilityComponent {
-    getContent() {
-        return this.content;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ContentBaseComponent, selector: "desy-content-base", viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentBaseComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'desy-content-base',
-                    template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>'
-                }]
-        }], propDecorators: { content: [{
-                type: ViewChild,
-                args: ['contentTemplate', { static: true }]
             }] } });
 
 class TextOrHtmlRequiredComponent {
@@ -373,21 +359,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }] } });
 
-class AccessibilityAndContentRequiredComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityAndContentRequiredComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AccessibilityAndContentRequiredComponent, selector: "desy-accessibility-and-content-required", inputs: { html: "html", text: "text", role: "role", ariaLabel: "ariaLabel", ariaDescribedBy: "ariaDescribedBy", ariaLabelledBy: "ariaLabelledBy", ariaHidden: "ariaHidden", ariaDisabled: "ariaDisabled", ariaControls: "ariaControls", ariaCurrent: "ariaCurrent", ariaLive: "ariaLive", ariaExpanded: "ariaExpanded", ariaErrorMessage: "ariaErrorMessage", ariaHasPopup: "ariaHasPopup", ariaModal: "ariaModal", ariaChecked: "ariaChecked", ariaPressed: "ariaPressed", ariaReadonly: "ariaReadonly", ariaRequired: "ariaRequired", ariaSelected: "ariaSelected", ariaValuemin: "ariaValuemin", ariaValuemax: "ariaValuemax", ariaValuenow: "ariaValuenow", ariaValuetext: "ariaValuetext", ariaOrientation: "ariaOrientation", ariaLevel: "ariaLevel", ariaMultiselectable: "ariaMultiselectable", ariaPlaceholder: "ariaPlaceholder", ariaPosinset: "ariaPosinset", ariaSetsize: "ariaSetsize", ariaSort: "ariaSort", ariaBus: "ariaBus", required: "required", ariaDropeffect: "ariaDropeffect", ariaGrabbed: "ariaGrabbed", ariaActivedescendant: "ariaActivedescendant", ariaAtomic: "ariaAtomic", ariaAutocomplete: "ariaAutocomplete", ariaBraillelabel: "ariaBraillelabel", ariaBrailleroledescription: "ariaBrailleroledescription", ariaColcount: "ariaColcount", ariaColindex: "ariaColindex", ariaColindextext: "ariaColindextext", ariaColspan: "ariaColspan", ariaDescription: "ariaDescription", ariaDetails: "ariaDetails", ariaFlowto: "ariaFlowto", ariaInvalid: "ariaInvalid", ariaKeyshortcuts: "ariaKeyshortcuts", ariaOwns: "ariaOwns", ariaRelevant: "ariaRelevant", ariaRoledescription: "ariaRoledescription", ariaRowcount: "ariaRowcount", ariaRowindex: "ariaRowindex", ariaRowindextext: "ariaRowindextext", ariaRowspan: "ariaRowspan", tabindex: "tabindex", title: "title", alt: "alt", lang: "lang", accesskey: "accesskey", autocomplete: "autocomplete", autofocus: "autofocus", contenteditable: "contenteditable", dir: "dir", draggable: "draggable", enterkeyhint: "enterkeyhint", hidden: "hidden", inputmode: "inputmode", spellcheck: "spellcheck", translate: "translate", ariaMultiline: "ariaMultiline", for: "for", form: "form", headers: "headers", placeholder: "placeholder", readonly: "readonly" }, ngImport: i0, template: '<div></div>', isInline: true }); }
+class AccessibilityComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AccessibilityComponent, selector: "desy-accessibility", inputs: { role: "role", ariaLabel: "ariaLabel", ariaDescribedBy: "ariaDescribedBy", ariaLabelledBy: "ariaLabelledBy", ariaHidden: "ariaHidden", ariaDisabled: "ariaDisabled", ariaControls: "ariaControls", ariaCurrent: "ariaCurrent", ariaLive: "ariaLive", ariaExpanded: "ariaExpanded", ariaErrorMessage: "ariaErrorMessage", ariaHasPopup: "ariaHasPopup", ariaModal: "ariaModal", ariaChecked: "ariaChecked", ariaPressed: "ariaPressed", ariaReadonly: "ariaReadonly", ariaRequired: "ariaRequired", ariaSelected: "ariaSelected", ariaValuemin: "ariaValuemin", ariaValuemax: "ariaValuemax", ariaValuenow: "ariaValuenow", ariaValuetext: "ariaValuetext", ariaOrientation: "ariaOrientation", ariaLevel: "ariaLevel", ariaMultiselectable: "ariaMultiselectable", ariaPlaceholder: "ariaPlaceholder", ariaPosinset: "ariaPosinset", ariaSetsize: "ariaSetsize", ariaSort: "ariaSort", ariaBusy: "ariaBusy", ariaDropeffect: "ariaDropeffect", ariaGrabbed: "ariaGrabbed", ariaActivedescendant: "ariaActivedescendant", ariaAtomic: "ariaAtomic", ariaAutocomplete: "ariaAutocomplete", ariaBraillelabel: "ariaBraillelabel", ariaBrailleroledescription: "ariaBrailleroledescription", ariaColcount: "ariaColcount", ariaColindex: "ariaColindex", ariaColindextext: "ariaColindextext", ariaColspan: "ariaColspan", ariaDescription: "ariaDescription", ariaDetails: "ariaDetails", ariaFlowto: "ariaFlowto", ariaInvalid: "ariaInvalid", ariaKeyshortcuts: "ariaKeyshortcuts", ariaOwns: "ariaOwns", ariaRelevant: "ariaRelevant", ariaRoledescription: "ariaRoledescription", ariaRowcount: "ariaRowcount", ariaRowindex: "ariaRowindex", ariaRowindextext: "ariaRowindextext", ariaRowspan: "ariaRowspan", tabindex: "tabindex", title: "title", alt: "alt", lang: "lang", accesskey: "accesskey", autocomplete: "autocomplete", autofocus: "autofocus", contenteditable: "contenteditable", dir: "dir", draggable: "draggable", enterkeyhint: "enterkeyhint", hidden: "hidden", inputmode: "inputmode", spellcheck: "spellcheck", translate: "translate", ariaMultiline: "ariaMultiline", for: "for", form: "form", headers: "headers", placeholder: "placeholder", readonly: "readonly", required: "required" }, ngImport: i0, template: '<div></div>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityAndContentRequiredComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'desy-accessibility-and-content-required',
+                    selector: 'desy-accessibility',
                     template: '<div></div>'
                 }]
-        }], propDecorators: { html: [{
-                type: Input
-            }], text: [{
-                type: Input
-            }], role: [{
+        }], propDecorators: { role: [{
                 type: Input
             }], ariaLabel: [{
                 type: Input
@@ -445,9 +427,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], ariaSort: [{
                 type: Input
-            }], ariaBus: [{
-                type: Input
-            }], required: [{
+            }], ariaBusy: [{
                 type: Input
             }], ariaDropeffect: [{
                 type: Input
@@ -537,307 +517,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], readonly: [{
                 type: Input
-            }] } });
-
-class InnerContentDirective {
-    constructor(el) {
-        this.el = el;
-        this.deleteContentIfEmpty = true;
-    }
-    ngOnChanges(changes) {
-        if (this.content) {
-            if (this.isHtml) {
-                this.el.nativeElement.innerHTML = this.content;
-            }
-            else {
-                this.el.nativeElement.innerText = this.content;
-            }
-        }
-        else if (this.deleteContentIfEmpty) {
-            this.el.nativeElement.innerText = null;
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InnerContentDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: { content: ["desyInnerContent", "content"], isHtml: "isHtml", deleteContentIfEmpty: "deleteContentIfEmpty" }, usesOnChanges: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InnerContentDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[desyInnerContent]'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { content: [{
-                type: Input,
-                args: ['desyInnerContent']
-            }], isHtml: [{
-                type: Input
-            }], deleteContentIfEmpty: [{
+            }], required: [{
                 type: Input
             }] } });
 
-const ACCESSIBILITY_ATTRIBUTES = [
-    'role',
-    'ariaLabel',
-    'ariaLabelledBy',
-    'ariaDescribedBy',
-    'ariaHidden',
-    'ariaDisabled',
-    'ariaControls',
-    'ariaCurrent',
-    'ariaLive',
-    'ariaExpanded',
-    'ariaErrorMessage',
-    'ariaHasPopup',
-    'ariaModal',
-    'ariaChecked',
-    'ariaPressed',
-    'ariaReadonly',
-    'ariaRequired',
-    'ariaSelected',
-    'ariaValuemin',
-    'ariaValuemax',
-    'ariaValuenow',
-    'ariaValuetext',
-    'ariaOrientation',
-    'ariaLevel',
-    'ariaMultiselectable',
-    'ariaPlaceholder',
-    'ariaPosinset',
-    'ariaSetsize',
-    'ariaSort',
-    'ariaBusy',
-    'ariaDropeffect',
-    'ariaGrabbed',
-    'ariaActivedescendant',
-    'ariaAtomic',
-    'ariaAutocomplete',
-    'ariaBraillelabel',
-    'ariaBrailleroledescription',
-    'ariaColcount',
-    'ariaColindex',
-    'ariaColindextext',
-    'ariaColspan',
-    'ariaDescription',
-    'ariaDetails',
-    'ariaFlowto',
-    'ariaInvalid',
-    'ariaKeyshortcuts',
-    'ariaOwns',
-    'ariaRelevant',
-    'ariaRoledescription',
-    'ariaRowcount',
-    'ariaRowindex',
-    'ariaRowindextext',
-    'ariaRowspan',
-    'tabindex',
-    'title',
-    'alt',
-    'lang',
-    'accesskey',
-    'autocomplete',
-    'autofocus',
-    'contenteditable',
-    'dir',
-    'draggable',
-    'enterkeyhint',
-    'hidden',
-    'inputmode',
-    'spellcheck',
-    'translate',
-    'ariaMultiline',
-    'for',
-    'form',
-    'headers',
-    'placeholder',
-    'readonly',
-    'required'
-];
-
-class AccessibilityDirective {
-    constructor(el, renderer, differs) {
-        this.el = el;
-        this.renderer = renderer;
-        this.differs = differs;
-        this.differ = this.differs.find({}).create();
-    }
-    ngOnChanges(changes) {
-        if (changes['accessibility']) {
-            this.applyAccessibilityAttributes();
-        }
-    }
-    ngDoCheck() {
-        if (this.accessibility) {
-            const changes = this.differ.diff(this.accessibility);
-            if (changes) {
-                this.applyAccessibilityAttributes();
-            }
-        }
-    }
-    applyAccessibilityAttributes() {
-        if (this.accessibility) {
-            Object.keys(this.accessibility).forEach(attr => {
-                if (ACCESSIBILITY_ATTRIBUTES.includes(attr) && this.accessibility[attr] !== null && this.accessibility[attr] !== undefined) {
-                    const htmlAttr = this.camelToKebabCase(attr);
-                    this.renderer.setAttribute(this.el.nativeElement, htmlAttr, this.accessibility[attr]);
-                }
-            });
-        }
-    }
-    camelToKebabCase(str) {
-        if (str === str.toLowerCase()) {
-            return str;
-        }
-        return str.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
+class ContentBaseComponent extends AccessibilityComponent {
+    getContent() {
+        return this.content;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.KeyValueDiffers }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: { accessibility: ["desyAppAccessibility", "accessibility"] }, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ContentBaseComponent, selector: "desy-content-base", viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityDirective, decorators: [{
-            type: Directive,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentBaseComponent, decorators: [{
+            type: Component,
             args: [{
-                    selector: '[desyAppAccessibility]'
+                    selector: 'desy-content-base',
+                    template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.KeyValueDiffers }]; }, propDecorators: { accessibility: [{
-                type: Input,
-                args: ['desyAppAccessibility']
+        }], propDecorators: { content: [{
+                type: ViewChild,
+                args: ['contentTemplate', { static: true }]
             }] } });
 
-class ExternalHrefPipe {
-    transform(href) {
-        let externalHref;
-        if (href) {
-            if (href.match('http(s)?://') || href.match('mailto?:')) {
-                externalHref = href;
-            }
-            else {
-                externalHref = 'http://' + href;
-            }
-        }
-        else {
-            externalHref = '#';
-        }
-        return externalHref;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExternalHrefPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: ExternalHrefPipe, name: "externalHref" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExternalHrefPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'externalHref'
-                }]
-        }] });
-
-class ButtonComponent extends ContentBaseComponent {
-    constructor() {
-        super(...arguments);
-        this.hostTabIndex = null;
-        this.clickEvent = new EventEmitter();
-        this.avoidingDoubleClick = false;
-    }
-    static { this.ELEMENT_A = 'a'; }
-    static { this.ELEMENT_BUTTON = 'button'; }
-    static { this.ELEMENT_INPUT = 'input'; }
-    ngOnInit() {
-        this.isHtml = Boolean(this.html);
-    }
-    onClick(event) {
-        if (this.preventDoubleClick) {
-            if (!this.avoidingDoubleClick) {
-                this.avoidingDoubleClick = true;
-                this.clickEvent.emit(event);
-                setTimeout(() => {
-                    this.avoidingDoubleClick = false;
-                }, 1000);
-            }
-            else {
-                event.preventDefault();
-            }
-        }
-        else {
-            this.clickEvent.emit(event);
-        }
-    }
-    getElement() {
-        let element;
-        if (this.element) {
-            element = this.element.toLocaleLowerCase();
-        }
-        else {
-            if (this.href) {
-                element = ButtonComponent.ELEMENT_A;
-            }
-            else {
-                element = ButtonComponent.ELEMENT_BUTTON;
-            }
-        }
-        return element;
-    }
-    getClassNames() {
-        let classNames = 'c-button';
-        if (this.classes) {
-            classNames += ' ' + this.classes;
-        }
-        if (this.disabled) {
-            classNames += ' c-button--disabled';
-        }
-        return classNames;
-    }
-    isDisabled() {
-        return this.disabled ? true : null;
-    }
-    get staticElementTypeA() {
-        return ButtonComponent.ELEMENT_A;
-    }
-    get staticElementTypeButton() {
-        return ButtonComponent.ELEMENT_BUTTON;
-    }
-    get staticElementTypeInput() {
-        return ButtonComponent.ELEMENT_INPUT;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonComponent, selector: "desy-button", inputs: { id: "id", classes: "classes", html: "html", text: "text", element: "element", name: "name", type: "type", value: "value", disabled: "disabled", href: "href", target: "target", preventDoubleClick: "preventDoubleClick", fragment: "fragment", routerLink: "routerLink", routerLinkActiveClasses: "routerLinkActiveClasses" }, outputs: { clickEvent: "clickEvent" }, host: { properties: { "attr.tabindex": "this.hostTabIndex" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n   <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n  <!-- routerLink modifica href, por eso se duplica para que no convivan en un mismo html -->\n     <a *ngIf=\"routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [routerLink]=\"routerLink\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n     <a *ngIf=\"!routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [href]=\"href | externalHref\"\n        [attr.target]=\"target ? target : null\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\" (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.type]=\"type ? type : null\"\n          [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n          [class]=\"getClassNames()\"\n          [attr.id]=\"id ? id : null\">\n    <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n  </button>\n\n  <input *ngSwitchCase=\"staticElementTypeInput\" (click)=\"onClick($event)\"\n         [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n         [attr.name]=\"name ? name : null\"\n         [value]=\"text ? text : null\"\n         [disabled]=\"isDisabled()\"\n         [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n         [desyAppAccessibility]=\"this\"\n         [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n         [attr.type]=\"type ? type : 'submit'\"\n         [class]=\"getClassNames()\"\n         [attr.id]=\"id ? id : null\">\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'desy-button', template: "<ng-template #contentTemplate>\n   <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n  <!-- routerLink modifica href, por eso se duplica para que no convivan en un mismo html -->\n     <a *ngIf=\"routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [routerLink]=\"routerLink\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n     <a *ngIf=\"!routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [href]=\"href | externalHref\"\n        [attr.target]=\"target ? target : null\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\" (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.type]=\"type ? type : null\"\n          [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n          [class]=\"getClassNames()\"\n          [attr.id]=\"id ? id : null\">\n    <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n  </button>\n\n  <input *ngSwitchCase=\"staticElementTypeInput\" (click)=\"onClick($event)\"\n         [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n         [attr.name]=\"name ? name : null\"\n         [value]=\"text ? text : null\"\n         [disabled]=\"isDisabled()\"\n         [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n         [desyAppAccessibility]=\"this\"\n         [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n         [attr.type]=\"type ? type : 'submit'\"\n         [class]=\"getClassNames()\"\n         [attr.id]=\"id ? id : null\">\n</ng-container>\n" }]
-        }], propDecorators: { hostTabIndex: [{
-                type: HostBinding,
-                args: ['attr.tabindex']
-            }], id: [{
-                type: Input
-            }], classes: [{
-                type: Input
-            }], html: [{
-                type: Input
-            }], text: [{
-                type: Input
-            }], element: [{
-                type: Input
-            }], name: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], href: [{
-                type: Input
-            }], target: [{
-                type: Input
-            }], preventDoubleClick: [{
-                type: Input
-            }], fragment: [{
-                type: Input
-            }], routerLink: [{
-                type: Input
-            }], routerLinkActiveClasses: [{
-                type: Input
-            }], clickEvent: [{
-                type: Output
-            }] } });
-
-class SpinnerComponent extends AccessibilityComponent {
+class SpinnerComponent extends AccessibilityComponent {
     constructor() {
         super(...arguments);
         this.classes = "c-spinner";
@@ -1162,135 +864,433 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }] } });
 
-class ButtonLoaderComponent extends ButtonComponent {
-    constructor() {
-        super(...arguments);
-        this.stateLoading = ButtonLoaderComponent.STATE_LOADING;
-        this.stateSuccess = ButtonLoaderComponent.STATE_SUCCESS;
-        this.hostTabIndex = null;
-    }
-    static { this.STATE_LOADING = 'is-loading'; }
-    static { this.STATE_SUCCESS = 'is-success'; }
-    static { this.DEFAULT_LOADER_TEXT = 'Acción en curso'; }
-    static { this.DEFAULT_SUCCESS_TEXT = 'Acción realizada con éxito'; }
-    ngOnInit() {
-        this.isHtml = Boolean(this.html);
-    }
-    getClassNames() {
-        let classNames = 'c-button-loader relative';
-        if (this.classes) {
-            classNames += ' ' + this.classes;
-        }
-        if (this.disabled) {
-            classNames += ' c-button-loader--disabled';
-        }
-        return classNames;
+class InnerContentDirective {
+    constructor(el) {
+        this.el = el;
+        this.deleteContentIfEmpty = true;
     }
-    getSpinnerText() {
-        let spinnerText = null;
-        if (this.state === ButtonLoaderComponent.STATE_LOADING) {
-            spinnerText = this.loaderText ? this.loaderText : ButtonLoaderComponent.DEFAULT_LOADER_TEXT;
+    ngOnChanges(changes) {
+        if (this.content) {
+            if (this.isHtml) {
+                this.el.nativeElement.innerHTML = this.content;
+            }
+            else {
+                this.el.nativeElement.innerText = this.content;
+            }
         }
-        return spinnerText;
-    }
-    getSuccessText() {
-        let successText = null;
-        if (this.state === ButtonLoaderComponent.STATE_SUCCESS) {
-            successText = this.successText ? this.successText : ButtonLoaderComponent.DEFAULT_SUCCESS_TEXT;
+        else if (this.deleteContentIfEmpty) {
+            this.el.nativeElement.innerText = null;
         }
-        return successText;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonLoaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonLoaderComponent, selector: "desy-button-loader", inputs: { loaderText: "loaderText", loaderClasses: "loaderClasses", state: "state", successText: "successText" }, host: { properties: { "attr.tabindex": "this.hostTabIndex" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #spinnerTemplate>\n  <span class=\"c-button-loader__spinner flex items-center justify-center absolute inset-0\">\n    <desy-spinner [text]=\"getSpinnerText() ? getSpinnerText() : 'Acci\u00F3n en curso'\"\n                  [classes]=\"loaderClasses\"></desy-spinner>\n  </span>\n</ng-template>\n\n<ng-template #successTemplate>\n  <span class=\"c-button-loader__success flex items-center justify-center absolute inset-0\">\n    <span class=\"sr-only\"\n          role=\"alert\"\n          aria-live=\"assertive\">{{ getSuccessText() }}</span>\n    <span aria-hidden=\"true\"><svg xmlns=\"http://www.w3.org/2000/svg\"\n           viewBox=\"0 0 48 48\"\n           aria-hidden=\"true\"\n           width=\"1em\"\n           height=\"1em\">\n        <path d=\"M13.714 42.857A6.857 6.857 0 0 1 8.4 40.183L.857 31.646a3.429 3.429 0 0 1 .309-4.869A3.429 3.429 0 0 1 6 27.12l7.063 7.989a.72.72 0 0 0 .617.308.789.789 0 0 0 .617-.274L42.103 6.206a3.429 3.429 0 0 1 4.937 4.731L18.926 40.526a6.651 6.651 0 0 1-5.212 2.331Z\"\n              fill=\"currentColor\"></path>\n      </svg></span>\n  </span>\n</ng-template>\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n    <a *ngIf=\"routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n\n    <a *ngIf=\"!routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [href]=\"href | externalHref\"\n       [attr.target]=\"target ? target : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\"\n          (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\"\n          [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [attr.disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.id]=\"id ? id : null\"\n          [attr.type]=\"type ? type : null\"\n          [class]=\"getClassNames()\">\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n    <span class=\"c-button-loader__content inline-flex align-baseline\"\n          [desyInnerContent]=\"html ? html : text\"\n          [isHtml]=\"isHtml\"\n          [deleteContentIfEmpty]=\"false\"> <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n  </button>\n\n  <div *ngSwitchCase=\"staticElementTypeInput\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink ? routerLink : null\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       [desyAppAccessibility]=\"this\"\n       [attr.id]=\"id ? id : null\"\n       [class]=\"getClassNames()\">\n    <span class=\"c-button-loader__content inline-flex align-baseline\">\n      <input [value]=\"text ? text : null\"\n             [type]=\"type ? type : 'submit'\"\n             class=\"bg-transparent font-semibold\"\n             [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n             [attr.disabled]=\"isDisabled()\"\n             [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n             [attr.name]=\"name ? name : null\">\n    </span>\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n  </div>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: SpinnerComponent, selector: "desy-spinner", inputs: ["text", "classes", "id"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InnerContentDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: { content: ["desyInnerContent", "content"], isHtml: "isHtml", deleteContentIfEmpty: "deleteContentIfEmpty" }, usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonLoaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'desy-button-loader', template: "<ng-template #spinnerTemplate>\n  <span class=\"c-button-loader__spinner flex items-center justify-center absolute inset-0\">\n    <desy-spinner [text]=\"getSpinnerText() ? getSpinnerText() : 'Acci\u00F3n en curso'\"\n                  [classes]=\"loaderClasses\"></desy-spinner>\n  </span>\n</ng-template>\n\n<ng-template #successTemplate>\n  <span class=\"c-button-loader__success flex items-center justify-center absolute inset-0\">\n    <span class=\"sr-only\"\n          role=\"alert\"\n          aria-live=\"assertive\">{{ getSuccessText() }}</span>\n    <span aria-hidden=\"true\"><svg xmlns=\"http://www.w3.org/2000/svg\"\n           viewBox=\"0 0 48 48\"\n           aria-hidden=\"true\"\n           width=\"1em\"\n           height=\"1em\">\n        <path d=\"M13.714 42.857A6.857 6.857 0 0 1 8.4 40.183L.857 31.646a3.429 3.429 0 0 1 .309-4.869A3.429 3.429 0 0 1 6 27.12l7.063 7.989a.72.72 0 0 0 .617.308.789.789 0 0 0 .617-.274L42.103 6.206a3.429 3.429 0 0 1 4.937 4.731L18.926 40.526a6.651 6.651 0 0 1-5.212 2.331Z\"\n              fill=\"currentColor\"></path>\n      </svg></span>\n  </span>\n</ng-template>\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n    <a *ngIf=\"routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n\n    <a *ngIf=\"!routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [href]=\"href | externalHref\"\n       [attr.target]=\"target ? target : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\"\n          (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\"\n          [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [attr.disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.id]=\"id ? id : null\"\n          [attr.type]=\"type ? type : null\"\n          [class]=\"getClassNames()\">\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n    <span class=\"c-button-loader__content inline-flex align-baseline\"\n          [desyInnerContent]=\"html ? html : text\"\n          [isHtml]=\"isHtml\"\n          [deleteContentIfEmpty]=\"false\"> <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n  </button>\n\n  <div *ngSwitchCase=\"staticElementTypeInput\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink ? routerLink : null\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       [desyAppAccessibility]=\"this\"\n       [attr.id]=\"id ? id : null\"\n       [class]=\"getClassNames()\">\n    <span class=\"c-button-loader__content inline-flex align-baseline\">\n      <input [value]=\"text ? text : null\"\n             [type]=\"type ? type : 'submit'\"\n             class=\"bg-transparent font-semibold\"\n             [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n             [attr.disabled]=\"isDisabled()\"\n             [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n             [attr.name]=\"name ? name : null\">\n    </span>\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n  </div>\n</ng-container>" }]
-        }], propDecorators: { hostTabIndex: [{
-                type: HostBinding,
-                args: ['attr.tabindex']
-            }], loaderText: [{
-                type: Input
-            }], loaderClasses: [{
-                type: Input
-            }], state: [{
-                type: Input
-            }], successText: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InnerContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[desyInnerContent]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { content: [{
+                type: Input,
+                args: ['desyInnerContent']
+            }], isHtml: [{
                 type: Input
-            }] } });
-
-class ContentComponent extends ContentBaseComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ContentComponent, selector: "desy-content", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'desy-content', template: "<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n" }]
-        }], propDecorators: { classes: [{
+            }], deleteContentIfEmpty: [{
                 type: Input
             }] } });
 
-function DesyContentChild(options) {
-    return (target, propertyKey) => {
-        const privateKeyName = `_${propertyKey}`;
-        const privateQueryListKeyName = `_${propertyKey}Querylist`;
-        Object.defineProperty(target, propertyKey, {
-            set(value) {
-                const queryList = value instanceof QueryList ? value : null;
-                if (queryList && !this[privateQueryListKeyName]) {
-                    this[privateQueryListKeyName] = queryList;
-                    queryList.changes.subscribe(() => {
-                        const previousValue = this[privateKeyName];
-                        this[privateKeyName] = queryList && queryList.length > 0 ? queryList.first : null;
-                        if (options && options.onSetCallbackName && this[options.onSetCallbackName] && this[privateKeyName]) {
-                            this[options.onSetCallbackName](this[privateKeyName]);
-                        }
-                        if (options && options.onDeleteCallbackName && this[options.onDeleteCallbackName] && previousValue && !this[privateKeyName]) {
-                            this[options.onDeleteCallbackName]();
-                        }
-                    });
-                    queryList.notifyOnChanges();
-                }
-            },
-            get() {
-                return this[privateKeyName];
-            }
-        });
-    };
-}
-
-class FocusUtils {
-    static getFirstFocusableElement(parent) {
-        const selectionableElements = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
-        let focusableList;
-        if (parent) {
-            focusableList = parent.querySelectorAll(selectionableElements);
-        }
-        else {
-            focusableList = document.querySelectorAll(selectionableElements);
-        }
-        if (!focusableList || focusableList.length === 0) {
-            return null;
-        }
-        let firstFocusable = null;
-        let i = 0;
-        while (i < focusableList.length) {
-            try {
-                const element = focusableList.item(i);
-                if (FocusUtils.isFocusable(element)) {
-                    firstFocusable = element;
-                    break;
-                }
-            }
-            catch (e) {
-            }
-            i++;
-        }
-        return firstFocusable;
-    }
-    static isFocusable(element) {
-        if (element.tabIndex > 0 || (element.tabIndex === 0 && element.getAttribute('tabIndex') !== null)) {
-            return true;
+const ACCESSIBILITY_ATTRIBUTES = [
+    'role',
+    'ariaLabel',
+    'ariaLabelledBy',
+    'ariaDescribedBy',
+    'ariaHidden',
+    'ariaDisabled',
+    'ariaControls',
+    'ariaCurrent',
+    'ariaLive',
+    'ariaExpanded',
+    'ariaErrorMessage',
+    'ariaHasPopup',
+    'ariaModal',
+    'ariaChecked',
+    'ariaPressed',
+    'ariaReadonly',
+    'ariaRequired',
+    'ariaSelected',
+    'ariaValuemin',
+    'ariaValuemax',
+    'ariaValuenow',
+    'ariaValuetext',
+    'ariaOrientation',
+    'ariaLevel',
+    'ariaMultiselectable',
+    'ariaPlaceholder',
+    'ariaPosinset',
+    'ariaSetsize',
+    'ariaSort',
+    'ariaBusy',
+    'ariaDropeffect',
+    'ariaGrabbed',
+    'ariaActivedescendant',
+    'ariaAtomic',
+    'ariaAutocomplete',
+    'ariaBraillelabel',
+    'ariaBrailleroledescription',
+    'ariaColcount',
+    'ariaColindex',
+    'ariaColindextext',
+    'ariaColspan',
+    'ariaDescription',
+    'ariaDetails',
+    'ariaFlowto',
+    'ariaInvalid',
+    'ariaKeyshortcuts',
+    'ariaOwns',
+    'ariaRelevant',
+    'ariaRoledescription',
+    'ariaRowcount',
+    'ariaRowindex',
+    'ariaRowindextext',
+    'ariaRowspan',
+    'tabindex',
+    'title',
+    'alt',
+    'lang',
+    'accesskey',
+    'autocomplete',
+    'autofocus',
+    'contenteditable',
+    'dir',
+    'draggable',
+    'enterkeyhint',
+    'hidden',
+    'inputmode',
+    'spellcheck',
+    'translate',
+    'ariaMultiline',
+    'for',
+    'form',
+    'headers',
+    'placeholder',
+    'readonly',
+    'required'
+];
+
+class AccessibilityDirective {
+    constructor(el, renderer, differs) {
+        this.el = el;
+        this.renderer = renderer;
+        this.differs = differs;
+        this.differ = this.differs.find({}).create();
+    }
+    ngOnChanges(changes) {
+        if (changes['accessibility']) {
+            this.applyAccessibilityAttributes();
+        }
+    }
+    ngDoCheck() {
+        if (this.accessibility) {
+            const changes = this.differ.diff(this.accessibility);
+            if (changes) {
+                this.applyAccessibilityAttributes();
+            }
+        }
+    }
+    applyAccessibilityAttributes() {
+        if (this.accessibility) {
+            Object.keys(this.accessibility).forEach(attr => {
+                if (ACCESSIBILITY_ATTRIBUTES.includes(attr) && this.accessibility[attr] !== null && this.accessibility[attr] !== undefined) {
+                    const htmlAttr = this.camelToKebabCase(attr);
+                    this.renderer.setAttribute(this.el.nativeElement, htmlAttr, this.accessibility[attr]);
+                }
+            });
+        }
+    }
+    camelToKebabCase(str) {
+        if (str === str.toLowerCase()) {
+            return str;
+        }
+        return str.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.KeyValueDiffers }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: { accessibility: ["desyAppAccessibility", "accessibility"] }, usesOnChanges: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AccessibilityDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[desyAppAccessibility]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.KeyValueDiffers }]; }, propDecorators: { accessibility: [{
+                type: Input,
+                args: ['desyAppAccessibility']
+            }] } });
+
+class ExternalHrefPipe {
+    transform(href) {
+        let externalHref;
+        if (href) {
+            if (href.match('http(s)?://') || href.match('mailto?:')) {
+                externalHref = href;
+            }
+            else {
+                externalHref = 'http://' + href;
+            }
+        }
+        else {
+            externalHref = '#';
+        }
+        return externalHref;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExternalHrefPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: ExternalHrefPipe, name: "externalHref" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExternalHrefPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'externalHref'
+                }]
+        }] });
+
+class ButtonComponent extends ContentBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.hostTabIndex = null;
+        this.clickEvent = new EventEmitter();
+        this.avoidingDoubleClick = false;
+    }
+    static { this.ELEMENT_A = 'a'; }
+    static { this.ELEMENT_BUTTON = 'button'; }
+    static { this.ELEMENT_INPUT = 'input'; }
+    ngOnInit() {
+        this.isHtml = Boolean(this.html);
+    }
+    onClick(event) {
+        if (this.preventDoubleClick) {
+            if (!this.avoidingDoubleClick) {
+                this.avoidingDoubleClick = true;
+                this.clickEvent.emit(event);
+                setTimeout(() => {
+                    this.avoidingDoubleClick = false;
+                }, 1000);
+            }
+            else {
+                event.preventDefault();
+            }
+        }
+        else {
+            this.clickEvent.emit(event);
+        }
+    }
+    getElement() {
+        let element;
+        if (this.element) {
+            element = this.element.toLocaleLowerCase();
+        }
+        else {
+            if (this.href) {
+                element = ButtonComponent.ELEMENT_A;
+            }
+            else {
+                element = ButtonComponent.ELEMENT_BUTTON;
+            }
+        }
+        return element;
+    }
+    getClassNames() {
+        let classNames = 'c-button';
+        if (this.classes) {
+            classNames += ' ' + this.classes;
+        }
+        if (this.disabled) {
+            classNames += ' c-button--disabled';
+        }
+        return classNames;
+    }
+    isDisabled() {
+        return this.disabled ? true : null;
+    }
+    get staticElementTypeA() {
+        return ButtonComponent.ELEMENT_A;
+    }
+    get staticElementTypeButton() {
+        return ButtonComponent.ELEMENT_BUTTON;
+    }
+    get staticElementTypeInput() {
+        return ButtonComponent.ELEMENT_INPUT;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonComponent, selector: "desy-button", inputs: { id: "id", classes: "classes", html: "html", text: "text", element: "element", name: "name", type: "type", value: "value", disabled: "disabled", href: "href", target: "target", preventDoubleClick: "preventDoubleClick", fragment: "fragment", routerLink: "routerLink", routerLinkActiveClasses: "routerLinkActiveClasses" }, outputs: { clickEvent: "clickEvent" }, host: { properties: { "attr.tabindex": "this.hostTabIndex" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n   <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n  <!-- routerLink modifica href, por eso se duplica para que no convivan en un mismo html -->\n     <a *ngIf=\"routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [routerLink]=\"routerLink\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n     <a *ngIf=\"!routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [href]=\"href | externalHref\"\n        [attr.target]=\"target ? target : null\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\" (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.type]=\"type ? type : null\"\n          [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n          [class]=\"getClassNames()\"\n          [attr.id]=\"id ? id : null\">\n    <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n  </button>\n\n  <input *ngSwitchCase=\"staticElementTypeInput\" (click)=\"onClick($event)\"\n         [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n         [attr.name]=\"name ? name : null\"\n         [value]=\"text ? text : null\"\n         [disabled]=\"isDisabled()\"\n         [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n         [desyAppAccessibility]=\"this\"\n         [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n         [attr.type]=\"type ? type : 'submit'\"\n         [class]=\"getClassNames()\"\n         [attr.id]=\"id ? id : null\">\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'desy-button', template: "<ng-template #contentTemplate>\n   <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n  <!-- routerLink modifica href, por eso se duplica para que no convivan en un mismo html -->\n     <a *ngIf=\"routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [routerLink]=\"routerLink\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n     <a *ngIf=\"!routerLink\" draggable=\"false\" (click)=\"onClick($event)\"\n        [href]=\"href | externalHref\"\n        [attr.target]=\"target ? target : null\"\n        [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n        [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n        [class]=\"getClassNames()\"\n        [desyAppAccessibility]=\"this\"\n        [attr.id]=\"id ? id : null\">\n       <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n     </a>\n\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\" (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.type]=\"type ? type : null\"\n          [desyInnerContent]=\"html ? html : text\" [isHtml]=\"isHtml\" [deleteContentIfEmpty]=\"false\"\n          [class]=\"getClassNames()\"\n          [attr.id]=\"id ? id : null\">\n    <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n  </button>\n\n  <input *ngSwitchCase=\"staticElementTypeInput\" (click)=\"onClick($event)\"\n         [routerLink]=\"routerLink ? routerLink : null\" [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\" [fragment]=\"fragment\"\n         [attr.name]=\"name ? name : null\"\n         [value]=\"text ? text : null\"\n         [disabled]=\"isDisabled()\"\n         [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n         [desyAppAccessibility]=\"this\"\n         [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n         [attr.type]=\"type ? type : 'submit'\"\n         [class]=\"getClassNames()\"\n         [attr.id]=\"id ? id : null\">\n</ng-container>\n" }]
+        }], propDecorators: { hostTabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
+            }], id: [{
+                type: Input
+            }], classes: [{
+                type: Input
+            }], html: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], element: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], href: [{
+                type: Input
+            }], target: [{
+                type: Input
+            }], preventDoubleClick: [{
+                type: Input
+            }], fragment: [{
+                type: Input
+            }], routerLink: [{
+                type: Input
+            }], routerLinkActiveClasses: [{
+                type: Input
+            }], clickEvent: [{
+                type: Output
+            }] } });
+
+class ButtonLoaderComponent extends ButtonComponent {
+    constructor() {
+        super(...arguments);
+        this.stateLoading = ButtonLoaderComponent.STATE_LOADING;
+        this.stateSuccess = ButtonLoaderComponent.STATE_SUCCESS;
+        this.hostTabIndex = null;
+    }
+    static { this.STATE_LOADING = 'is-loading'; }
+    static { this.STATE_SUCCESS = 'is-success'; }
+    static { this.DEFAULT_LOADER_TEXT = 'Acción en curso'; }
+    static { this.DEFAULT_SUCCESS_TEXT = 'Acción realizada con éxito'; }
+    ngOnInit() {
+        this.isHtml = Boolean(this.html);
+    }
+    getClassNames() {
+        let classNames = 'c-button-loader relative';
+        if (this.classes) {
+            classNames += ' ' + this.classes;
+        }
+        if (this.disabled) {
+            classNames += ' c-button-loader--disabled';
+        }
+        return classNames;
+    }
+    getSpinnerText() {
+        let spinnerText = null;
+        if (this.state === ButtonLoaderComponent.STATE_LOADING) {
+            spinnerText = this.loaderText ? this.loaderText : ButtonLoaderComponent.DEFAULT_LOADER_TEXT;
+        }
+        return spinnerText;
+    }
+    getSuccessText() {
+        let successText = null;
+        if (this.state === ButtonLoaderComponent.STATE_SUCCESS) {
+            successText = this.successText ? this.successText : ButtonLoaderComponent.DEFAULT_SUCCESS_TEXT;
+        }
+        return successText;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonLoaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonLoaderComponent, selector: "desy-button-loader", inputs: { loaderText: "loaderText", loaderClasses: "loaderClasses", state: "state", successText: "successText" }, host: { properties: { "attr.tabindex": "this.hostTabIndex" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #spinnerTemplate>\n  <span class=\"c-button-loader__spinner flex items-center justify-center absolute inset-0\">\n    <desy-spinner [text]=\"getSpinnerText() ? getSpinnerText() : 'Acci\u00F3n en curso'\"\n                  [classes]=\"loaderClasses\"></desy-spinner>\n  </span>\n</ng-template>\n\n<ng-template #successTemplate>\n  <span class=\"c-button-loader__success flex items-center justify-center absolute inset-0\">\n    <span class=\"sr-only\"\n          role=\"alert\"\n          aria-live=\"assertive\">{{ getSuccessText() }}</span>\n    <span aria-hidden=\"true\"><svg xmlns=\"http://www.w3.org/2000/svg\"\n           viewBox=\"0 0 48 48\"\n           aria-hidden=\"true\"\n           width=\"1em\"\n           height=\"1em\">\n        <path d=\"M13.714 42.857A6.857 6.857 0 0 1 8.4 40.183L.857 31.646a3.429 3.429 0 0 1 .309-4.869A3.429 3.429 0 0 1 6 27.12l7.063 7.989a.72.72 0 0 0 .617.308.789.789 0 0 0 .617-.274L42.103 6.206a3.429 3.429 0 0 1 4.937 4.731L18.926 40.526a6.651 6.651 0 0 1-5.212 2.331Z\"\n              fill=\"currentColor\"></path>\n      </svg></span>\n  </span>\n</ng-template>\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n    <a *ngIf=\"routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n\n    <a *ngIf=\"!routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [href]=\"href | externalHref\"\n       [attr.target]=\"target ? target : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\"\n          (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\"\n          [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [attr.disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.id]=\"id ? id : null\"\n          [attr.type]=\"type ? type : null\"\n          [class]=\"getClassNames()\">\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n    <span class=\"c-button-loader__content inline-flex align-baseline\"\n          [desyInnerContent]=\"html ? html : text\"\n          [isHtml]=\"isHtml\"\n          [deleteContentIfEmpty]=\"false\"> <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n  </button>\n\n  <div *ngSwitchCase=\"staticElementTypeInput\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink ? routerLink : null\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       [desyAppAccessibility]=\"this\"\n       [attr.id]=\"id ? id : null\"\n       [class]=\"getClassNames()\">\n    <span class=\"c-button-loader__content inline-flex align-baseline\">\n      <input [value]=\"text ? text : null\"\n             [type]=\"type ? type : 'submit'\"\n             class=\"bg-transparent font-semibold\"\n             [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n             [attr.disabled]=\"isDisabled()\"\n             [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n             [attr.name]=\"name ? name : null\">\n    </span>\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n  </div>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: SpinnerComponent, selector: "desy-spinner", inputs: ["text", "classes", "id"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonLoaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'desy-button-loader', template: "<ng-template #spinnerTemplate>\n  <span class=\"c-button-loader__spinner flex items-center justify-center absolute inset-0\">\n    <desy-spinner [text]=\"getSpinnerText() ? getSpinnerText() : 'Acci\u00F3n en curso'\"\n                  [classes]=\"loaderClasses\"></desy-spinner>\n  </span>\n</ng-template>\n\n<ng-template #successTemplate>\n  <span class=\"c-button-loader__success flex items-center justify-center absolute inset-0\">\n    <span class=\"sr-only\"\n          role=\"alert\"\n          aria-live=\"assertive\">{{ getSuccessText() }}</span>\n    <span aria-hidden=\"true\"><svg xmlns=\"http://www.w3.org/2000/svg\"\n           viewBox=\"0 0 48 48\"\n           aria-hidden=\"true\"\n           width=\"1em\"\n           height=\"1em\">\n        <path d=\"M13.714 42.857A6.857 6.857 0 0 1 8.4 40.183L.857 31.646a3.429 3.429 0 0 1 .309-4.869A3.429 3.429 0 0 1 6 27.12l7.063 7.989a.72.72 0 0 0 .617.308.789.789 0 0 0 .617-.274L42.103 6.206a3.429 3.429 0 0 1 4.937 4.731L18.926 40.526a6.651 6.651 0 0 1-5.212 2.331Z\"\n              fill=\"currentColor\"></path>\n      </svg></span>\n  </span>\n</ng-template>\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n<ng-container [ngSwitch]=\"getElement()\">\n  <ng-container *ngSwitchCase=\"staticElementTypeA\">\n    <a *ngIf=\"routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n\n    <a *ngIf=\"!routerLink\"\n       draggable=\"false\"\n       (click)=\"onClick($event)\"\n       [href]=\"href | externalHref\"\n       [attr.target]=\"target ? target : null\"\n       [attr.tabindex]=\"tabindex ? tabindex : (isDisabled() ? -1 : null)\"\n       role=\"button\"\n       [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\"\n       [class]=\"getClassNames()\">\n      <ng-container *ngIf=\"state===stateLoading\">\n        <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n      </ng-container>\n      <ng-container *ngIf=\"state===stateSuccess\">\n        <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n      </ng-container>\n      <span class=\"c-button-loader__content inline-flex align-baseline\"\n            [desyInnerContent]=\"html ? html : text\"\n            [isHtml]=\"isHtml\"\n            [deleteContentIfEmpty]=\"false\"><ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n    </a>\n  </ng-container>\n\n  <button *ngSwitchCase=\"staticElementTypeButton\"\n          (click)=\"onClick($event)\"\n          [routerLink]=\"routerLink ? routerLink : null\"\n          [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n          [attr.name]=\"name ? name : null\"\n          [attr.value]=\"value ? value : null\"\n          [attr.disabled]=\"isDisabled()\"\n          [desyAppAccessibility]=\"this\"\n          [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n          [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n          [attr.id]=\"id ? id : null\"\n          [attr.type]=\"type ? type : null\"\n          [class]=\"getClassNames()\">\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n    <span class=\"c-button-loader__content inline-flex align-baseline\"\n          [desyInnerContent]=\"html ? html : text\"\n          [isHtml]=\"isHtml\"\n          [deleteContentIfEmpty]=\"false\"> <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container></span>\n  </button>\n\n  <div *ngSwitchCase=\"staticElementTypeInput\"\n       (click)=\"onClick($event)\"\n       [routerLink]=\"routerLink ? routerLink : null\"\n       [routerLinkActive]=\"routerLinkActiveClasses ? routerLinkActiveClasses : []\"\n       [desyAppAccessibility]=\"this\"\n       [attr.id]=\"id ? id : null\"\n       [class]=\"getClassNames()\">\n    <span class=\"c-button-loader__content inline-flex align-baseline\">\n      <input [value]=\"text ? text : null\"\n             [type]=\"type ? type : 'submit'\"\n             class=\"bg-transparent font-semibold\"\n             [attr.data-prevent-double-click]=\"preventDoubleClick ? 'true' : null\"\n             [attr.disabled]=\"isDisabled()\"\n             [attr.aria-disabled]=\"isDisabled() ? 'true' : (ariaDisabled ? ariaDisabled : null)\"\n             [attr.name]=\"name ? name : null\">\n    </span>\n    <ng-container *ngIf=\"state===stateLoading\">\n      <ng-container *ngTemplateOutlet=\"spinnerTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"state===stateSuccess\">\n      <ng-container *ngTemplateOutlet=\"successTemplate\"></ng-container>\n    </ng-container>\n  </div>\n</ng-container>" }]
+        }], propDecorators: { hostTabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
+            }], loaderText: [{
+                type: Input
+            }], loaderClasses: [{
+                type: Input
+            }], state: [{
+                type: Input
+            }], successText: [{
+                type: Input
+            }] } });
+
+class ContentComponent extends ContentBaseComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ContentComponent, selector: "desy-content", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'desy-content', template: "<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n" }]
+        }], propDecorators: { classes: [{
+                type: Input
+            }] } });
+
+function DesyContentChild(options) {
+    return (target, propertyKey) => {
+        const privateKeyName = `_${propertyKey}`;
+        const privateQueryListKeyName = `_${propertyKey}Querylist`;
+        Object.defineProperty(target, propertyKey, {
+            set(value) {
+                const queryList = value instanceof QueryList ? value : null;
+                if (queryList && !this[privateQueryListKeyName]) {
+                    this[privateQueryListKeyName] = queryList;
+                    queryList.changes.subscribe(() => {
+                        const previousValue = this[privateKeyName];
+                        this[privateKeyName] = queryList && queryList.length > 0 ? queryList.first : null;
+                        if (options && options.onSetCallbackName && this[options.onSetCallbackName] && this[privateKeyName]) {
+                            this[options.onSetCallbackName](this[privateKeyName]);
+                        }
+                        if (options && options.onDeleteCallbackName && this[options.onDeleteCallbackName] && previousValue && !this[privateKeyName]) {
+                            this[options.onDeleteCallbackName]();
+                        }
+                    });
+                    queryList.notifyOnChanges();
+                }
+            },
+            get() {
+                return this[privateKeyName];
+            }
+        });
+    };
+}
+
+class FocusUtils {
+    static getFirstFocusableElement(parent) {
+        const selectionableElements = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
+        let focusableList;
+        if (parent) {
+            focusableList = parent.querySelectorAll(selectionableElements);
+        }
+        else {
+            focusableList = document.querySelectorAll(selectionableElements);
+        }
+        if (!focusableList || focusableList.length === 0) {
+            return null;
+        }
+        let firstFocusable = null;
+        let i = 0;
+        while (i < focusableList.length) {
+            try {
+                const element = focusableList.item(i);
+                if (FocusUtils.isFocusable(element)) {
+                    firstFocusable = element;
+                    break;
+                }
+            }
+            catch (e) {
+            }
+            i++;
+        }
+        return firstFocusable;
+    }
+    static isFocusable(element) {
+        if (element.tabIndex > 0 || (element.tabIndex === 0 && element.getAttribute('tabIndex') !== null)) {
+            return true;
         }
         if (element.disabled) {
             return false;
@@ -1320,7 +1320,8 @@ class CustomInnerContentDirective {
     ngOnChanges(changes) {
         this.viewContainerRef.clear();
         if (this.desyCustomInnerContent.component && this.desyCustomInnerContent.component instanceof ContentBaseComponent) {
-            this.viewContainerRef.createEmbeddedView(this.desyCustomInnerContent.component.getContent());
+            const embeddedView = this.viewContainerRef.createEmbeddedView(this.desyCustomInnerContent.component.getContent());
+            this.emitContentToParent(embeddedView);
         }
         else if (this.desyCustomInnerContent.template) {
             this.viewContainerRef.createEmbeddedView(this.desyCustomInnerContent.template);
@@ -1331,12 +1332,28 @@ class CustomInnerContentDirective {
             const nodeList = [];
             tmpWrapper.childNodes.forEach(node => nodeList.push(node));
             const componentRef = this.factory.create(this.injector, [nodeList]);
-            this.viewContainerRef.createEmbeddedView(componentRef.instance.getContent());
+            const embeddedView = this.viewContainerRef.createEmbeddedView(componentRef.instance.getContent());
+            this.emitContentToParent(embeddedView);
         }
         else if (this.desyCustomInnerContent.text) {
             const textNode = document.createTextNode(this.desyCustomInnerContent.text);
             const componentRef = this.factory.create(this.injector, [[textNode]]);
-            this.viewContainerRef.createEmbeddedView(componentRef.instance.getContent());
+            const embeddedView = this.viewContainerRef.createEmbeddedView(componentRef.instance.getContent());
+            this.emitContentToParent(embeddedView);
+        }
+    }
+    emitContentToParent(embeddedView) {
+        if (this.desyCustomInnerContent.parentComponent && typeof this.desyCustomInnerContent.parentComponent.handleContentExtracted === 'function') {
+            let textContent = '';
+            embeddedView.rootNodes.forEach(node => {
+                if (node.nodeType === Node.TEXT_NODE) {
+                    textContent += node.textContent.trim() + ' ';
+                }
+                else if (node.nodeType === Node.ELEMENT_NODE) {
+                    textContent += node.innerText.trim() + ' ';
+                }
+            });
+            this.desyCustomInnerContent.parentComponent.handleContentExtracted(textContent.trim());
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomInnerContentDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive }); }
@@ -3580,7 +3597,7 @@ class DateInputComponent extends FormFieldComponent {
                 useExisting: forwardRef(() => DateInputComponent),
                 multi: true
             }
-        ], queries: [{ propertyName: "fieldsetComponent", predicate: FieldsetComponent }, { propertyName: "errorMessageComponent", predicate: ErrorMessageComponent }, { propertyName: "legendComponent", predicate: LegendComponent }, { propertyName: "dateInputItemComponents", predicate: DateInputItemComponent }], viewQueries: [{ propertyName: "innerHtml", first: true, predicate: ["innerHtml"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-template #innerHtml>\n  <ng-container *ngIf=\"hasHintComponent()\">\n    <ng-content select=\"desy-hint\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasHintComponent()\">\n    <ng-container *ngTemplateOutlet=\"hintRef\"></ng-container>\n    <desy-hint *ngIf=\"!hintRef && hintData\"\n               [id]=\"getHintId()\"\n               [text]=\"hintData.text\"\n               [html]=\"hintData.html\"\n               [classes]=\"hintData.classes\"\n               [role]=\"hintData.role\"\n               [ariaLabel]=\"hintData.ariaLabel\"\n               [ariaDescribedBy]=\"hintData.ariaDescribedBy\"\n               [ariaLabelledBy]=\"hintData.ariaLabelledBy\"\n               [ariaHidden]=\"hintData.ariaHidden\"\n               [ariaDisabled]=\"hintData.ariaDisabled\"\n               [ariaControls]=\"hintData.ariaControls\"\n               [ariaCurrent]=\"hintData.ariaCurrent\"\n               [ariaLive]=\"hintData.ariaLive\"\n               [ariaExpanded]=\"hintData.ariaExpanded\"\n               [ariaErrorMessage]=\"hintData.ariaErrorMessage\"\n               [ariaHasPopup]=\"hintData.ariaHasPopup\"\n               [tabindex]=\"hintData.tabindex\"></desy-hint>\n    <desy-hint *ngIf=\"!hintRef && !hintData && hintText\"\n               [text]=\"hintText\"\n               [id]=\"getHintId()\"></desy-hint>\n  </ng-container>\n\n\n  <ng-container *ngIf=\"hasErrorMessageComponent()\">\n    <ng-content select=\"desy-error-message\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasErrorMessageComponent()\">\n    <ng-container *ngTemplateOutlet=\"errorMessageRef\"></ng-container>\n    <desy-error-message *ngIf=\"!errorMessageRef && errorMessageData\"\n                        [id]=\"getErrorId()\"\n                        [text]=\"errorMessageData.text\"\n                        [html]=\"errorMessageData.html\"\n                        [classes]=\"errorMessageData.classes\"\n                        [visuallyHiddenText]=\"errorMessageData.visuallyHiddenText\"\n                        [role]=\"errorMessageData.role\"\n                        [ariaLabel]=\"errorMessageData.ariaLabel\"\n                        [ariaDescribedBy]=\"errorMessageData.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"errorMessageData.ariaLabelledBy\"\n                        [ariaHidden]=\"errorMessageData.ariaHidden\"\n                        [ariaDisabled]=\"errorMessageData.ariaDisabled\"\n                        [ariaControls]=\"errorMessageData.ariaControls\"\n                        [ariaCurrent]=\"errorMessageData.ariaCurrent\"\n                        [ariaLive]=\"errorMessageData.ariaLive\"\n                        [ariaExpanded]=\"errorMessageData.ariaExpanded\"\n                        [ariaErrorMessage]=\"errorMessageData.ariaErrorMessage\"\n                        [ariaHasPopup]=\"errorMessageData.ariaHasPopup\"\n                        [tabindex]=\"errorMessageData.tabindex\"></desy-error-message>\n    <desy-error-message *ngIf=\"!errorMessageRef && !errorMessageData && errorMessageText\"\n                        [text]=\"errorMessageText\"\n                        [id]=\"getErrorId()\"></desy-error-message>\n  </ng-container>\n\n  <!-- With reactive forms -->\n  <div *ngIf=\"controlContainer && !ngModelGroup\"\n       [formGroup]=\"ogFormGroup\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [formControlName]=\"getItemName(item)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <!-- Template-driven forms -->\n  <desy-template-driven-wrapper *ngIf=\"controlContainer && ngModelGroup\">\n    <div [ngModelGroup]=\"ngModelGroup\"\n         [class]=\"['flex', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n      <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n        <ng-container *ngIf=\"item.divider\">\n          <div role=\"separator\"\n               [ngClass]=\"item.divider.classes\">\n            <ng-container\n                          *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n          </div>\n        </ng-container>\n        <ng-container *ngIf=\"!item.divider\">\n          <div class=\"mr-base\">\n            <desy-input [labelData]=\"getItemLabel(item)\"\n                        [labelRef]=\"getItemLabelRef(item)\"\n                        [id]=\"item.id ? item.id : id + '-' + item.name\"\n                        [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                        [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                        [name]=\"getItemName(item)\"\n                        [ngModel]=\"item.value\"\n                        (ngModelChange)=\"onInternalChange(item, +$event)\"\n                        [type]=\"'text'\"\n                        [inputmode]=\"'numeric'\"\n                        [autocomplete]=\"item.autocomplete\"\n                        [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                        [disabled]=\"disabled ? true : null\"\n                        [placeholder]=\"item.placeholder\"\n                        [maxlength]=\"item.maxlength\"\n                        [role]=\"item.role\"\n                        [ariaLabel]=\"item.ariaLabel\"\n                        [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                        [ariaHidden]=\"item.ariaHidden\"\n                        [ariaDisabled]=\"item.ariaDisabled\"\n                        [ariaControls]=\"item.ariaControls\"\n                        [ariaCurrent]=\"item.ariaCurrent\"\n                        [ariaLive]=\"item.ariaLive\"\n                        [ariaExpanded]=\"item.ariaExpanded\"\n                        [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                        [ariaHasPopup]=\"item.ariaHasPopup\"\n                        [tabindex]=\"item.tabindex\"\n                        [ariaModal]=\"item.ariaModal\"\n                        [ariaChecked]=\"item.ariaChecked\"\n                        [ariaPressed]=\"item.ariaPressed\"\n                        [ariaReadonly]=\"item.ariaReadonly\"\n                        [ariaRequired]=\"item.ariaRequired\"\n                        [ariaSelected]=\"item.ariaSelected\"\n                        [ariaValuemin]=\"item.ariaValuemin\"\n                        [ariaValuemax]=\"item.ariaValuemax\"\n                        [ariaValuenow]=\"item.ariaValuenow\"\n                        [ariaValuetext]=\"item.ariaValuetext\"\n                        [ariaOrientation]=\"item.ariaOrientation\"\n                        [ariaLevel]=\"item.ariaLevel\"\n                        [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                        [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                        [ariaPosinset]=\"item.ariaPosinset\"\n                        [ariaSetsize]=\"item.ariaSetsize\"\n                        [ariaSort]=\"item.ariaSort\"\n                        [ariaBusy]=\"item.ariaBusy\"\n                        [ariaDropeffect]=\"item.ariaDropeffect\"\n                        [ariaGrabbed]=\"item.ariaGrabbed\"\n                        [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                        [ariaAtomic]=\"item.ariaAtomic\"\n                        [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                        [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                        [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                        [ariaColcount]=\"item.ariaColcount\"\n                        [ariaColindex]=\"item.ariaColindex\"\n                        [ariaColindextext]=\"item.ariaColindextext\"\n                        [ariaColspan]=\"item.ariaColspan\"\n                        [ariaDescription]=\"item.ariaDescription\"\n                        [ariaDetails]=\"item.ariaDetails\"\n                        [ariaFlowto]=\"item.ariaFlowto\"\n                        [ariaInvalid]=\"item.ariaInvalid\"\n                        [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                        [ariaOwns]=\"item.ariaOwns\"\n                        [ariaRelevant]=\"item.ariaRelevant\"\n                        [ariaRoledescription]=\"item.ariaRoledescription\"\n                        [ariaRowcount]=\"item.ariaRowcount\"\n                        [ariaRowindex]=\"item.ariaRowindex\"\n                        [ariaRowindextext]=\"item.ariaRowindextext\"\n                        [ariaRowspan]=\"item.ariaRowspan\"\n                        [title]=\"item.title\"\n                        [alt]=\"item.alt\"\n                        [lang]=\"item.lang\"\n                        [accesskey]=\"item.accesskey\"\n                        [autofocus]=\"item.autofocus\"\n                        [contenteditable]=\"item.contenteditable\"\n                        [dir]=\"item.dir\"\n                        [draggable]=\"item.draggable\"\n                        [enterkeyhint]=\"item.enterkeyhint\"\n                        [hidden]=\"item.hidden\"\n                        [spellcheck]=\"item.spellcheck\"\n                        [translate]=\"item.translate\"\n                        [ariaMultiline]=\"item.ariaMultiline\"\n                        [for]=\"item.for\"\n                        [form]=\"item.form\"\n                        [headers]=\"item.headers\"\n                        [readonly]=\"item.readonly\"\n                        [required]=\"item.required\"></desy-input>\n          </div>\n        </ng-container>\n      </ng-container>\n    </div>\n  </desy-template-driven-wrapper>\n\n  <!-- With ngModel-->\n  <div *ngIf=\"!controlContainer\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [ngModel]=\"item.value\"\n                      (ngModelChange)=\"onInternalChange(item, +$event)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [disabled]=\"disabled ? true : null\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-container *ngIf=\"hasFieldsetComponent()\">\n  <ng-content select=\"desy-fieldset\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"!hasFieldsetComponent()\">\n  <desy-fieldset *ngIf=\"fieldsetData\"\n                 [classes]=\"fieldsetData.classes\"\n                 [id]=\"fieldsetData.id\"\n                 [legendData]=\"fieldsetData.legend\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[fieldsetData.describedBy, getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"\n                 [ariaLabel]=\"fieldsetData.ariaLabel\"\n                 [ariaLabelledBy]=\"fieldsetData.ariaLabelledBy\"\n                 [ariaHidden]=\"fieldsetData.ariaHidden\"\n                 [ariaDisabled]=\"fieldsetData.ariaDisabled\"\n                 [ariaControls]=\"fieldsetData.ariaControls\"\n                 [ariaCurrent]=\"fieldsetData.ariaCurrent\"\n                 [ariaLive]=\"fieldsetData.ariaLive\"\n                 [ariaExpanded]=\"fieldsetData.ariaExpanded\"\n                 [ariaHasPopup]=\"fieldsetData.ariaHasPopup\"\n                 [tabindex]=\"fieldsetData.tabindex\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && hasLegendComponent()\"\n                 [legendRef]=\"legendTemplate\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\">\n    <ng-template #legendTemplate>\n      <ng-content select=\"desy-legend\"></ng-content>\n    </ng-template>\n  </desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && legendRef\"\n                 [legendRef]=\"legendRef\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && legendData\"\n                 [legendData]=\"{text: legendData.text, html: legendData.html,  classes: legendData.classes, isPageHeading: legendData.isPageHeading}\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && !legendData && legendText\"\n                 [legendText]=\"legendText\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n</ng-container>\n\n<ng-container *ngIf=\"!hasFieldset()\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: TemplateDrivenWrapperComponent, selector: "desy-template-driven-wrapper" }, { kind: "component", type: HintComponent, selector: "desy-hint", inputs: ["id", "classes", "html", "text"] }, { kind: "component", type: ErrorMessageComponent, selector: "desy-error-message", inputs: ["id", "classes", "html", "text", "visuallyHiddenText"] }, { kind: "component", type: FieldsetComponent, selector: "desy-fieldset", inputs: ["describedBy", "errorId", "legendRef", "legendData", "legendText", "classes", "caller", "id", "headingLevel"] }, { kind: "component", type: InputComponent, selector: "desy-input", inputs: ["name", "type", "describedBy", "pattern", "inputmode", "placeholder", "formGroupClasses", "classes", "autocomplete", "maxlength", "errorId", "attributes"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
+        ], queries: [{ propertyName: "fieldsetComponent", predicate: FieldsetComponent }, { propertyName: "errorMessageComponent", predicate: ErrorMessageComponent }, { propertyName: "legendComponent", predicate: LegendComponent }, { propertyName: "dateInputItemComponents", predicate: DateInputItemComponent }], viewQueries: [{ propertyName: "innerHtml", first: true, predicate: ["innerHtml"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-template #innerHtml>\n  <ng-container *ngIf=\"hasHintComponent()\">\n    <ng-content select=\"desy-hint\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasHintComponent()\">\n    <ng-container *ngTemplateOutlet=\"hintRef\"></ng-container>\n    <desy-hint *ngIf=\"!hintRef && hintData\"\n               [id]=\"getHintId()\"\n               [text]=\"hintData.text\"\n               [html]=\"hintData.html\"\n               [classes]=\"hintData.classes\"\n               [role]=\"hintData.role\"\n               [ariaLabel]=\"hintData.ariaLabel\"\n               [ariaDescribedBy]=\"hintData.ariaDescribedBy\"\n               [ariaLabelledBy]=\"hintData.ariaLabelledBy\"\n               [ariaHidden]=\"hintData.ariaHidden\"\n               [ariaDisabled]=\"hintData.ariaDisabled\"\n               [ariaControls]=\"hintData.ariaControls\"\n               [ariaCurrent]=\"hintData.ariaCurrent\"\n               [ariaLive]=\"hintData.ariaLive\"\n               [ariaExpanded]=\"hintData.ariaExpanded\"\n               [ariaErrorMessage]=\"hintData.ariaErrorMessage\"\n               [ariaHasPopup]=\"hintData.ariaHasPopup\"\n               [tabindex]=\"hintData.tabindex\"></desy-hint>\n    <desy-hint *ngIf=\"!hintRef && !hintData && hintText\"\n               [text]=\"hintText\"\n               [id]=\"getHintId()\"></desy-hint>\n  </ng-container>\n\n\n  <ng-container *ngIf=\"hasErrorMessageComponent()\">\n    <ng-content select=\"desy-error-message\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasErrorMessageComponent()\">\n    <ng-container *ngTemplateOutlet=\"errorMessageRef\"></ng-container>\n    <desy-error-message *ngIf=\"!errorMessageRef && errorMessageData\"\n                        [id]=\"getErrorId()\"\n                        [text]=\"errorMessageData.text\"\n                        [html]=\"errorMessageData.html\"\n                        [classes]=\"errorMessageData.classes\"\n                        [visuallyHiddenText]=\"errorMessageData.visuallyHiddenText\"\n                        [role]=\"errorMessageData.role\"\n                        [ariaLabel]=\"errorMessageData.ariaLabel\"\n                        [ariaDescribedBy]=\"errorMessageData.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"errorMessageData.ariaLabelledBy\"\n                        [ariaHidden]=\"errorMessageData.ariaHidden\"\n                        [ariaDisabled]=\"errorMessageData.ariaDisabled\"\n                        [ariaControls]=\"errorMessageData.ariaControls\"\n                        [ariaCurrent]=\"errorMessageData.ariaCurrent\"\n                        [ariaLive]=\"errorMessageData.ariaLive\"\n                        [ariaExpanded]=\"errorMessageData.ariaExpanded\"\n                        [ariaErrorMessage]=\"errorMessageData.ariaErrorMessage\"\n                        [ariaHasPopup]=\"errorMessageData.ariaHasPopup\"\n                        [tabindex]=\"errorMessageData.tabindex\"></desy-error-message>\n    <desy-error-message *ngIf=\"!errorMessageRef && !errorMessageData && errorMessageText\"\n                        [text]=\"errorMessageText\"\n                        [id]=\"getErrorId()\"></desy-error-message>\n  </ng-container>\n\n  <!-- With reactive forms -->\n  <div *ngIf=\"controlContainer && !ngModelGroup\"\n       [formGroup]=\"ogFormGroup\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [formControlName]=\"getItemName(item)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [disabled]=\"disabled ? true : null\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <!-- Template-driven forms -->\n  <desy-template-driven-wrapper *ngIf=\"controlContainer && ngModelGroup\">\n    <div [ngModelGroup]=\"ngModelGroup\"\n         [class]=\"['flex', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n      <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n        <ng-container *ngIf=\"item.divider\">\n          <div role=\"separator\"\n               [ngClass]=\"item.divider.classes\">\n            <ng-container\n                          *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n          </div>\n        </ng-container>\n        <ng-container *ngIf=\"!item.divider\">\n          <div class=\"mr-base\">\n            <desy-input [labelData]=\"getItemLabel(item)\"\n                        [labelRef]=\"getItemLabelRef(item)\"\n                        [id]=\"item.id ? item.id : id + '-' + item.name\"\n                        [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                        [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                        [name]=\"getItemName(item)\"\n                        [ngModel]=\"item.value\"\n                        (ngModelChange)=\"onInternalChange(item, +$event)\"\n                        [type]=\"'text'\"\n                        [inputmode]=\"'numeric'\"\n                        [autocomplete]=\"item.autocomplete\"\n                        [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                        [disabled]=\"disabled ? true : null\"\n                        [placeholder]=\"item.placeholder\"\n                        [maxlength]=\"item.maxlength\"\n                        [role]=\"item.role\"\n                        [ariaLabel]=\"item.ariaLabel\"\n                        [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                        [ariaHidden]=\"item.ariaHidden\"\n                        [ariaDisabled]=\"item.ariaDisabled\"\n                        [ariaControls]=\"item.ariaControls\"\n                        [ariaCurrent]=\"item.ariaCurrent\"\n                        [ariaLive]=\"item.ariaLive\"\n                        [ariaExpanded]=\"item.ariaExpanded\"\n                        [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                        [ariaHasPopup]=\"item.ariaHasPopup\"\n                        [tabindex]=\"item.tabindex\"\n                        [ariaModal]=\"item.ariaModal\"\n                        [ariaChecked]=\"item.ariaChecked\"\n                        [ariaPressed]=\"item.ariaPressed\"\n                        [ariaReadonly]=\"item.ariaReadonly\"\n                        [ariaRequired]=\"item.ariaRequired\"\n                        [ariaSelected]=\"item.ariaSelected\"\n                        [ariaValuemin]=\"item.ariaValuemin\"\n                        [ariaValuemax]=\"item.ariaValuemax\"\n                        [ariaValuenow]=\"item.ariaValuenow\"\n                        [ariaValuetext]=\"item.ariaValuetext\"\n                        [ariaOrientation]=\"item.ariaOrientation\"\n                        [ariaLevel]=\"item.ariaLevel\"\n                        [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                        [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                        [ariaPosinset]=\"item.ariaPosinset\"\n                        [ariaSetsize]=\"item.ariaSetsize\"\n                        [ariaSort]=\"item.ariaSort\"\n                        [ariaBusy]=\"item.ariaBusy\"\n                        [ariaDropeffect]=\"item.ariaDropeffect\"\n                        [ariaGrabbed]=\"item.ariaGrabbed\"\n                        [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                        [ariaAtomic]=\"item.ariaAtomic\"\n                        [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                        [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                        [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                        [ariaColcount]=\"item.ariaColcount\"\n                        [ariaColindex]=\"item.ariaColindex\"\n                        [ariaColindextext]=\"item.ariaColindextext\"\n                        [ariaColspan]=\"item.ariaColspan\"\n                        [ariaDescription]=\"item.ariaDescription\"\n                        [ariaDetails]=\"item.ariaDetails\"\n                        [ariaFlowto]=\"item.ariaFlowto\"\n                        [ariaInvalid]=\"item.ariaInvalid\"\n                        [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                        [ariaOwns]=\"item.ariaOwns\"\n                        [ariaRelevant]=\"item.ariaRelevant\"\n                        [ariaRoledescription]=\"item.ariaRoledescription\"\n                        [ariaRowcount]=\"item.ariaRowcount\"\n                        [ariaRowindex]=\"item.ariaRowindex\"\n                        [ariaRowindextext]=\"item.ariaRowindextext\"\n                        [ariaRowspan]=\"item.ariaRowspan\"\n                        [title]=\"item.title\"\n                        [alt]=\"item.alt\"\n                        [lang]=\"item.lang\"\n                        [accesskey]=\"item.accesskey\"\n                        [autofocus]=\"item.autofocus\"\n                        [contenteditable]=\"item.contenteditable\"\n                        [dir]=\"item.dir\"\n                        [draggable]=\"item.draggable\"\n                        [enterkeyhint]=\"item.enterkeyhint\"\n                        [hidden]=\"item.hidden\"\n                        [spellcheck]=\"item.spellcheck\"\n                        [translate]=\"item.translate\"\n                        [ariaMultiline]=\"item.ariaMultiline\"\n                        [for]=\"item.for\"\n                        [form]=\"item.form\"\n                        [headers]=\"item.headers\"\n                        [readonly]=\"item.readonly\"\n                        [required]=\"item.required\"></desy-input>\n          </div>\n        </ng-container>\n      </ng-container>\n    </div>\n  </desy-template-driven-wrapper>\n\n  <!-- With ngModel-->\n  <div *ngIf=\"!controlContainer\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [ngModel]=\"item.value\"\n                      (ngModelChange)=\"onInternalChange(item, +$event)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [disabled]=\"disabled ? true : null\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-container *ngIf=\"hasFieldsetComponent()\">\n  <ng-content select=\"desy-fieldset\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"!hasFieldsetComponent()\">\n  <desy-fieldset *ngIf=\"fieldsetData\"\n                 [classes]=\"fieldsetData.classes\"\n                 [id]=\"fieldsetData.id\"\n                 [legendData]=\"fieldsetData.legend\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[fieldsetData.describedBy, getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"\n                 [ariaLabel]=\"fieldsetData.ariaLabel\"\n                 [ariaLabelledBy]=\"fieldsetData.ariaLabelledBy\"\n                 [ariaHidden]=\"fieldsetData.ariaHidden\"\n                 [ariaDisabled]=\"fieldsetData.ariaDisabled\"\n                 [ariaControls]=\"fieldsetData.ariaControls\"\n                 [ariaCurrent]=\"fieldsetData.ariaCurrent\"\n                 [ariaLive]=\"fieldsetData.ariaLive\"\n                 [ariaExpanded]=\"fieldsetData.ariaExpanded\"\n                 [ariaHasPopup]=\"fieldsetData.ariaHasPopup\"\n                 [tabindex]=\"fieldsetData.tabindex\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && hasLegendComponent()\"\n                 [legendRef]=\"legendTemplate\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\">\n    <ng-template #legendTemplate>\n      <ng-content select=\"desy-legend\"></ng-content>\n    </ng-template>\n  </desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && legendRef\"\n                 [legendRef]=\"legendRef\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && legendData\"\n                 [legendData]=\"{text: legendData.text, html: legendData.html,  classes: legendData.classes, isPageHeading: legendData.isPageHeading}\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && !legendData && legendText\"\n                 [legendText]=\"legendText\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n</ng-container>\n\n<ng-container *ngIf=\"!hasFieldset()\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: TemplateDrivenWrapperComponent, selector: "desy-template-driven-wrapper" }, { kind: "component", type: HintComponent, selector: "desy-hint", inputs: ["id", "classes", "html", "text"] }, { kind: "component", type: ErrorMessageComponent, selector: "desy-error-message", inputs: ["id", "classes", "html", "text", "visuallyHiddenText"] }, { kind: "component", type: FieldsetComponent, selector: "desy-fieldset", inputs: ["describedBy", "errorId", "legendRef", "legendData", "legendText", "classes", "caller", "id", "headingLevel"] }, { kind: "component", type: InputComponent, selector: "desy-input", inputs: ["name", "type", "describedBy", "pattern", "inputmode", "placeholder", "formGroupClasses", "classes", "autocomplete", "maxlength", "errorId", "attributes"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
 }
 __decorate([
     DesyOnInputChange('onExternalChange'),
@@ -3610,7 +3627,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             useExisting: forwardRef(() => DateInputComponent),
                             multi: true
                         }
-                    ], template: "<ng-template #innerHtml>\n  <ng-container *ngIf=\"hasHintComponent()\">\n    <ng-content select=\"desy-hint\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasHintComponent()\">\n    <ng-container *ngTemplateOutlet=\"hintRef\"></ng-container>\n    <desy-hint *ngIf=\"!hintRef && hintData\"\n               [id]=\"getHintId()\"\n               [text]=\"hintData.text\"\n               [html]=\"hintData.html\"\n               [classes]=\"hintData.classes\"\n               [role]=\"hintData.role\"\n               [ariaLabel]=\"hintData.ariaLabel\"\n               [ariaDescribedBy]=\"hintData.ariaDescribedBy\"\n               [ariaLabelledBy]=\"hintData.ariaLabelledBy\"\n               [ariaHidden]=\"hintData.ariaHidden\"\n               [ariaDisabled]=\"hintData.ariaDisabled\"\n               [ariaControls]=\"hintData.ariaControls\"\n               [ariaCurrent]=\"hintData.ariaCurrent\"\n               [ariaLive]=\"hintData.ariaLive\"\n               [ariaExpanded]=\"hintData.ariaExpanded\"\n               [ariaErrorMessage]=\"hintData.ariaErrorMessage\"\n               [ariaHasPopup]=\"hintData.ariaHasPopup\"\n               [tabindex]=\"hintData.tabindex\"></desy-hint>\n    <desy-hint *ngIf=\"!hintRef && !hintData && hintText\"\n               [text]=\"hintText\"\n               [id]=\"getHintId()\"></desy-hint>\n  </ng-container>\n\n\n  <ng-container *ngIf=\"hasErrorMessageComponent()\">\n    <ng-content select=\"desy-error-message\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasErrorMessageComponent()\">\n    <ng-container *ngTemplateOutlet=\"errorMessageRef\"></ng-container>\n    <desy-error-message *ngIf=\"!errorMessageRef && errorMessageData\"\n                        [id]=\"getErrorId()\"\n                        [text]=\"errorMessageData.text\"\n                        [html]=\"errorMessageData.html\"\n                        [classes]=\"errorMessageData.classes\"\n                        [visuallyHiddenText]=\"errorMessageData.visuallyHiddenText\"\n                        [role]=\"errorMessageData.role\"\n                        [ariaLabel]=\"errorMessageData.ariaLabel\"\n                        [ariaDescribedBy]=\"errorMessageData.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"errorMessageData.ariaLabelledBy\"\n                        [ariaHidden]=\"errorMessageData.ariaHidden\"\n                        [ariaDisabled]=\"errorMessageData.ariaDisabled\"\n                        [ariaControls]=\"errorMessageData.ariaControls\"\n                        [ariaCurrent]=\"errorMessageData.ariaCurrent\"\n                        [ariaLive]=\"errorMessageData.ariaLive\"\n                        [ariaExpanded]=\"errorMessageData.ariaExpanded\"\n                        [ariaErrorMessage]=\"errorMessageData.ariaErrorMessage\"\n                        [ariaHasPopup]=\"errorMessageData.ariaHasPopup\"\n                        [tabindex]=\"errorMessageData.tabindex\"></desy-error-message>\n    <desy-error-message *ngIf=\"!errorMessageRef && !errorMessageData && errorMessageText\"\n                        [text]=\"errorMessageText\"\n                        [id]=\"getErrorId()\"></desy-error-message>\n  </ng-container>\n\n  <!-- With reactive forms -->\n  <div *ngIf=\"controlContainer && !ngModelGroup\"\n       [formGroup]=\"ogFormGroup\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [formControlName]=\"getItemName(item)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <!-- Template-driven forms -->\n  <desy-template-driven-wrapper *ngIf=\"controlContainer && ngModelGroup\">\n    <div [ngModelGroup]=\"ngModelGroup\"\n         [class]=\"['flex', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n      <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n        <ng-container *ngIf=\"item.divider\">\n          <div role=\"separator\"\n               [ngClass]=\"item.divider.classes\">\n            <ng-container\n                          *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n          </div>\n        </ng-container>\n        <ng-container *ngIf=\"!item.divider\">\n          <div class=\"mr-base\">\n            <desy-input [labelData]=\"getItemLabel(item)\"\n                        [labelRef]=\"getItemLabelRef(item)\"\n                        [id]=\"item.id ? item.id : id + '-' + item.name\"\n                        [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                        [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                        [name]=\"getItemName(item)\"\n                        [ngModel]=\"item.value\"\n                        (ngModelChange)=\"onInternalChange(item, +$event)\"\n                        [type]=\"'text'\"\n                        [inputmode]=\"'numeric'\"\n                        [autocomplete]=\"item.autocomplete\"\n                        [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                        [disabled]=\"disabled ? true : null\"\n                        [placeholder]=\"item.placeholder\"\n                        [maxlength]=\"item.maxlength\"\n                        [role]=\"item.role\"\n                        [ariaLabel]=\"item.ariaLabel\"\n                        [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                        [ariaHidden]=\"item.ariaHidden\"\n                        [ariaDisabled]=\"item.ariaDisabled\"\n                        [ariaControls]=\"item.ariaControls\"\n                        [ariaCurrent]=\"item.ariaCurrent\"\n                        [ariaLive]=\"item.ariaLive\"\n                        [ariaExpanded]=\"item.ariaExpanded\"\n                        [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                        [ariaHasPopup]=\"item.ariaHasPopup\"\n                        [tabindex]=\"item.tabindex\"\n                        [ariaModal]=\"item.ariaModal\"\n                        [ariaChecked]=\"item.ariaChecked\"\n                        [ariaPressed]=\"item.ariaPressed\"\n                        [ariaReadonly]=\"item.ariaReadonly\"\n                        [ariaRequired]=\"item.ariaRequired\"\n                        [ariaSelected]=\"item.ariaSelected\"\n                        [ariaValuemin]=\"item.ariaValuemin\"\n                        [ariaValuemax]=\"item.ariaValuemax\"\n                        [ariaValuenow]=\"item.ariaValuenow\"\n                        [ariaValuetext]=\"item.ariaValuetext\"\n                        [ariaOrientation]=\"item.ariaOrientation\"\n                        [ariaLevel]=\"item.ariaLevel\"\n                        [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                        [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                        [ariaPosinset]=\"item.ariaPosinset\"\n                        [ariaSetsize]=\"item.ariaSetsize\"\n                        [ariaSort]=\"item.ariaSort\"\n                        [ariaBusy]=\"item.ariaBusy\"\n                        [ariaDropeffect]=\"item.ariaDropeffect\"\n                        [ariaGrabbed]=\"item.ariaGrabbed\"\n                        [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                        [ariaAtomic]=\"item.ariaAtomic\"\n                        [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                        [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                        [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                        [ariaColcount]=\"item.ariaColcount\"\n                        [ariaColindex]=\"item.ariaColindex\"\n                        [ariaColindextext]=\"item.ariaColindextext\"\n                        [ariaColspan]=\"item.ariaColspan\"\n                        [ariaDescription]=\"item.ariaDescription\"\n                        [ariaDetails]=\"item.ariaDetails\"\n                        [ariaFlowto]=\"item.ariaFlowto\"\n                        [ariaInvalid]=\"item.ariaInvalid\"\n                        [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                        [ariaOwns]=\"item.ariaOwns\"\n                        [ariaRelevant]=\"item.ariaRelevant\"\n                        [ariaRoledescription]=\"item.ariaRoledescription\"\n                        [ariaRowcount]=\"item.ariaRowcount\"\n                        [ariaRowindex]=\"item.ariaRowindex\"\n                        [ariaRowindextext]=\"item.ariaRowindextext\"\n                        [ariaRowspan]=\"item.ariaRowspan\"\n                        [title]=\"item.title\"\n                        [alt]=\"item.alt\"\n                        [lang]=\"item.lang\"\n                        [accesskey]=\"item.accesskey\"\n                        [autofocus]=\"item.autofocus\"\n                        [contenteditable]=\"item.contenteditable\"\n                        [dir]=\"item.dir\"\n                        [draggable]=\"item.draggable\"\n                        [enterkeyhint]=\"item.enterkeyhint\"\n                        [hidden]=\"item.hidden\"\n                        [spellcheck]=\"item.spellcheck\"\n                        [translate]=\"item.translate\"\n                        [ariaMultiline]=\"item.ariaMultiline\"\n                        [for]=\"item.for\"\n                        [form]=\"item.form\"\n                        [headers]=\"item.headers\"\n                        [readonly]=\"item.readonly\"\n                        [required]=\"item.required\"></desy-input>\n          </div>\n        </ng-container>\n      </ng-container>\n    </div>\n  </desy-template-driven-wrapper>\n\n  <!-- With ngModel-->\n  <div *ngIf=\"!controlContainer\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [ngModel]=\"item.value\"\n                      (ngModelChange)=\"onInternalChange(item, +$event)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [disabled]=\"disabled ? true : null\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-container *ngIf=\"hasFieldsetComponent()\">\n  <ng-content select=\"desy-fieldset\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"!hasFieldsetComponent()\">\n  <desy-fieldset *ngIf=\"fieldsetData\"\n                 [classes]=\"fieldsetData.classes\"\n                 [id]=\"fieldsetData.id\"\n                 [legendData]=\"fieldsetData.legend\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[fieldsetData.describedBy, getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"\n                 [ariaLabel]=\"fieldsetData.ariaLabel\"\n                 [ariaLabelledBy]=\"fieldsetData.ariaLabelledBy\"\n                 [ariaHidden]=\"fieldsetData.ariaHidden\"\n                 [ariaDisabled]=\"fieldsetData.ariaDisabled\"\n                 [ariaControls]=\"fieldsetData.ariaControls\"\n                 [ariaCurrent]=\"fieldsetData.ariaCurrent\"\n                 [ariaLive]=\"fieldsetData.ariaLive\"\n                 [ariaExpanded]=\"fieldsetData.ariaExpanded\"\n                 [ariaHasPopup]=\"fieldsetData.ariaHasPopup\"\n                 [tabindex]=\"fieldsetData.tabindex\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && hasLegendComponent()\"\n                 [legendRef]=\"legendTemplate\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\">\n    <ng-template #legendTemplate>\n      <ng-content select=\"desy-legend\"></ng-content>\n    </ng-template>\n  </desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && legendRef\"\n                 [legendRef]=\"legendRef\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && legendData\"\n                 [legendData]=\"{text: legendData.text, html: legendData.html,  classes: legendData.classes, isPageHeading: legendData.isPageHeading}\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && !legendData && legendText\"\n                 [legendText]=\"legendText\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n</ng-container>\n\n<ng-container *ngIf=\"!hasFieldset()\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ng-container>" }]
+                    ], template: "<ng-template #innerHtml>\n  <ng-container *ngIf=\"hasHintComponent()\">\n    <ng-content select=\"desy-hint\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasHintComponent()\">\n    <ng-container *ngTemplateOutlet=\"hintRef\"></ng-container>\n    <desy-hint *ngIf=\"!hintRef && hintData\"\n               [id]=\"getHintId()\"\n               [text]=\"hintData.text\"\n               [html]=\"hintData.html\"\n               [classes]=\"hintData.classes\"\n               [role]=\"hintData.role\"\n               [ariaLabel]=\"hintData.ariaLabel\"\n               [ariaDescribedBy]=\"hintData.ariaDescribedBy\"\n               [ariaLabelledBy]=\"hintData.ariaLabelledBy\"\n               [ariaHidden]=\"hintData.ariaHidden\"\n               [ariaDisabled]=\"hintData.ariaDisabled\"\n               [ariaControls]=\"hintData.ariaControls\"\n               [ariaCurrent]=\"hintData.ariaCurrent\"\n               [ariaLive]=\"hintData.ariaLive\"\n               [ariaExpanded]=\"hintData.ariaExpanded\"\n               [ariaErrorMessage]=\"hintData.ariaErrorMessage\"\n               [ariaHasPopup]=\"hintData.ariaHasPopup\"\n               [tabindex]=\"hintData.tabindex\"></desy-hint>\n    <desy-hint *ngIf=\"!hintRef && !hintData && hintText\"\n               [text]=\"hintText\"\n               [id]=\"getHintId()\"></desy-hint>\n  </ng-container>\n\n\n  <ng-container *ngIf=\"hasErrorMessageComponent()\">\n    <ng-content select=\"desy-error-message\"></ng-content>\n  </ng-container>\n  <ng-container *ngIf=\"!hasErrorMessageComponent()\">\n    <ng-container *ngTemplateOutlet=\"errorMessageRef\"></ng-container>\n    <desy-error-message *ngIf=\"!errorMessageRef && errorMessageData\"\n                        [id]=\"getErrorId()\"\n                        [text]=\"errorMessageData.text\"\n                        [html]=\"errorMessageData.html\"\n                        [classes]=\"errorMessageData.classes\"\n                        [visuallyHiddenText]=\"errorMessageData.visuallyHiddenText\"\n                        [role]=\"errorMessageData.role\"\n                        [ariaLabel]=\"errorMessageData.ariaLabel\"\n                        [ariaDescribedBy]=\"errorMessageData.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"errorMessageData.ariaLabelledBy\"\n                        [ariaHidden]=\"errorMessageData.ariaHidden\"\n                        [ariaDisabled]=\"errorMessageData.ariaDisabled\"\n                        [ariaControls]=\"errorMessageData.ariaControls\"\n                        [ariaCurrent]=\"errorMessageData.ariaCurrent\"\n                        [ariaLive]=\"errorMessageData.ariaLive\"\n                        [ariaExpanded]=\"errorMessageData.ariaExpanded\"\n                        [ariaErrorMessage]=\"errorMessageData.ariaErrorMessage\"\n                        [ariaHasPopup]=\"errorMessageData.ariaHasPopup\"\n                        [tabindex]=\"errorMessageData.tabindex\"></desy-error-message>\n    <desy-error-message *ngIf=\"!errorMessageRef && !errorMessageData && errorMessageText\"\n                        [text]=\"errorMessageText\"\n                        [id]=\"getErrorId()\"></desy-error-message>\n  </ng-container>\n\n  <!-- With reactive forms -->\n  <div *ngIf=\"controlContainer && !ngModelGroup\"\n       [formGroup]=\"ogFormGroup\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [formControlName]=\"getItemName(item)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [disabled]=\"disabled ? true : null\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <!-- Template-driven forms -->\n  <desy-template-driven-wrapper *ngIf=\"controlContainer && ngModelGroup\">\n    <div [ngModelGroup]=\"ngModelGroup\"\n         [class]=\"['flex', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n      <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n        <ng-container *ngIf=\"item.divider\">\n          <div role=\"separator\"\n               [ngClass]=\"item.divider.classes\">\n            <ng-container\n                          *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n          </div>\n        </ng-container>\n        <ng-container *ngIf=\"!item.divider\">\n          <div class=\"mr-base\">\n            <desy-input [labelData]=\"getItemLabel(item)\"\n                        [labelRef]=\"getItemLabelRef(item)\"\n                        [id]=\"item.id ? item.id : id + '-' + item.name\"\n                        [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                        [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                        [name]=\"getItemName(item)\"\n                        [ngModel]=\"item.value\"\n                        (ngModelChange)=\"onInternalChange(item, +$event)\"\n                        [type]=\"'text'\"\n                        [inputmode]=\"'numeric'\"\n                        [autocomplete]=\"item.autocomplete\"\n                        [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                        [disabled]=\"disabled ? true : null\"\n                        [placeholder]=\"item.placeholder\"\n                        [maxlength]=\"item.maxlength\"\n                        [role]=\"item.role\"\n                        [ariaLabel]=\"item.ariaLabel\"\n                        [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                        [ariaHidden]=\"item.ariaHidden\"\n                        [ariaDisabled]=\"item.ariaDisabled\"\n                        [ariaControls]=\"item.ariaControls\"\n                        [ariaCurrent]=\"item.ariaCurrent\"\n                        [ariaLive]=\"item.ariaLive\"\n                        [ariaExpanded]=\"item.ariaExpanded\"\n                        [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                        [ariaHasPopup]=\"item.ariaHasPopup\"\n                        [tabindex]=\"item.tabindex\"\n                        [ariaModal]=\"item.ariaModal\"\n                        [ariaChecked]=\"item.ariaChecked\"\n                        [ariaPressed]=\"item.ariaPressed\"\n                        [ariaReadonly]=\"item.ariaReadonly\"\n                        [ariaRequired]=\"item.ariaRequired\"\n                        [ariaSelected]=\"item.ariaSelected\"\n                        [ariaValuemin]=\"item.ariaValuemin\"\n                        [ariaValuemax]=\"item.ariaValuemax\"\n                        [ariaValuenow]=\"item.ariaValuenow\"\n                        [ariaValuetext]=\"item.ariaValuetext\"\n                        [ariaOrientation]=\"item.ariaOrientation\"\n                        [ariaLevel]=\"item.ariaLevel\"\n                        [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                        [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                        [ariaPosinset]=\"item.ariaPosinset\"\n                        [ariaSetsize]=\"item.ariaSetsize\"\n                        [ariaSort]=\"item.ariaSort\"\n                        [ariaBusy]=\"item.ariaBusy\"\n                        [ariaDropeffect]=\"item.ariaDropeffect\"\n                        [ariaGrabbed]=\"item.ariaGrabbed\"\n                        [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                        [ariaAtomic]=\"item.ariaAtomic\"\n                        [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                        [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                        [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                        [ariaColcount]=\"item.ariaColcount\"\n                        [ariaColindex]=\"item.ariaColindex\"\n                        [ariaColindextext]=\"item.ariaColindextext\"\n                        [ariaColspan]=\"item.ariaColspan\"\n                        [ariaDescription]=\"item.ariaDescription\"\n                        [ariaDetails]=\"item.ariaDetails\"\n                        [ariaFlowto]=\"item.ariaFlowto\"\n                        [ariaInvalid]=\"item.ariaInvalid\"\n                        [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                        [ariaOwns]=\"item.ariaOwns\"\n                        [ariaRelevant]=\"item.ariaRelevant\"\n                        [ariaRoledescription]=\"item.ariaRoledescription\"\n                        [ariaRowcount]=\"item.ariaRowcount\"\n                        [ariaRowindex]=\"item.ariaRowindex\"\n                        [ariaRowindextext]=\"item.ariaRowindextext\"\n                        [ariaRowspan]=\"item.ariaRowspan\"\n                        [title]=\"item.title\"\n                        [alt]=\"item.alt\"\n                        [lang]=\"item.lang\"\n                        [accesskey]=\"item.accesskey\"\n                        [autofocus]=\"item.autofocus\"\n                        [contenteditable]=\"item.contenteditable\"\n                        [dir]=\"item.dir\"\n                        [draggable]=\"item.draggable\"\n                        [enterkeyhint]=\"item.enterkeyhint\"\n                        [hidden]=\"item.hidden\"\n                        [spellcheck]=\"item.spellcheck\"\n                        [translate]=\"item.translate\"\n                        [ariaMultiline]=\"item.ariaMultiline\"\n                        [for]=\"item.for\"\n                        [form]=\"item.form\"\n                        [headers]=\"item.headers\"\n                        [readonly]=\"item.readonly\"\n                        [required]=\"item.required\"></desy-input>\n          </div>\n        </ng-container>\n      </ng-container>\n    </div>\n  </desy-template-driven-wrapper>\n\n  <!-- With ngModel-->\n  <div *ngIf=\"!controlContainer\"\n       [class]=\"['flex', classes] | makeHtmlList\"\n       [attr.id]=\"id ? id : null\"\n       [desyAppAccessibility]=\"this\">\n    <ng-container *ngFor=\"let item of getItems(); index as i\">\n\n      <ng-container *ngIf=\"item.divider\">\n        <div role=\"separator\"\n             [ngClass]=\"item.divider.classes\">\n          <ng-container\n                        *desyCustomInnerContent=\"{ template: getItemDividerTemplate(item), html: getItemDividerHtml(item) }\"></ng-container>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!item.divider\">\n        <div class=\"mr-base\">\n          <desy-input [labelData]=\"getItemLabel(item)\"\n                      [labelRef]=\"getItemLabelRef(item)\"\n                      [id]=\"item.id ? item.id : id + '-' + item.name\"\n                      [classes]=\"['mb-0', item.classes] | makeHtmlList\"\n                      [errorId]=\"item.hasErrors ? getErrorId() : null\"\n                      [name]=\"getItemName(item)\"\n                      [ngModel]=\"item.value\"\n                      (ngModelChange)=\"onInternalChange(item, +$event)\"\n                      [type]=\"'text'\"\n                      [inputmode]=\"'numeric'\"\n                      [autocomplete]=\"item.autocomplete\"\n                      [pattern]=\"item.pattern ? item.pattern : '[0-9]*'\"\n                      [disabled]=\"disabled ? true : null\"\n                      [placeholder]=\"item.placeholder\"\n                      [maxlength]=\"item.maxlength\"\n                      [role]=\"item.role\"\n                      [ariaLabel]=\"item.ariaLabel\"\n                      [ariaDescribedBy]=\"item.ariaDescribedBy\"\n                      [ariaLabelledBy]=\"item.ariaLabelledBy\"\n                      [ariaHidden]=\"item.ariaHidden\"\n                      [ariaDisabled]=\"item.ariaDisabled\"\n                      [ariaControls]=\"item.ariaControls\"\n                      [ariaCurrent]=\"item.ariaCurrent\"\n                      [ariaLive]=\"item.ariaLive\"\n                      [ariaExpanded]=\"item.ariaExpanded\"\n                      [ariaErrorMessage]=\"item.ariaErrorMessage\"\n                      [ariaHasPopup]=\"item.ariaHasPopup\"\n                      [tabindex]=\"item.tabindex\"\n                      [ariaModal]=\"item.ariaModal\"\n                      [ariaChecked]=\"item.ariaChecked\"\n                      [ariaPressed]=\"item.ariaPressed\"\n                      [ariaReadonly]=\"item.ariaReadonly\"\n                      [ariaRequired]=\"item.ariaRequired\"\n                      [ariaSelected]=\"item.ariaSelected\"\n                      [ariaValuemin]=\"item.ariaValuemin\"\n                      [ariaValuemax]=\"item.ariaValuemax\"\n                      [ariaValuenow]=\"item.ariaValuenow\"\n                      [ariaValuetext]=\"item.ariaValuetext\"\n                      [ariaOrientation]=\"item.ariaOrientation\"\n                      [ariaLevel]=\"item.ariaLevel\"\n                      [ariaMultiselectable]=\"item.ariaMultiselectable\"\n                      [ariaPlaceholder]=\"item.ariaPlaceholder\"\n                      [ariaPosinset]=\"item.ariaPosinset\"\n                      [ariaSetsize]=\"item.ariaSetsize\"\n                      [ariaSort]=\"item.ariaSort\"\n                      [ariaBusy]=\"item.ariaBusy\"\n                      [ariaDropeffect]=\"item.ariaDropeffect\"\n                      [ariaGrabbed]=\"item.ariaGrabbed\"\n                      [ariaActivedescendant]=\"item.ariaActivedescendant\"\n                      [ariaAtomic]=\"item.ariaAtomic\"\n                      [ariaAutocomplete]=\"item.ariaAutocomplete\"\n                      [ariaBraillelabel]=\"item.ariaBraillelabel\"\n                      [ariaBrailleroledescription]=\"item.ariaBrailleroledescription\"\n                      [ariaColcount]=\"item.ariaColcount\"\n                      [ariaColindex]=\"item.ariaColindex\"\n                      [ariaColindextext]=\"item.ariaColindextext\"\n                      [ariaColspan]=\"item.ariaColspan\"\n                      [ariaDescription]=\"item.ariaDescription\"\n                      [ariaDetails]=\"item.ariaDetails\"\n                      [ariaFlowto]=\"item.ariaFlowto\"\n                      [ariaInvalid]=\"item.ariaInvalid\"\n                      [ariaKeyshortcuts]=\"item.ariaKeyshortcuts\"\n                      [ariaOwns]=\"item.ariaOwns\"\n                      [ariaRelevant]=\"item.ariaRelevant\"\n                      [ariaRoledescription]=\"item.ariaRoledescription\"\n                      [ariaRowcount]=\"item.ariaRowcount\"\n                      [ariaRowindex]=\"item.ariaRowindex\"\n                      [ariaRowindextext]=\"item.ariaRowindextext\"\n                      [ariaRowspan]=\"item.ariaRowspan\"\n                      [title]=\"item.title\"\n                      [alt]=\"item.alt\"\n                      [lang]=\"item.lang\"\n                      [accesskey]=\"item.accesskey\"\n                      [autofocus]=\"item.autofocus\"\n                      [contenteditable]=\"item.contenteditable\"\n                      [dir]=\"item.dir\"\n                      [draggable]=\"item.draggable\"\n                      [enterkeyhint]=\"item.enterkeyhint\"\n                      [hidden]=\"item.hidden\"\n                      [spellcheck]=\"item.spellcheck\"\n                      [translate]=\"item.translate\"\n                      [ariaMultiline]=\"item.ariaMultiline\"\n                      [for]=\"item.for\"\n                      [form]=\"item.form\"\n                      [headers]=\"item.headers\"\n                      [readonly]=\"item.readonly\"\n                      [required]=\"item.required\"></desy-input>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-container *ngIf=\"hasFieldsetComponent()\">\n  <ng-content select=\"desy-fieldset\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"!hasFieldsetComponent()\">\n  <desy-fieldset *ngIf=\"fieldsetData\"\n                 [classes]=\"fieldsetData.classes\"\n                 [id]=\"fieldsetData.id\"\n                 [legendData]=\"fieldsetData.legend\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[fieldsetData.describedBy, getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"\n                 [ariaLabel]=\"fieldsetData.ariaLabel\"\n                 [ariaLabelledBy]=\"fieldsetData.ariaLabelledBy\"\n                 [ariaHidden]=\"fieldsetData.ariaHidden\"\n                 [ariaDisabled]=\"fieldsetData.ariaDisabled\"\n                 [ariaControls]=\"fieldsetData.ariaControls\"\n                 [ariaCurrent]=\"fieldsetData.ariaCurrent\"\n                 [ariaLive]=\"fieldsetData.ariaLive\"\n                 [ariaExpanded]=\"fieldsetData.ariaExpanded\"\n                 [ariaHasPopup]=\"fieldsetData.ariaHasPopup\"\n                 [tabindex]=\"fieldsetData.tabindex\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && hasLegendComponent()\"\n                 [legendRef]=\"legendTemplate\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\">\n    <ng-template #legendTemplate>\n      <ng-content select=\"desy-legend\"></ng-content>\n    </ng-template>\n  </desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && legendRef\"\n                 [legendRef]=\"legendRef\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && legendData\"\n                 [legendData]=\"{text: legendData.text, html: legendData.html,  classes: legendData.classes, isPageHeading: legendData.isPageHeading}\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n  <desy-fieldset *ngIf=\"!fieldsetData && !hasLegendComponent() && !legendRef && !legendData && legendText\"\n                 [legendText]=\"legendText\"\n                 [caller]=\"innerHtml\"\n                 [errorId]=\"getErrorId()\"\n                 [describedBy]=\"[ getHintId(), getErrorId()] | makeHtmlList:null\"\n                 role=\"group\"></desy-fieldset>\n</ng-container>\n\n<ng-container *ngIf=\"!hasFieldset()\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ng-container>" }]
         }], ctorParameters: function () { return [{ type: i1$1.ControlContainer, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { ngModelGroup: [{
@@ -3665,6 +3682,184 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 args: ['innerHtml', { static: true }]
             }] } });
 
+class DatepickerComponent extends FormFieldComponent {
+    constructor() {
+        super();
+        this.standalone = false;
+    }
+    ngAfterViewInit() {
+        const inputElement = this.calendar.nativeElement.getElementsByTagName('input')[0];
+        if (inputElement && !this.standalone) {
+            const dropdownId = inputElement.getAttribute('id');
+            const datepickerDropdown = inputElement.parentNode.querySelector('desy-dropdown button');
+            let isOpen = false;
+            const focusCalendar = () => {
+                const inputInitialValue = inputElement.value;
+                requestAnimationFrame(() => {
+                    const datepickerSelect = this.calendar.nativeElement.querySelector(':is(select)');
+                    const datepickerCalendar = this.calendar.nativeElement.querySelector(':is(calendar-date, calendar-multi, calendar-range)');
+                    const datepickerInitialValue = datepickerCalendar?.value;
+                    if (this.value && datepickerCalendar) {
+                        console.log(datepickerCalendar);
+                        datepickerCalendar.value = this.value;
+                        inputElement.value = this.value;
+                        datepickerCalendar.focus();
+                    }
+                    else {
+                        this.value = datepickerInitialValue;
+                        inputElement.value = this.value;
+                        this.onChange(this.value);
+                    }
+                    if (datepickerSelect) {
+                        datepickerSelect.addEventListener('change', function () {
+                            const selectedValue = this.value;
+                            datepickerCalendar.min = selectedValue + "-01-01";
+                            datepickerCalendar.max = selectedValue + "-31-12";
+                            datepickerCalendar.focusedDate = datepickerCalendar.min;
+                        });
+                        datepickerSelect.focus();
+                    }
+                    const datepickerCancel = this.calendar.nativeElement.querySelector('#' + dropdownId + '-cancel');
+                    const datepickerSubmit = this.calendar.nativeElement.querySelector('#' + dropdownId + '-submit');
+                    if (datepickerCancel) {
+                        datepickerCancel.onclick = () => {
+                            inputElement.value = inputInitialValue;
+                            datepickerCalendar.tentative = "";
+                            datepickerCalendar.value = datepickerInitialValue;
+                            closeDropdown();
+                        };
+                    }
+                    if (datepickerSubmit) {
+                        datepickerSubmit.onclick = () => {
+                            this.value = datepickerCalendar?.value;
+                            inputElement.value = this.value;
+                            this.onChange(this.value);
+                            closeDropdown();
+                        };
+                    }
+                });
+            };
+            const closeDropdown = () => {
+                setTimeout(() => {
+                    isOpen = false;
+                    inputElement.focus();
+                }, 300);
+            };
+            const observer = new MutationObserver((mutations) => {
+                mutations.forEach((mutation) => {
+                    if (mutation.type === 'attributes' && mutation.attributeName === 'aria-expanded') {
+                        const currentExpandedValue = mutation.target.getAttribute('aria-expanded');
+                        if (currentExpandedValue !== isOpen.toString()) {
+                            const datepickerTimeout = setTimeout(focusCalendar, 0);
+                            isOpen = currentExpandedValue === 'true';
+                            if (!isOpen) {
+                                clearTimeout(datepickerTimeout);
+                                closeDropdown();
+                            }
+                        }
+                    }
+                });
+            });
+            observer.observe(datepickerDropdown, { attributes: true, attributeFilter: ['aria-expanded'] });
+        }
+        else {
+            const datepickerSelect = this.calendar.nativeElement.querySelector(':is(select)');
+            const datepickerCalendar = this.calendar.nativeElement.querySelector(':is(calendar-date, calendar-multi, calendar-range)');
+            if (datepickerSelect) {
+                datepickerSelect.addEventListener('change', function () {
+                    const selectedValue = this.value;
+                    datepickerCalendar.min = selectedValue + "-01-01";
+                    datepickerCalendar.max = selectedValue + "-31-12";
+                    datepickerCalendar.focusedDate = datepickerCalendar.min;
+                });
+            }
+        }
+    }
+    onInput(event) {
+        this.value = event.target.value;
+        this.onChange(this.value);
+    }
+    ngDoCheck() {
+        if (this.attributes) {
+            this.setAttributes();
+        }
+    }
+    setAttributes() {
+        const input = this.calendar.nativeElement.getElementsByTagName('input')[0];
+        const attr = this.attributes;
+        Object.keys(attr).forEach(key => {
+            input?.setAttribute(key, attr[key]);
+        });
+    }
+    writeValue(value) {
+        if (value) {
+            this.value = value || '';
+        }
+        else {
+            this.value = '';
+        }
+        this.onChange(this.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DatepickerComponent, selector: "desy-datepicker", inputs: { containerClasses: "containerClasses", standalone: "standalone", formGroupClasses: "formGroupClasses", id: "id", name: "name", type: "type", inputmode: "inputmode", describedBy: "describedBy", errorId: "errorId", classes: "classes", autocomplete: "autocomplete", pattern: "pattern", placeholder: "placeholder", attributes: "attributes", dropdownClasses: "dropdownClasses" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => DatepickerComponent),
+                multi: true
+            }
+        ], queries: [{ propertyName: "errorMessage", predicate: ErrorMessageComponent }], viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #calendar\n     class=\"c-datepicker\"\n     [ngClass]=\"containerClasses\"\n     [desyAppAccessibility]=\"this\">\n    <ng-container *ngIf=\"standalone\">\n        <ng-container *ngTemplateOutlet=\"calendarContent\"></ng-container>\n    </ng-container>\n    <div *ngIf=\"!standalone\"\n         class=\"c-form-group\"\n         [ngClass]=\"formGroupClasses\">\n        <ng-content select=\"desy-label\"></ng-content>\n        <ng-content select=\"desy-hint\"></ng-content> \n        <ng-content select=\"desy-error-message\"></ng-content>\n\n        <div class=\"relative \">\n            <input class=\"c-input block mt-sm border-black rounded font-semibold placeholder-neutral-dark focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base pr-16 w-full\"\n                   [ngClass]=\"{'border-alert-base ring-2 ring-alert-base': errorMessage}\"\n                   [attr.id]=\"id\"\n                   [attr.name]=\"name\"\n                   [type]=\"type || 'text'\"\n                   [attr.value]=\"value\"\n                   [attr.aria-describedby]=\"describedBy || (errorMessage || errorId ? errorId : null)\"\n                   [attr.aria-errormessage]=\"errorMessage || errorId ? errorId : null\"\n                   [attr.aria-invalid]=\"errorMessage || errorId ? 'true' : null\"\n                   [attr.autocomplete]=\"autocomplete\"\n                   [attr.pattern]=\"pattern\"\n                   [attr.inputmode]=\"inputmode\"\n                   (input)=\"onInput($event)\"\n                   [attr.placeholder]=\"placeholder\"\n                   [disabled]=\"disabled\" />\n\n\n            <div class=\"absolute top-0 right-0\">\n                <desy-dropdown [classes]=\"dropdownClasses ? dropdownClasses : 'c-dropdown--transparent'\"\n                               [disabled]=\"disabled\"\n                               (blur)=\"onBlur($event)\"\n                               [id]=\"id+'-dropdown'\">\n                    <span class=\"sr-only\">Seleccionar fecha con una tabla de calendario</span><svg\n                         xmlns=\"http://www.w3.org/2000/svg\"\n                         viewBox=\"0 0 14 14\"\n                         width=\"1.375em\"\n                         height=\"1.375em\"\n                         aria-hidden=\"true\">\n                        <g>\n                            <path fill=\"currentColor\"\n                                  fill-rule=\"evenodd\"\n                                  d=\"M4.5 1.5c0 -0.552285 -0.44772 -1 -1 -1s-1 0.447715 -1 1v1H2C1.17157 2.5 0.5 3.17157 0.5 4v8c0 0.8284 0.67157 1.5 1.5 1.5h10c0.8284 0 1.5 -0.6716 1.5 -1.5V4c0 -0.82843 -0.6716 -1.5 -1.5 -1.5h-0.5v-1c0 -0.552285 -0.4477 -1 -1 -1 -0.55229 0 -1 0.447715 -1 1v1h-5v-1Zm-1 5.75c0.55228 0 1 -0.44772 1 -1s-0.44772 -1 -1 -1 -1 0.44772 -1 1 0.44772 1 1 1Zm3.5 0c0.55228 0 1 -0.44772 1 -1s-0.44772 -1 -1 -1 -1 0.44772 -1 1 0.44772 1 1 1Zm-2.5 3c0 0.5523 -0.44772 1 -1 1s-1 -0.4477 -1 -1c0 -0.55229 0.44772 -1 1 -1s1 0.44771 1 1Zm2.5 1c0.55228 0 1 -0.4477 1 -1 0 -0.55229 -0.44772 -1 -1 -1s-1 0.44771 -1 1c0 0.5523 0.44772 1 1 1Zm4.5 -5c0 0.55228 -0.4477 1 -1 1 -0.55229 0 -1 -0.44772 -1 -1s0.44771 -1 1 -1c0.5523 0 1 0.44772 1 1Z\"\n                                  clip-rule=\"evenodd\"\n                                  stroke-width=\"1\"></path>\n                        </g>\n                    </svg>\n                    <desy-content>\n                        <ng-container *ngTemplateOutlet=\"calendarContent\"></ng-container>\n                        <ul class=\"flex flex-wrap justify-between gap-sm p-sm\">\n                            <li>\n                                <desy-button [id]=\"id + '-submit'\"\n                                             classes=\"c-button--primary c-button--sm\">\n                                    Aceptar\n                                </desy-button>\n                            </li>\n                            <li>\n                                <desy-button [id]=\"id + '-cancel'\"\n                                             classes=\"c-button--sm\">\n                                    Cancelar\n                                </desy-button>\n                            </li>\n                        </ul>\n                    </desy-content>\n                </desy-dropdown>\n            </div>\n        </div>\n    </div>\n</div>\n\n<ng-template #calendarContent>\n    <div class=\"p-sm overflow-x-auto\">\n        <ng-content></ng-content>\n    </div>\n</ng-template>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: ContentComponent, selector: "desy-content", inputs: ["classes"] }, { kind: "component", type: ButtonComponent, selector: "desy-button", inputs: ["id", "classes", "html", "text", "element", "name", "type", "value", "disabled", "href", "target", "preventDoubleClick", "fragment", "routerLink", "routerLinkActiveClasses"], outputs: ["clickEvent"] }, { kind: "component", type: DropdownComponent, selector: "desy-dropdown", inputs: ["id", "disabled", "hiddenText", "classesContainer", "classesTooltip", "caller", "classes"], outputs: ["clickEvent"] }] }); }
+}
+__decorate([
+    DesyContentChild(),
+    __metadata("design:type", ErrorMessageComponent)
+], DatepickerComponent.prototype, "errorMessage", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatepickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'desy-datepicker', providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => DatepickerComponent),
+                            multi: true
+                        }
+                    ], template: "<div #calendar\n     class=\"c-datepicker\"\n     [ngClass]=\"containerClasses\"\n     [desyAppAccessibility]=\"this\">\n    <ng-container *ngIf=\"standalone\">\n        <ng-container *ngTemplateOutlet=\"calendarContent\"></ng-container>\n    </ng-container>\n    <div *ngIf=\"!standalone\"\n         class=\"c-form-group\"\n         [ngClass]=\"formGroupClasses\">\n        <ng-content select=\"desy-label\"></ng-content>\n        <ng-content select=\"desy-hint\"></ng-content> \n        <ng-content select=\"desy-error-message\"></ng-content>\n\n        <div class=\"relative \">\n            <input class=\"c-input block mt-sm border-black rounded font-semibold placeholder-neutral-dark focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base pr-16 w-full\"\n                   [ngClass]=\"{'border-alert-base ring-2 ring-alert-base': errorMessage}\"\n                   [attr.id]=\"id\"\n                   [attr.name]=\"name\"\n                   [type]=\"type || 'text'\"\n                   [attr.value]=\"value\"\n                   [attr.aria-describedby]=\"describedBy || (errorMessage || errorId ? errorId : null)\"\n                   [attr.aria-errormessage]=\"errorMessage || errorId ? errorId : null\"\n                   [attr.aria-invalid]=\"errorMessage || errorId ? 'true' : null\"\n                   [attr.autocomplete]=\"autocomplete\"\n                   [attr.pattern]=\"pattern\"\n                   [attr.inputmode]=\"inputmode\"\n                   (input)=\"onInput($event)\"\n                   [attr.placeholder]=\"placeholder\"\n                   [disabled]=\"disabled\" />\n\n\n            <div class=\"absolute top-0 right-0\">\n                <desy-dropdown [classes]=\"dropdownClasses ? dropdownClasses : 'c-dropdown--transparent'\"\n                               [disabled]=\"disabled\"\n                               (blur)=\"onBlur($event)\"\n                               [id]=\"id+'-dropdown'\">\n                    <span class=\"sr-only\">Seleccionar fecha con una tabla de calendario</span><svg\n                         xmlns=\"http://www.w3.org/2000/svg\"\n                         viewBox=\"0 0 14 14\"\n                         width=\"1.375em\"\n                         height=\"1.375em\"\n                         aria-hidden=\"true\">\n                        <g>\n                            <path fill=\"currentColor\"\n                                  fill-rule=\"evenodd\"\n                                  d=\"M4.5 1.5c0 -0.552285 -0.44772 -1 -1 -1s-1 0.447715 -1 1v1H2C1.17157 2.5 0.5 3.17157 0.5 4v8c0 0.8284 0.67157 1.5 1.5 1.5h10c0.8284 0 1.5 -0.6716 1.5 -1.5V4c0 -0.82843 -0.6716 -1.5 -1.5 -1.5h-0.5v-1c0 -0.552285 -0.4477 -1 -1 -1 -0.55229 0 -1 0.447715 -1 1v1h-5v-1Zm-1 5.75c0.55228 0 1 -0.44772 1 -1s-0.44772 -1 -1 -1 -1 0.44772 -1 1 0.44772 1 1 1Zm3.5 0c0.55228 0 1 -0.44772 1 -1s-0.44772 -1 -1 -1 -1 0.44772 -1 1 0.44772 1 1 1Zm-2.5 3c0 0.5523 -0.44772 1 -1 1s-1 -0.4477 -1 -1c0 -0.55229 0.44772 -1 1 -1s1 0.44771 1 1Zm2.5 1c0.55228 0 1 -0.4477 1 -1 0 -0.55229 -0.44772 -1 -1 -1s-1 0.44771 -1 1c0 0.5523 0.44772 1 1 1Zm4.5 -5c0 0.55228 -0.4477 1 -1 1 -0.55229 0 -1 -0.44772 -1 -1s0.44771 -1 1 -1c0.5523 0 1 0.44772 1 1Z\"\n                                  clip-rule=\"evenodd\"\n                                  stroke-width=\"1\"></path>\n                        </g>\n                    </svg>\n                    <desy-content>\n                        <ng-container *ngTemplateOutlet=\"calendarContent\"></ng-container>\n                        <ul class=\"flex flex-wrap justify-between gap-sm p-sm\">\n                            <li>\n                                <desy-button [id]=\"id + '-submit'\"\n                                             classes=\"c-button--primary c-button--sm\">\n                                    Aceptar\n                                </desy-button>\n                            </li>\n                            <li>\n                                <desy-button [id]=\"id + '-cancel'\"\n                                             classes=\"c-button--sm\">\n                                    Cancelar\n                                </desy-button>\n                            </li>\n                        </ul>\n                    </desy-content>\n                </desy-dropdown>\n            </div>\n        </div>\n    </div>\n</div>\n\n<ng-template #calendarContent>\n    <div class=\"p-sm overflow-x-auto\">\n        <ng-content></ng-content>\n    </div>\n</ng-template>" }]
+        }], ctorParameters: function () { return []; }, propDecorators: { containerClasses: [{
+                type: Input
+            }], standalone: [{
+                type: Input
+            }], formGroupClasses: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], inputmode: [{
+                type: Input
+            }], describedBy: [{
+                type: Input
+            }], errorId: [{
+                type: Input
+            }], classes: [{
+                type: Input
+            }], autocomplete: [{
+                type: Input
+            }], pattern: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], attributes: [{
+                type: Input
+            }], dropdownClasses: [{
+                type: Input
+            }], calendar: [{
+                type: ViewChild,
+                args: ['calendar', { static: true }]
+            }], errorMessage: [{
+                type: ContentChildren,
+                args: [ErrorMessageComponent]
+            }] } });
+
 class FileUploadComponent extends FormFieldComponent {
     constructor() {
         super();
@@ -5546,13 +5741,13 @@ class TreeComponent extends FormFieldComponent {
         return list;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeComponent, selector: "desy-tree", inputs: { idPrefix: "idPrefix", classes: "classes", name: "name", type: "type", describedBy: "describedBy", formGroupClasses: "formGroupClasses", expandedFirstLevel: "expandedFirstLevel", decoupleChildFromParent: "decoupleChildFromParent", disableDefaultSearch: "disableDefaultSearch", searchMatchValues: "searchMatchValues" }, outputs: { searchMatchValuesChange: "searchMatchValuesChange" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeComponent, selector: "desy-tree", inputs: { id: "id", idPrefix: "idPrefix", classes: "classes", name: "name", type: "type", describedBy: "describedBy", formGroupClasses: "formGroupClasses", expandedFirstLevel: "expandedFirstLevel", decoupleChildFromParent: "decoupleChildFromParent", disableDefaultSearch: "disableDefaultSearch", searchMatchValues: "searchMatchValues" }, outputs: { searchMatchValuesChange: "searchMatchValuesChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => TreeComponent),
                 multi: true
             }
-        ], queries: [{ propertyName: "allItems", predicate: TreeItemComponent, descendants: true }, { propertyName: "fieldsetComponent", predicate: FieldsetComponent }, { propertyName: "searchBarComponent", predicate: SearchBarComponent }], viewQueries: [{ propertyName: "innerHtml", first: true, predicate: ["innerHtml"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "\n<ng-template #innerHtml>\n  <ng-content select=\"desy-hint\"></ng-content>\n  <ng-content select=\"desy-error-message\"></ng-content>\n  <ng-content select=\"desy-search-bar\"></ng-content>\n  <ul [class]=\"['c-tree', classes] | makeHtmlList\"\n      [attr.role]=\"role ? role : 'tree'\"\n      [desyAppAccessibility]=\"this\">\n    <ng-content></ng-content>\n  </ul>\n</ng-template>\n\n<!-- tree -->\n<div [class]=\"['c-form-group', formGroupClasses] | makeHtmlList\"\n     [ngClass]=\"{'c-form-group--error': (hasErrorsMessage() || formGroupClasses === 'c-form-group--error') }\">\n  <ng-container *ngIf=\"hasFieldsetComponent(); else innerHtml\">\n    <ng-content select=\"desy-fieldset\"></ng-content>\n  </ng-container>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
+        ], queries: [{ propertyName: "allItems", predicate: TreeItemComponent, descendants: true }, { propertyName: "fieldsetComponent", predicate: FieldsetComponent }, { propertyName: "searchBarComponent", predicate: SearchBarComponent }], viewQueries: [{ propertyName: "innerHtml", first: true, predicate: ["innerHtml"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-template #innerHtml>\n  <ng-content select=\"desy-hint\"></ng-content>\n  <ng-content select=\"desy-error-message\"></ng-content>\n  <ng-content select=\"desy-search-bar\"></ng-content>\n  <ul [attr.id]=\"id ? id : null\"\n      [attr.role]=\"role ? role : 'tree'\"\n      [desyAppAccessibility]=\"this\">\n    <ng-content></ng-content>\n  </ul>\n</ng-template>\n\n<!-- tree -->\n<div [class]=\"['c-form-group', formGroupClasses] | makeHtmlList\"\n     [ngClass]=\"{'c-form-group--error': (hasErrorsMessage() || formGroupClasses === 'c-form-group--error') }\">\n  <ng-container *ngIf=\"hasFieldsetComponent(); else innerHtml\">\n    <ng-content select=\"desy-fieldset\"></ng-content>\n  </ng-container>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
 }
 __decorate([
     DesyOnInputChange('onSearchMatchValuesChange'),
@@ -5578,8 +5773,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             useExisting: forwardRef(() => TreeComponent),
                             multi: true
                         }
-                    ], template: "\n<ng-template #innerHtml>\n  <ng-content select=\"desy-hint\"></ng-content>\n  <ng-content select=\"desy-error-message\"></ng-content>\n  <ng-content select=\"desy-search-bar\"></ng-content>\n  <ul [class]=\"['c-tree', classes] | makeHtmlList\"\n      [attr.role]=\"role ? role : 'tree'\"\n      [desyAppAccessibility]=\"this\">\n    <ng-content></ng-content>\n  </ul>\n</ng-template>\n\n<!-- tree -->\n<div [class]=\"['c-form-group', formGroupClasses] | makeHtmlList\"\n     [ngClass]=\"{'c-form-group--error': (hasErrorsMessage() || formGroupClasses === 'c-form-group--error') }\">\n  <ng-container *ngIf=\"hasFieldsetComponent(); else innerHtml\">\n    <ng-content select=\"desy-fieldset\"></ng-content>\n  </ng-container>\n</div>" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { idPrefix: [{
+                    ], template: "<ng-template #innerHtml>\n  <ng-content select=\"desy-hint\"></ng-content>\n  <ng-content select=\"desy-error-message\"></ng-content>\n  <ng-content select=\"desy-search-bar\"></ng-content>\n  <ul [attr.id]=\"id ? id : null\"\n      [attr.role]=\"role ? role : 'tree'\"\n      [desyAppAccessibility]=\"this\">\n    <ng-content></ng-content>\n  </ul>\n</ng-template>\n\n<!-- tree -->\n<div [class]=\"['c-form-group', formGroupClasses] | makeHtmlList\"\n     [ngClass]=\"{'c-form-group--error': (hasErrorsMessage() || formGroupClasses === 'c-form-group--error') }\">\n  <ng-container *ngIf=\"hasFieldsetComponent(); else innerHtml\">\n    <ng-content select=\"desy-fieldset\"></ng-content>\n  </ng-container>\n</div>" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
+                type: Input
+            }], idPrefix: [{
                 type: Input
             }], classes: [{
                 type: Input
@@ -6275,11 +6472,11 @@ class BreadcrumbsComponent extends AccessibilityComponent {
         return itemList;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BreadcrumbsComponent, deps: [{ token: i1.Location }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BreadcrumbsComponent, selector: "desy-breadcrumbs", inputs: { items: "items", classes: "classes", id: "id", collapseOnMobile: "collapseOnMobile", inlineOnMobile: "inlineOnMobile", inlineOnDesktop: "inlineOnDesktop", hasBackButton: "hasBackButton" }, queries: [{ propertyName: "itemComponentList", predicate: BreadcrumbsItemComponent }], usesInheritance: true, ngImport: i0, template: "<nav [class]=\"(classes ? 'c-breadcrumbs ' + classes : 'c-breadcrumbs') + (collapseOnMobile===true ? ' ' + 'c-breadcrumbs--collapse-on-mobile' : '') + (inlineOnMobile===true ? ' ' + 'c-breadcrumbs--inline-on-mobile' : '') + (inlineOnDesktop===true ? ' ' + 'c-breadcrumbs--inline-on-desktop' : '')\"\n    [attr.id]=\"id ? id : null\"\n    [desyAppAccessibility]=\"this\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : 'Est\u00E1s en: '\">\n    <ol [ngClass]=\"{\n      'lg:grid-cols-max-content-1': getLength() === 1 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-2': getLength() === 2 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-3': getLength() === 3 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-4': getLength() === 4 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-5': getLength() === 5 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-6': getLength() === 6 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-7': getLength() === 7 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-8': getLength() === 8 && !inlineOnDesktop,\n      'lg:grid': !inlineOnDesktop}\" class=\"w-full items-baseline text-sm\">\n    \n        <li *ngIf=\"hasBackButton\" class=\"c-breadcrumbs__backbutton flex items-baseline font-bold text-primary-base\">\n            <a (click)=\"goBack()\" class=\"px-sm border-r border-neutral-base focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black cursor-pointer\">\n                <span class=\"sr-only\">Volver a la p\u00E1gina anterior</span><span aria-hidden=\"true\" title=\"Volver a la p\u00E1gina anterior\">&larr;</span>\n            </a>\n        </li>\n        <ng-container *ngFor=\"let item of getItemList(); last as isLast; index as index\">\n            <li *ngIf=\"!isLast\" class=\"flex items-baseline mb-sm py-xs text-neutral-dark\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"underline focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black truncate\"\n                    [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline truncate\"\n                      [attr.id]=\"item.id ? item.id : null\"\n                      [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </span>\n            </li>\n            <li *ngIf=\"isLast\" class=\"flex items-baseline mb-sm py-xs text-neutral-dark flex-1 font-semibold\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black text-black font-semibold no-underline truncate\"\n                    aria-current=\"page\" [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline text-black truncate\" aria-current=\"page\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </span>\n            </li>\n        </ng-container>\n    </ol>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BreadcrumbsComponent, selector: "desy-breadcrumbs", inputs: { items: "items", classes: "classes", id: "id", collapseOnMobile: "collapseOnMobile", inlineOnMobile: "inlineOnMobile", inlineOnDesktop: "inlineOnDesktop", hasBackButton: "hasBackButton" }, queries: [{ propertyName: "itemComponentList", predicate: BreadcrumbsItemComponent }], usesInheritance: true, ngImport: i0, template: "<nav [class]=\"(classes ? 'c-breadcrumbs ' + classes : 'c-breadcrumbs') + (collapseOnMobile===true ? ' ' + 'c-breadcrumbs--collapse-on-mobile' : '') + (inlineOnMobile===true ? ' ' + 'c-breadcrumbs--inline-on-mobile' : '') + (inlineOnDesktop===true ? ' ' + 'c-breadcrumbs--inline-on-desktop' : '')\"\n    [attr.id]=\"id ? id : null\"\n    [desyAppAccessibility]=\"this\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : 'Est\u00E1s en: '\">\n    <ol [ngClass]=\"{\n      'lg:grid-cols-max-content-1': getLength() === 1 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-2': getLength() === 2 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-3': getLength() === 3 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-4': getLength() === 4 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-5': getLength() === 5 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-6': getLength() === 6 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-7': getLength() === 7 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-8': getLength() === 8 && !inlineOnDesktop,\n      'lg:grid': !inlineOnDesktop}\" class=\"w-full items-baseline text-sm\">\n    \n        <li *ngIf=\"hasBackButton\" class=\"c-breadcrumbs__backbutton flex items-baseline font-bold text-primary-base\">\n            <a (click)=\"goBack()\" class=\"px-sm border-r border-neutral-base focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black cursor-pointer\">\n                <span class=\"sr-only\">Volver a la p\u00E1gina anterior</span><span aria-hidden=\"true\" title=\"Volver a la p\u00E1gina anterior\">&larr;</span>\n            </a>\n        </li>\n        <ng-container *ngFor=\"let item of getItemList(); last as isLast; index as index\">\n            <li *ngIf=\"!isLast\" class=\"flex items-baseline max-w-full mb-sm py-xs text-neutral-dark\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"underline focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black truncate\"\n                    [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline truncate\"\n                      [attr.id]=\"item.id ? item.id : null\"\n                      [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </span>\n            </li>\n            <li *ngIf=\"isLast\" class=\"flex items-baseline max-w-full mb-sm py-xs text-neutral-dark flex-1 font-semibold\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black text-black font-semibold no-underline truncate\"\n                    aria-current=\"page\" [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline text-black truncate\" aria-current=\"page\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </span>\n            </li>\n        </ng-container>\n    </ol>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BreadcrumbsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-breadcrumbs', template: "<nav [class]=\"(classes ? 'c-breadcrumbs ' + classes : 'c-breadcrumbs') + (collapseOnMobile===true ? ' ' + 'c-breadcrumbs--collapse-on-mobile' : '') + (inlineOnMobile===true ? ' ' + 'c-breadcrumbs--inline-on-mobile' : '') + (inlineOnDesktop===true ? ' ' + 'c-breadcrumbs--inline-on-desktop' : '')\"\n    [attr.id]=\"id ? id : null\"\n    [desyAppAccessibility]=\"this\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : 'Est\u00E1s en: '\">\n    <ol [ngClass]=\"{\n      'lg:grid-cols-max-content-1': getLength() === 1 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-2': getLength() === 2 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-3': getLength() === 3 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-4': getLength() === 4 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-5': getLength() === 5 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-6': getLength() === 6 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-7': getLength() === 7 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-8': getLength() === 8 && !inlineOnDesktop,\n      'lg:grid': !inlineOnDesktop}\" class=\"w-full items-baseline text-sm\">\n    \n        <li *ngIf=\"hasBackButton\" class=\"c-breadcrumbs__backbutton flex items-baseline font-bold text-primary-base\">\n            <a (click)=\"goBack()\" class=\"px-sm border-r border-neutral-base focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black cursor-pointer\">\n                <span class=\"sr-only\">Volver a la p\u00E1gina anterior</span><span aria-hidden=\"true\" title=\"Volver a la p\u00E1gina anterior\">&larr;</span>\n            </a>\n        </li>\n        <ng-container *ngFor=\"let item of getItemList(); last as isLast; index as index\">\n            <li *ngIf=\"!isLast\" class=\"flex items-baseline mb-sm py-xs text-neutral-dark\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"underline focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black truncate\"\n                    [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline truncate\"\n                      [attr.id]=\"item.id ? item.id : null\"\n                      [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </span>\n            </li>\n            <li *ngIf=\"isLast\" class=\"flex items-baseline mb-sm py-xs text-neutral-dark flex-1 font-semibold\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black text-black font-semibold no-underline truncate\"\n                    aria-current=\"page\" [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline text-black truncate\" aria-current=\"page\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </span>\n            </li>\n        </ng-container>\n    </ol>\n</nav>\n" }]
+            args: [{ selector: 'desy-breadcrumbs', template: "<nav [class]=\"(classes ? 'c-breadcrumbs ' + classes : 'c-breadcrumbs') + (collapseOnMobile===true ? ' ' + 'c-breadcrumbs--collapse-on-mobile' : '') + (inlineOnMobile===true ? ' ' + 'c-breadcrumbs--inline-on-mobile' : '') + (inlineOnDesktop===true ? ' ' + 'c-breadcrumbs--inline-on-desktop' : '')\"\n    [attr.id]=\"id ? id : null\"\n    [desyAppAccessibility]=\"this\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : 'Est\u00E1s en: '\">\n    <ol [ngClass]=\"{\n      'lg:grid-cols-max-content-1': getLength() === 1 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-2': getLength() === 2 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-3': getLength() === 3 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-4': getLength() === 4 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-5': getLength() === 5 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-6': getLength() === 6 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-7': getLength() === 7 && !inlineOnDesktop,\n      'lg:grid-cols-max-content-8': getLength() === 8 && !inlineOnDesktop,\n      'lg:grid': !inlineOnDesktop}\" class=\"w-full items-baseline text-sm\">\n    \n        <li *ngIf=\"hasBackButton\" class=\"c-breadcrumbs__backbutton flex items-baseline font-bold text-primary-base\">\n            <a (click)=\"goBack()\" class=\"px-sm border-r border-neutral-base focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black cursor-pointer\">\n                <span class=\"sr-only\">Volver a la p\u00E1gina anterior</span><span aria-hidden=\"true\" title=\"Volver a la p\u00E1gina anterior\">&larr;</span>\n            </a>\n        </li>\n        <ng-container *ngFor=\"let item of getItemList(); last as isLast; index as index\">\n            <li *ngIf=\"!isLast\" class=\"flex items-baseline max-w-full mb-sm py-xs text-neutral-dark\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"underline focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black truncate\"\n                    [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline truncate\"\n                      [attr.id]=\"item.id ? item.id : null\"\n                      [desyAppAccessibility]=\"item\">\n                  <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                </span>\n            </li>\n            <li *ngIf=\"isLast\" class=\"flex items-baseline max-w-full mb-sm py-xs text-neutral-dark flex-1 font-semibold\"  [ngClass]=\"{'hover:text-black' : item.routerLink}\">\n                <a *ngIf=\"item.routerLink\" class=\"focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black text-black font-semibold no-underline truncate\"\n                    aria-current=\"page\" [routerLink]=\"item.routerLink\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </a>\n                <span *ngIf=\"!item.routerLink\" class=\"no-underline text-black truncate\" aria-current=\"page\"\n                    [attr.id]=\"item.id ? item.id : null\"\n                    [desyAppAccessibility]=\"item\">\n                  <strong>\n                    <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n                  </strong>\n                </span>\n            </li>\n        </ng-container>\n    </ol>\n</nav>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Location }]; }, propDecorators: { items: [{
                 type: Input
             }], classes: [{
@@ -6373,6 +6570,7 @@ var Type$1;
 (function (Type) {
     Type["UE"] = "UE";
     Type["FEDER"] = "FEDER";
+    Type["FEADER"] = "FEADER";
     Type["FSE"] = "FSE+";
     Type["Plurifondo"] = "Plurifondo";
     Type["Custom"] = "Custom";
@@ -6448,7 +6646,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 class FooterNavigationComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FooterNavigationComponent, selector: "desy-footer-navigation", inputs: { title: "title", columns: "columns" }, queries: [{ propertyName: "itemComponents", predicate: FooterNavigationItemComponent }], ngImport: i0, template: "" }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FooterNavigationComponent, selector: "desy-footer-navigation", inputs: { title: "title", columns: "columns", classes: "classes" }, queries: [{ propertyName: "itemComponents", predicate: FooterNavigationItemComponent }], ngImport: i0, template: "" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterNavigationComponent, decorators: [{
             type: Component,
@@ -6457,6 +6655,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], columns: [{
                 type: Input
+            }], classes: [{
+                type: Input
             }], itemComponents: [{
                 type: ContentChildren,
                 args: [FooterNavigationItemComponent]
@@ -6482,7 +6682,7 @@ class FooterComponent extends AccessibilityComponent {
         return meta instanceof FooterMetaComponent ? meta.contentComponent : null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FooterComponent, selector: "desy-footer", inputs: { meta: "meta", navigation: "navigation", icon: "icon", containerClasses: "containerClasses", classes: "classes", description: "description", noLogo: "noLogo", urlFeder: "urlFeder", url: "url", logoContainerClasses: "logoContainerClasses", type: "type" }, queries: [{ propertyName: "iconComponent", predicate: IconComponent }, { propertyName: "metaComponent", predicate: FooterMetaComponent }, { propertyName: "descriptionComponent", predicate: DescriptionComponent }, { propertyName: "navigationComponent", predicate: FooterNavigationComponent }], usesInheritance: true, ngImport: i0, template: "<footer [class]=\"['py-base bg-neutral-lighter border-t border-neutral-base text-xs lg:text-sm text-neutral-dark', classes] | makeHtmlList\" \n  [desyAppAccessibility]=\"this\">\n  <div [class]=\"['container mx-auto px-base', containerClasses] | makeHtmlList\">\n    <ng-container *ngIf=\"getNavigationItems()\">\n      <div class=\"flex flex-col lg:flex-row flex-wrap gap-base\">\n        <div class=\"flex-1\" *ngFor=\"let nav of getNavigationItems()\">\n          <div class=\"lg:flex-1\">\n            <h3 class=\"c-h3 mb-base\">{{nav.title}}</h3>\n          </div>\n          <ul [class]=\"'grid grid-cols-1 gap-base lg:grid-cols-' + nav.columns\">\n            <li class=\"mb-xs\" *ngFor=\"let item of getNavigationItemItems(nav)\">\n              <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n            </li>\n          </ul>\n        </div>\n      </div>\n      <hr class=\"my-base border-t border-neutral-base\">\n    </ng-container>\n\n    <div class=\"flex flex-wrap flex-col lg:flex-row justify-between\">\n      <div class=\"mb-base\">\n        <ng-template #metaTemplate let-metaElement=\"metaElement\">\n          <ng-container *ngIf=\"metaElement\">\n            <h2 class=\"sr-only\">{{(metaElement.visuallyHiddenTitle ? metaElement.visuallyHiddenTitle : 'Enlaces de pie de p\u00E1gina')}}</h2>\n            <ul class=\"flex flex-col lg:flex-row lg:flex-wrap mb-base\" *ngIf=\"getMetaItems(metaElement)\">\n              <li class=\"mb-sm mr-base\" *ngFor=\"let item of getMetaItems(metaElement)\">\n                <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n              </li>\n            </ul>\n            <div class=\"mb-sm\"  *ngIf=\"getMetaContent(metaElement) || metaElement.html || metaElement.text\">\n              <p>\n                <ng-container *desyCustomInnerContent=\"{ component: getMetaContent(metaElement), html: metaElement.html, text: metaElement.text }\"></ng-container>\n              </p>\n            </div>\n          </ng-container>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"metaTemplate; context: { metaElement: metaComponent ? metaComponent : meta }\"></ng-container>\n\n        <!-- Description -->\n        <div *ngIf=\"descriptionComponent || description?.html || description?.text; else noDesc\">\n          <h2 class=\"sr-only\">{{descriptionComponent?.visuallyHiddenTitle ? descriptionComponent?.visuallyHiddenTitle : description?.visuallyHiddenTitle ? description?.visuallyHiddenTitle : 'Acerca de'}}</h2>\n          <ng-container *desyCustomInnerContent=\"{ component: descriptionComponent, html: description?.html, text: description?.text }\"></ng-container>\n        </div>\n        <ng-template #noDesc>\n          <div class=\"leading-tight\">\n            <p>\n              Todo el contenido bajo\n              <a class=\"c-link c-link--neutral\" href=\"https://creativecommons.org/licenses/by/4.0/legalcode.es\" rel=\"license\"\n                target=\"_blank\" title=\"Se abre en ventana nueva\">licencia CC BY 4.0</a>\n            </p>\n          </div>\n          <div class=\"leading-tight\">\n            <p>\n              <a target=\"_blank\" class=\"c-link c-link--neutral\" href=\"https://www.aragon.es/\" title=\"Se abre en ventana nueva\">Gobierno de Arag\u00F3n</a>. Edificio\n              Pignatelli. <abbr title=\"Paseo\">P\u00BA</abbr> Mar\u00EDa Agust\u00EDn, 36. 50004 - Zaragoza - <abbr title=\"Tel\u00E9fono\"\n                class=\"no-underline\">Tel.</abbr> <a href=\"tel:+34976714000\" class=\"c-link c-link--neutral\">976 714 000</a>\n            </p>\n          </div>\n        </ng-template>\n\n      </div>\n    </div>\n    <div class=\"overflow-hidden\">\n      <div class=\"flex flex-wrap gap-base lg:gap-x-2xl w-full pt-lg\">\n          <ng-container *ngIf=\"!noLogo\">\n            <div [class]=\"logoContainerClasses\">\n              <p><a [href]=\"url?(url | externalHref):urlFeder ? (urlFeder | externalHref):'https://www.aragon.es/-/fondos-europeos-aragon'\" class=\"inline-block text-sm c-link no-underline\" title=\"M\u00E1s informaci\u00F3n sobre los Fondos Europeos\">\n                  <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchCase=\"typeEnum.UE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--ue\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea.\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FSE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--fse\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Fondo Social Europeo Plus (FSE+).\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FEDER\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER).\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Plurifondo\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--plurifondo\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Plurifondo.\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Custom\">\n                      <ng-content></ng-content>\n                    </ng-container>\n                    <ng-container *ngSwitchDefault>\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER).\"></span>\n                    </ng-container>\n                  </ng-container>\n                </a></p>\n            </div>\n          </ng-container>\n          <div *ngIf=\"iconComponent || icon?.html\" [class]=\"icon?.containerClasses || iconComponent?.containerClasses ? icon?.containerClasses || iconComponent?.containerClasses:'flex-1'\">\n            <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon?.html }\"></ng-container>\n          </div>\n      </div>\n    </div>\n  </div>\n</footer>\n\n<ng-template #itemHref let-item=\"item\">\n  <a class=\"c-link font-semibold\" [href]=\"item.href | externalHref\"\n     [desyAppAccessibility]=\"item\"\n     [attr.target]=\"item.target\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n\n<ng-template #itemRouterLink let-item=\"item\">\n  <a class=\"c-link font-semibold\" [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\"      \n     [desyAppAccessibility]=\"item\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FooterComponent, selector: "desy-footer", inputs: { meta: "meta", navigation: "navigation", icon: "icon", containerClasses: "containerClasses", classes: "classes", description: "description", noLogo: "noLogo", urlFeder: "urlFeder", url: "url", logoContainerClasses: "logoContainerClasses", type: "type" }, queries: [{ propertyName: "iconComponent", predicate: IconComponent }, { propertyName: "metaComponent", predicate: FooterMetaComponent }, { propertyName: "descriptionComponent", predicate: DescriptionComponent }, { propertyName: "navigationComponent", predicate: FooterNavigationComponent }], usesInheritance: true, ngImport: i0, template: "<footer [class]=\"['py-base bg-neutral-lighter border-t border-neutral-base text-xs lg:text-sm text-neutral-dark', classes] | makeHtmlList\" \n  [desyAppAccessibility]=\"this\">\n  <div [class]=\"['container mx-auto px-base', containerClasses] | makeHtmlList\">\n    <ng-container *ngIf=\"getNavigationItems()\">\n      <div class=\"flex flex-col lg:flex-row flex-wrap gap-base\">\n        <div class=\"flex-1\" *ngFor=\"let nav of getNavigationItems()\">\n          <div [ngClass]=\"nav.classes ? nav.classes : 'flex-1'\">\n            <h3 class=\"c-h4 mb-base text-black\">{{nav.title}}</h3>\n          </div>\n          <ul *ngIf=\"getNavigationItemItems(nav)\"\n            class=\"relative space-y-base\" [ngClass]=\"{\n            'gap-base': nav.columns,\n            'lg:columns-1': nav.columns === 1,\n            'lg:columns-2': nav.columns === 2,\n            'lg:columns-3': nav.columns === 3,\n            'lg:columns-4': nav.columns === 4,\n            'lg:columns-5': nav.columns === 5,\n            'lg:columns-6': nav.columns === 6,\n            'lg:columns-7': nav.columns === 7,\n            'lg:columns-8': nav.columns === 8}\">\n            <li class=\"mb-xs\" *ngFor=\"let item of getNavigationItemItems(nav)\">\n              <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n            </li>\n          </ul>\n        </div>\n      </div>\n      <hr class=\"my-base border-t border-neutral-base\">\n    </ng-container>\n\n    <div class=\"flex flex-wrap flex-col lg:flex-row justify-between\">\n      <div class=\"mb-base\">\n        <ng-template #metaTemplate let-metaElement=\"metaElement\">\n          <ng-container *ngIf=\"metaElement\">\n            <h2 class=\"sr-only\">{{(metaElement.visuallyHiddenTitle ? metaElement.visuallyHiddenTitle : 'Enlaces de pie de p\u00E1gina')}}</h2>\n            <ul class=\"flex flex-col lg:flex-row lg:flex-wrap mb-base\" *ngIf=\"getMetaItems(metaElement)\">\n              <li class=\"mb-sm mr-base\" *ngFor=\"let item of getMetaItems(metaElement)\">\n                <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n              </li>\n            </ul>\n            <div class=\"mb-sm\"  *ngIf=\"getMetaContent(metaElement) || metaElement.html || metaElement.text\">\n              <p>\n                <ng-container *desyCustomInnerContent=\"{ component: getMetaContent(metaElement), html: metaElement.html, text: metaElement.text }\"></ng-container>\n              </p>\n            </div>\n          </ng-container>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"metaTemplate; context: { metaElement: metaComponent ? metaComponent : meta }\"></ng-container>\n\n        <!-- Description -->\n        <div *ngIf=\"descriptionComponent || description?.html || description?.text; else noDesc\">\n          <h2 class=\"sr-only\">{{descriptionComponent?.visuallyHiddenTitle ? descriptionComponent?.visuallyHiddenTitle : description?.visuallyHiddenTitle ? description?.visuallyHiddenTitle : 'Acerca de'}}</h2>\n          <ng-container *desyCustomInnerContent=\"{ component: descriptionComponent, html: description?.html, text: description?.text }\"></ng-container>\n        </div>\n        <ng-template #noDesc>\n          <div class=\"leading-tight\">\n            <p>\n              Todo el contenido bajo\n              <a class=\"c-link c-link--neutral\" href=\"https://creativecommons.org/licenses/by/4.0/legalcode.es\" rel=\"license\"\n                target=\"_blank\" title=\"Se abre en ventana nueva\">licencia CC BY 4.0</a>\n            </p>\n          </div>\n          <div class=\"leading-tight\">\n            <p>\n              <a target=\"_blank\" class=\"c-link c-link--neutral\" href=\"https://www.aragon.es/\" title=\"Se abre en ventana nueva\">Gobierno de Arag\u00F3n</a>. Edificio\n              Pignatelli. <abbr title=\"Paseo\">P\u00BA</abbr> Mar\u00EDa Agust\u00EDn, 36. 50004 - Zaragoza - <abbr title=\"Tel\u00E9fono\"\n                class=\"no-underline\">Tel.</abbr> <a href=\"tel:+34976714000\" class=\"c-link c-link--neutral\">976 714 000</a>\n            </p>\n          </div>\n        </ng-template>\n\n      </div>\n    </div>\n    <div class=\"overflow-hidden\">\n      <div class=\"flex flex-wrap gap-base lg:gap-x-2xl w-full pt-lg\">\n          <ng-container *ngIf=\"!noLogo\">\n            <div [class]=\"logoContainerClasses\">\n              <p><a [href]=\"url?(url | externalHref):urlFeder ? (urlFeder | externalHref):'https://www.aragon.es/-/fondos-europeos-aragon'\" class=\"inline-block text-sm c-link no-underline\" title=\"M\u00E1s informaci\u00F3n sobre los Fondos Europeos\">\n                  <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchCase=\"typeEnum.UE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--ue\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FSE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--fse\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Social Europeo Plus (FSE+). Ministerio de Agricultura y Econom\u00EDa Social.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FEDER\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER). Ministerio de Hacienda.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FEADER\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feader\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo Agrario de Desarrollo Rural (FEADER). Ministerio de Agricultura, Pesca y Alimentaci\u00F3n.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Plurifondo\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--plurifondo\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Plurifondo. Gobierno de Espa\u00F1a.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Custom\">\n                      <ng-content></ng-content>\n                    </ng-container>\n                    <ng-container *ngSwitchDefault>\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER). Ministerio de Hacienda.</span></span>\n                    </ng-container>\n                  </ng-container>\n                </a></p>\n            </div>\n          </ng-container>\n          <div *ngIf=\"iconComponent || icon?.html\" [class]=\"icon?.containerClasses || iconComponent?.containerClasses ? icon?.containerClasses || iconComponent?.containerClasses:'flex-1'\">\n            <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon?.html }\"></ng-container>\n          </div>\n      </div>\n    </div>\n  </div>\n</footer>\n\n<ng-template #itemHref let-item=\"item\">\n  <a class=\"c-link font-semibold\" [href]=\"item.href | externalHref\"\n     [desyAppAccessibility]=\"item\"\n     [attr.target]=\"item.target\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n\n<ng-template #itemRouterLink let-item=\"item\">\n  <a class=\"c-link font-semibold\" [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\"      \n     [desyAppAccessibility]=\"item\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
 }
 __decorate([
     DesyContentChild(),
@@ -6498,7 +6698,7 @@ __decorate([
 ], FooterComponent.prototype, "descriptionComponent", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-footer', template: "<footer [class]=\"['py-base bg-neutral-lighter border-t border-neutral-base text-xs lg:text-sm text-neutral-dark', classes] | makeHtmlList\" \n  [desyAppAccessibility]=\"this\">\n  <div [class]=\"['container mx-auto px-base', containerClasses] | makeHtmlList\">\n    <ng-container *ngIf=\"getNavigationItems()\">\n      <div class=\"flex flex-col lg:flex-row flex-wrap gap-base\">\n        <div class=\"flex-1\" *ngFor=\"let nav of getNavigationItems()\">\n          <div class=\"lg:flex-1\">\n            <h3 class=\"c-h3 mb-base\">{{nav.title}}</h3>\n          </div>\n          <ul [class]=\"'grid grid-cols-1 gap-base lg:grid-cols-' + nav.columns\">\n            <li class=\"mb-xs\" *ngFor=\"let item of getNavigationItemItems(nav)\">\n              <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n            </li>\n          </ul>\n        </div>\n      </div>\n      <hr class=\"my-base border-t border-neutral-base\">\n    </ng-container>\n\n    <div class=\"flex flex-wrap flex-col lg:flex-row justify-between\">\n      <div class=\"mb-base\">\n        <ng-template #metaTemplate let-metaElement=\"metaElement\">\n          <ng-container *ngIf=\"metaElement\">\n            <h2 class=\"sr-only\">{{(metaElement.visuallyHiddenTitle ? metaElement.visuallyHiddenTitle : 'Enlaces de pie de p\u00E1gina')}}</h2>\n            <ul class=\"flex flex-col lg:flex-row lg:flex-wrap mb-base\" *ngIf=\"getMetaItems(metaElement)\">\n              <li class=\"mb-sm mr-base\" *ngFor=\"let item of getMetaItems(metaElement)\">\n                <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n              </li>\n            </ul>\n            <div class=\"mb-sm\"  *ngIf=\"getMetaContent(metaElement) || metaElement.html || metaElement.text\">\n              <p>\n                <ng-container *desyCustomInnerContent=\"{ component: getMetaContent(metaElement), html: metaElement.html, text: metaElement.text }\"></ng-container>\n              </p>\n            </div>\n          </ng-container>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"metaTemplate; context: { metaElement: metaComponent ? metaComponent : meta }\"></ng-container>\n\n        <!-- Description -->\n        <div *ngIf=\"descriptionComponent || description?.html || description?.text; else noDesc\">\n          <h2 class=\"sr-only\">{{descriptionComponent?.visuallyHiddenTitle ? descriptionComponent?.visuallyHiddenTitle : description?.visuallyHiddenTitle ? description?.visuallyHiddenTitle : 'Acerca de'}}</h2>\n          <ng-container *desyCustomInnerContent=\"{ component: descriptionComponent, html: description?.html, text: description?.text }\"></ng-container>\n        </div>\n        <ng-template #noDesc>\n          <div class=\"leading-tight\">\n            <p>\n              Todo el contenido bajo\n              <a class=\"c-link c-link--neutral\" href=\"https://creativecommons.org/licenses/by/4.0/legalcode.es\" rel=\"license\"\n                target=\"_blank\" title=\"Se abre en ventana nueva\">licencia CC BY 4.0</a>\n            </p>\n          </div>\n          <div class=\"leading-tight\">\n            <p>\n              <a target=\"_blank\" class=\"c-link c-link--neutral\" href=\"https://www.aragon.es/\" title=\"Se abre en ventana nueva\">Gobierno de Arag\u00F3n</a>. Edificio\n              Pignatelli. <abbr title=\"Paseo\">P\u00BA</abbr> Mar\u00EDa Agust\u00EDn, 36. 50004 - Zaragoza - <abbr title=\"Tel\u00E9fono\"\n                class=\"no-underline\">Tel.</abbr> <a href=\"tel:+34976714000\" class=\"c-link c-link--neutral\">976 714 000</a>\n            </p>\n          </div>\n        </ng-template>\n\n      </div>\n    </div>\n    <div class=\"overflow-hidden\">\n      <div class=\"flex flex-wrap gap-base lg:gap-x-2xl w-full pt-lg\">\n          <ng-container *ngIf=\"!noLogo\">\n            <div [class]=\"logoContainerClasses\">\n              <p><a [href]=\"url?(url | externalHref):urlFeder ? (urlFeder | externalHref):'https://www.aragon.es/-/fondos-europeos-aragon'\" class=\"inline-block text-sm c-link no-underline\" title=\"M\u00E1s informaci\u00F3n sobre los Fondos Europeos\">\n                  <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchCase=\"typeEnum.UE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--ue\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea.\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FSE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--fse\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Fondo Social Europeo Plus (FSE+).\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FEDER\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER).\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Plurifondo\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--plurifondo\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Plurifondo.\"></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Custom\">\n                      <ng-content></ng-content>\n                    </ng-container>\n                    <ng-container *ngSwitchDefault>\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\" role=\"img\" aria-label=\"Logotipo Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER).\"></span>\n                    </ng-container>\n                  </ng-container>\n                </a></p>\n            </div>\n          </ng-container>\n          <div *ngIf=\"iconComponent || icon?.html\" [class]=\"icon?.containerClasses || iconComponent?.containerClasses ? icon?.containerClasses || iconComponent?.containerClasses:'flex-1'\">\n            <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon?.html }\"></ng-container>\n          </div>\n      </div>\n    </div>\n  </div>\n</footer>\n\n<ng-template #itemHref let-item=\"item\">\n  <a class=\"c-link font-semibold\" [href]=\"item.href | externalHref\"\n     [desyAppAccessibility]=\"item\"\n     [attr.target]=\"item.target\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n\n<ng-template #itemRouterLink let-item=\"item\">\n  <a class=\"c-link font-semibold\" [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\"      \n     [desyAppAccessibility]=\"item\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n" }]
+            args: [{ selector: 'desy-footer', template: "<footer [class]=\"['py-base bg-neutral-lighter border-t border-neutral-base text-xs lg:text-sm text-neutral-dark', classes] | makeHtmlList\" \n  [desyAppAccessibility]=\"this\">\n  <div [class]=\"['container mx-auto px-base', containerClasses] | makeHtmlList\">\n    <ng-container *ngIf=\"getNavigationItems()\">\n      <div class=\"flex flex-col lg:flex-row flex-wrap gap-base\">\n        <div class=\"flex-1\" *ngFor=\"let nav of getNavigationItems()\">\n          <div [ngClass]=\"nav.classes ? nav.classes : 'flex-1'\">\n            <h3 class=\"c-h4 mb-base text-black\">{{nav.title}}</h3>\n          </div>\n          <ul *ngIf=\"getNavigationItemItems(nav)\"\n            class=\"relative space-y-base\" [ngClass]=\"{\n            'gap-base': nav.columns,\n            'lg:columns-1': nav.columns === 1,\n            'lg:columns-2': nav.columns === 2,\n            'lg:columns-3': nav.columns === 3,\n            'lg:columns-4': nav.columns === 4,\n            'lg:columns-5': nav.columns === 5,\n            'lg:columns-6': nav.columns === 6,\n            'lg:columns-7': nav.columns === 7,\n            'lg:columns-8': nav.columns === 8}\">\n            <li class=\"mb-xs\" *ngFor=\"let item of getNavigationItemItems(nav)\">\n              <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n            </li>\n          </ul>\n        </div>\n      </div>\n      <hr class=\"my-base border-t border-neutral-base\">\n    </ng-container>\n\n    <div class=\"flex flex-wrap flex-col lg:flex-row justify-between\">\n      <div class=\"mb-base\">\n        <ng-template #metaTemplate let-metaElement=\"metaElement\">\n          <ng-container *ngIf=\"metaElement\">\n            <h2 class=\"sr-only\">{{(metaElement.visuallyHiddenTitle ? metaElement.visuallyHiddenTitle : 'Enlaces de pie de p\u00E1gina')}}</h2>\n            <ul class=\"flex flex-col lg:flex-row lg:flex-wrap mb-base\" *ngIf=\"getMetaItems(metaElement)\">\n              <li class=\"mb-sm mr-base\" *ngFor=\"let item of getMetaItems(metaElement)\">\n                <ng-container *ngTemplateOutlet=\"(item.href !== null && item.href !== undefined) ? itemHref : itemRouterLink; context: {item: item}\"></ng-container>\n              </li>\n            </ul>\n            <div class=\"mb-sm\"  *ngIf=\"getMetaContent(metaElement) || metaElement.html || metaElement.text\">\n              <p>\n                <ng-container *desyCustomInnerContent=\"{ component: getMetaContent(metaElement), html: metaElement.html, text: metaElement.text }\"></ng-container>\n              </p>\n            </div>\n          </ng-container>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"metaTemplate; context: { metaElement: metaComponent ? metaComponent : meta }\"></ng-container>\n\n        <!-- Description -->\n        <div *ngIf=\"descriptionComponent || description?.html || description?.text; else noDesc\">\n          <h2 class=\"sr-only\">{{descriptionComponent?.visuallyHiddenTitle ? descriptionComponent?.visuallyHiddenTitle : description?.visuallyHiddenTitle ? description?.visuallyHiddenTitle : 'Acerca de'}}</h2>\n          <ng-container *desyCustomInnerContent=\"{ component: descriptionComponent, html: description?.html, text: description?.text }\"></ng-container>\n        </div>\n        <ng-template #noDesc>\n          <div class=\"leading-tight\">\n            <p>\n              Todo el contenido bajo\n              <a class=\"c-link c-link--neutral\" href=\"https://creativecommons.org/licenses/by/4.0/legalcode.es\" rel=\"license\"\n                target=\"_blank\" title=\"Se abre en ventana nueva\">licencia CC BY 4.0</a>\n            </p>\n          </div>\n          <div class=\"leading-tight\">\n            <p>\n              <a target=\"_blank\" class=\"c-link c-link--neutral\" href=\"https://www.aragon.es/\" title=\"Se abre en ventana nueva\">Gobierno de Arag\u00F3n</a>. Edificio\n              Pignatelli. <abbr title=\"Paseo\">P\u00BA</abbr> Mar\u00EDa Agust\u00EDn, 36. 50004 - Zaragoza - <abbr title=\"Tel\u00E9fono\"\n                class=\"no-underline\">Tel.</abbr> <a href=\"tel:+34976714000\" class=\"c-link c-link--neutral\">976 714 000</a>\n            </p>\n          </div>\n        </ng-template>\n\n      </div>\n    </div>\n    <div class=\"overflow-hidden\">\n      <div class=\"flex flex-wrap gap-base lg:gap-x-2xl w-full pt-lg\">\n          <ng-container *ngIf=\"!noLogo\">\n            <div [class]=\"logoContainerClasses\">\n              <p><a [href]=\"url?(url | externalHref):urlFeder ? (urlFeder | externalHref):'https://www.aragon.es/-/fondos-europeos-aragon'\" class=\"inline-block text-sm c-link no-underline\" title=\"M\u00E1s informaci\u00F3n sobre los Fondos Europeos\">\n                  <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchCase=\"typeEnum.UE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--ue\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FSE\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--fse\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Social Europeo Plus (FSE+). Ministerio de Agricultura y Econom\u00EDa Social.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FEDER\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER). Ministerio de Hacienda.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.FEADER\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feader\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo Agrario de Desarrollo Rural (FEADER). Ministerio de Agricultura, Pesca y Alimentaci\u00F3n.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Plurifondo\">\n                      <span class=\"inline-block c-footer__logo c-footer__logo--plurifondo\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Plurifondo. Gobierno de Espa\u00F1a.</span></span>\n                    </ng-container>\n                    <ng-container *ngSwitchCase=\"typeEnum.Custom\">\n                      <ng-content></ng-content>\n                    </ng-container>\n                    <ng-container *ngSwitchDefault>\n                      <span class=\"inline-block c-footer__logo c-footer__logo--feder\"><span class=\"sr-only\">Cofinanciado por la Uni\u00F3n Europea. Fondo Europeo de Desarrollo Regional (FEDER). Ministerio de Hacienda.</span></span>\n                    </ng-container>\n                  </ng-container>\n                </a></p>\n            </div>\n          </ng-container>\n          <div *ngIf=\"iconComponent || icon?.html\" [class]=\"icon?.containerClasses || iconComponent?.containerClasses ? icon?.containerClasses || iconComponent?.containerClasses:'flex-1'\">\n            <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon?.html }\"></ng-container>\n          </div>\n      </div>\n    </div>\n  </div>\n</footer>\n\n<ng-template #itemHref let-item=\"item\">\n  <a class=\"c-link font-semibold\" [href]=\"item.href | externalHref\"\n     [desyAppAccessibility]=\"item\"\n     [attr.target]=\"item.target\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n\n<ng-template #itemRouterLink let-item=\"item\">\n  <a class=\"c-link font-semibold\" [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\"      \n     [desyAppAccessibility]=\"item\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\">\n    <ng-container *desyCustomInnerContent=\"{ component: item, text: item.text }\"></ng-container>\n  </a>\n</ng-template>\n" }]
         }], propDecorators: { meta: [{
                 type: Input
             }], navigation: [{
@@ -6541,11 +6741,11 @@ class HeaderMiniComponent extends AccessibilityComponent {
         this.hasContainer = true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderMiniComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderMiniComponent, selector: "desy-header-mini", inputs: { classes: "classes", hasContainer: "hasContainer", containerClasses: "containerClasses", homepageUrl: "homepageUrl", homepageRouterLink: "homepageRouterLink", homepageFragment: "homepageFragment" }, usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"classes\"\n[desyAppAccessibility]=\"this\">\n  <div [ngClass]=\"containerClasses\">\n    <div class=\"bg-white border-b border-neutral-base\">\n      <div class=\"flex items-center px-base\" [ngClass]=\"hasContainer?'container mx-auto':null\">\n        <a *ngIf=\"!homepageRouterLink\" [href]=\"homepageUrl ? (homepageUrl | externalHref) :'https://www.aragon.es/'\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <a  *ngIf=\"homepageRouterLink\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment || null\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderMiniComponent, selector: "desy-header-mini", inputs: { classes: "classes", hasContainer: "hasContainer", containerClasses: "containerClasses", homepageUrl: "homepageUrl", homepageRouterLink: "homepageRouterLink", homepageFragment: "homepageFragment" }, usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"classes\"\n[desyAppAccessibility]=\"this\">\n <ng-content select=\"desy-header-mini-super\"></ng-content>\n <div [ngClass]=\"containerClasses\">\n    <div class=\"bg-white border-b border-neutral-base\">\n      <div class=\"flex items-center px-base\" [ngClass]=\"hasContainer?'container mx-auto':null\">\n        <a *ngIf=\"!homepageRouterLink\" [href]=\"homepageUrl ? (homepageUrl | externalHref) :'https://www.aragon.es/'\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <a  *ngIf=\"homepageRouterLink\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment || null\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n  <ng-content select=\"desy-header-mini-sub\"></ng-content>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderMiniComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-header-mini', template: "<div [ngClass]=\"classes\"\n[desyAppAccessibility]=\"this\">\n  <div [ngClass]=\"containerClasses\">\n    <div class=\"bg-white border-b border-neutral-base\">\n      <div class=\"flex items-center px-base\" [ngClass]=\"hasContainer?'container mx-auto':null\">\n        <a *ngIf=\"!homepageRouterLink\" [href]=\"homepageUrl ? (homepageUrl | externalHref) :'https://www.aragon.es/'\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <a  *ngIf=\"homepageRouterLink\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment || null\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>" }]
+            args: [{ selector: 'desy-header-mini', template: "<div [ngClass]=\"classes\"\n[desyAppAccessibility]=\"this\">\n <ng-content select=\"desy-header-mini-super\"></ng-content>\n <div [ngClass]=\"containerClasses\">\n    <div class=\"bg-white border-b border-neutral-base\">\n      <div class=\"flex items-center px-base\" [ngClass]=\"hasContainer?'container mx-auto':null\">\n        <a *ngIf=\"!homepageRouterLink\" [href]=\"homepageUrl ? (homepageUrl | externalHref) :'https://www.aragon.es/'\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <a  *ngIf=\"homepageRouterLink\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment || null\" class=\"inline-block pt-2.5 pb-2 text-black focus:outline-none focus:shadow-outline-black\" aria-label=\"Gobierno de Arag\u00F3n. Ir a aragon.es\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"117\" height=\"26\" class=\"inline-block fill-current\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n        </a>\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n  <ng-content select=\"desy-header-mini-sub\"></ng-content>\n</div>" }]
         }], propDecorators: { classes: [{
                 type: Input
             }], hasContainer: [{
@@ -6647,6 +6847,10 @@ class SkipLinkComponent extends AccessibilityComponent {
         const elem = document.querySelector('#' + fragment);
         if (elem) {
             elem.scrollIntoView({ behavior: 'smooth' });
+            const focusableElement = elem.querySelector('button, [tabindex], input, select, textarea, a[href], summary, [contenteditable], [role="button"], [role="link"], [role="checkbox"], [role="radio"], [role="menuitem"], [role="option"], [role="tab"], [role="tabpanel"]');
+            if (focusableElement) {
+                focusableElement.focus();
+            }
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SkipLinkComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
@@ -6942,11 +7146,11 @@ class NavComponent extends AccessibilityComponent {
         return !item.active && !item.disabled;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NavComponent, selector: "desy-nav", inputs: { hasNav: "hasNav", id: "id", idPrefix: "idPrefix", items: "items", classes: "classes" }, outputs: { clickEvent: "clickEvent" }, queries: [{ propertyName: "itemComponentList", predicate: NavItemComponent }], usesInheritance: true, ngImport: i0, template: "<ng-template #innerHtml>\n  <ng-container *ngFor=\"let item of getItemList(); index as i\">\n    <ng-template #noStrong>\n      <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n    </ng-template>\n    <li>\n          <a *ngIf=\"item.href\"\n             [href]=\"item.href | externalHref\" [target]=\"item.target\"\n             [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'pointer-events-none': item.disabled}\"\n             [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [attr.id]=\"getItemId(item, i)\"\n             [desyAppAccessibility]=\"item\"\n             [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n             (keydown.arrowUp)=\"movePrevious($event, i)\"\n             (keydown.arrowDown)=\"moveNext($event, i)\"\n             (click)=\"onClick($event, item)\"\n             (keydown.space)=\"simulateClick($event, item, i)\"\n             (keydown.enter)=\"simulateClick($event, item, i)\">\n             <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n          <a *ngIf=\"!item.href\"\n               [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\" [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n               [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n               [ngClass]=\"{'pointer-events-none': item.disabled}\"\n               [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n               [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n               [attr.id]=\"getItemId(item, i)\"\n               [desyAppAccessibility]=\"item\"\n               [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n               (keydown.arrowUp)=\"movePrevious($event, i)\"\n               (keydown.arrowDown)=\"moveNext($event, i)\"\n               (click)=\"onClick($event, item)\"\n               (keydown.space)=\"simulateClick($event, item, i)\"\n               (keydown.enter)=\"simulateClick($event, item, i)\">\n               <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n              </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n        <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n\n<ul *ngIf=\"!hasNav; else wrapIntoNav\"\n    [class]=\"['text-sm', classes] | makeHtmlList\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ul>\n<ng-template #wrapIntoNav>\n  <nav [class]=\"['text-sm', classes] | makeHtmlList\"\n     [id]=\"id\"\n     [desyAppAccessibility]=\"this\">\n    <ul>\n      <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n    </ul>\n  </nav>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NavComponent, selector: "desy-nav", inputs: { hasNav: "hasNav", id: "id", idPrefix: "idPrefix", items: "items", classes: "classes" }, outputs: { clickEvent: "clickEvent" }, queries: [{ propertyName: "itemComponentList", predicate: NavItemComponent }], usesInheritance: true, ngImport: i0, template: "<ng-template #innerHtml>\n  <ng-container *ngFor=\"let item of getItemList(); index as i\">\n    <ng-template #noStrong>\n      <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n    </ng-template>\n    <li>\n          <a *ngIf=\"item.href\"\n             [href]=\"item.href | externalHref\" [target]=\"item.target\"\n             [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'pointer-events-none': item.disabled}\"\n             [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [attr.id]=\"getItemId(item, i)\"\n             [desyAppAccessibility]=\"item\"\n             [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n             (keydown.arrowUp)=\"movePrevious($event, i)\"\n             (keydown.arrowDown)=\"moveNext($event, i)\"\n             (click)=\"onClick($event, item)\"\n             (keydown.space)=\"simulateClick($event, item, i)\"\n             (keydown.enter)=\"simulateClick($event, item, i)\">\n             <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n          <a *ngIf=\"!item.href\"\n               [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\" [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n               [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n               [ngClass]=\"{'pointer-events-none': item.disabled}\"\n               [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n               [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n               [attr.id]=\"getItemId(item, i)\"\n               [desyAppAccessibility]=\"item\"\n               [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n               (keydown.arrowUp)=\"movePrevious($event, i)\"\n               (keydown.arrowDown)=\"moveNext($event, i)\"\n               (click)=\"onClick($event, item)\"\n               (keydown.space)=\"simulateClick($event, item, i)\"\n               (keydown.enter)=\"simulateClick($event, item, i)\">\n               <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n              </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n        <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n\n<ul *ngIf=\"!hasNav; else wrapIntoNav\"\n    [class]=\"['text-sm', classes] | makeHtmlList\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ul>\n<ng-template #wrapIntoNav>\n  <nav [class]=\"['text-sm', classes] | makeHtmlList\"\n     [id]=\"id\"\n     [desyAppAccessibility]=\"this\">\n    <ul>\n      <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n    </ul>\n  </nav>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-nav', template: "<ng-template #innerHtml>\n  <ng-container *ngFor=\"let item of getItemList(); index as i\">\n    <ng-template #noStrong>\n      <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n    </ng-template>\n    <li>\n          <a *ngIf=\"item.href\"\n             [href]=\"item.href | externalHref\" [target]=\"item.target\"\n             [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'pointer-events-none': item.disabled}\"\n             [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [attr.id]=\"getItemId(item, i)\"\n             [desyAppAccessibility]=\"item\"\n             [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n             (keydown.arrowUp)=\"movePrevious($event, i)\"\n             (keydown.arrowDown)=\"moveNext($event, i)\"\n             (click)=\"onClick($event, item)\"\n             (keydown.space)=\"simulateClick($event, item, i)\"\n             (keydown.enter)=\"simulateClick($event, item, i)\">\n             <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n          <a *ngIf=\"!item.href\"\n               [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\" [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n               [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n               [ngClass]=\"{'pointer-events-none': item.disabled}\"\n               [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n               [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n               [attr.id]=\"getItemId(item, i)\"\n               [desyAppAccessibility]=\"item\"\n               [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n               (keydown.arrowUp)=\"movePrevious($event, i)\"\n               (keydown.arrowDown)=\"moveNext($event, i)\"\n               (click)=\"onClick($event, item)\"\n               (keydown.space)=\"simulateClick($event, item, i)\"\n               (keydown.enter)=\"simulateClick($event, item, i)\">\n               <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n              </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n        <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n\n<ul *ngIf=\"!hasNav; else wrapIntoNav\"\n    [class]=\"['text-sm', classes] | makeHtmlList\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ul>\n<ng-template #wrapIntoNav>\n  <nav [class]=\"['text-sm', classes] | makeHtmlList\"\n     [id]=\"id\"\n     [desyAppAccessibility]=\"this\">\n    <ul>\n      <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n    </ul>\n  </nav>\n</ng-template>\n" }]
+            args: [{ selector: 'desy-nav', template: "<ng-template #innerHtml>\n  <ng-container *ngFor=\"let item of getItemList(); index as i\">\n    <ng-template #noStrong>\n      <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n    </ng-template>\n    <li>\n          <a *ngIf=\"item.href\"\n             [href]=\"item.href | externalHref\" [target]=\"item.target\"\n             [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'pointer-events-none': item.disabled}\"\n             [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [attr.id]=\"getItemId(item, i)\"\n             [desyAppAccessibility]=\"item\"\n             [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n             (keydown.arrowUp)=\"movePrevious($event, i)\"\n             (keydown.arrowDown)=\"moveNext($event, i)\"\n             (click)=\"onClick($event, item)\"\n             (keydown.space)=\"simulateClick($event, item, i)\"\n             (keydown.enter)=\"simulateClick($event, item, i)\">\n             <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n          <a *ngIf=\"!item.href\"\n               [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\" [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n               [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n               [ngClass]=\"{'pointer-events-none': item.disabled}\"\n               [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n               [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n               [attr.id]=\"getItemId(item, i)\"\n               [desyAppAccessibility]=\"item\"\n               [attr.aria-current]=\"item.active ? 'page' : item.ariaCurrent ? item.ariaCurrent : null\"\n               (keydown.arrowUp)=\"movePrevious($event, i)\"\n               (keydown.arrowDown)=\"moveNext($event, i)\"\n               (click)=\"onClick($event, item)\"\n               (keydown.space)=\"simulateClick($event, item, i)\"\n               (keydown.enter)=\"simulateClick($event, item, i)\">\n               <strong class=\"font-bold\" *ngIf=\"item.active; else noStrong\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n              </strong>\n            <svg *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n          </a>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n        <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n\n<ul *ngIf=\"!hasNav; else wrapIntoNav\"\n    [class]=\"['text-sm', classes] | makeHtmlList\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</ul>\n<ng-template #wrapIntoNav>\n  <nav [class]=\"['text-sm', classes] | makeHtmlList\"\n     [id]=\"id\"\n     [desyAppAccessibility]=\"this\">\n    <ul>\n      <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n    </ul>\n  </nav>\n</ng-template>\n" }]
         }], propDecorators: { hasNav: [{
                 type: Input
             }], id: [{
@@ -7383,7 +7587,7 @@ class HeaderComponent extends AccessibilityComponent {
         navigationComponent.ariaLabel = 'Menú principal';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderComponent, selector: "desy-header", inputs: { classes: "classes", containerClasses: "containerClasses", homepageUrl: "homepageUrl", homepageRouterLink: "homepageRouterLink", homepageFragment: "homepageFragment", expandedLogo: "expandedLogo", noLogo: "noLogo", customLogoHtml: "customLogoHtml", customNavigationHtml: "customNavigationHtml", subnavData: "subnavData", navigationData: "navigationData", dropdownData: "dropdownData", offcanvasData: "offcanvasData", skipLinkData: "skipLinkData", mobileTextData: "mobileTextData" }, queries: [{ propertyName: "skiplinkComponent", predicate: SkipLinkComponent }, { propertyName: "subnavComponent", predicate: HeaderSubnavComponent }, { propertyName: "mobileTextComponent", predicate: HeaderMobileTextComponent }, { propertyName: "customNavigationComponent", predicate: HeaderCustomNavigationComponent }, { propertyName: "navigationComponent", predicate: HeaderNavigationComponent }, { propertyName: "dropdownComponent", predicate: HeaderDropdownComponent }, { propertyName: "offcanvasComponent", predicate: HeaderOffcanvasComponent }], usesInheritance: true, ngImport: i0, template: "<header [ngClass]=\"classes\"\n        [desyAppAccessibility]=\"this\">\n  <div [ngClass]=\"containerClasses\">\n    <nav [attr.aria-labelledby]=\"skiplinkComponent && skiplinkComponent.id ? skiplinkComponent.id : 'skip-link'\">\n      <ng-content *ngIf=\"skiplinkComponent\" select=\"desy-skip-link\"></ng-content>        \n        <desy-skip-link *ngIf=\"!skiplinkComponent\" [id]=\"'skip-link'\"><ng-container *desyCustomInnerContent=\"{ html: skipLinkData && skipLinkData.html ? skipLinkData.html : '', text: skipLinkData && skipLinkData.text ? skipLinkData.text : 'Saltar al contenido principal' }\"></ng-container></desy-skip-link>\n    </nav>\n    <div class=\"bg-neutral-lighter border-b border-neutral-base\">\n      <div class=\"container mx-auto px-base\">\n        <div class=\"flex items-center justify-between min-h-14\">\n          <div class=\"flex flex-wrap items-center\">\n            <div class=\"flex items-center\">\n              <a *ngIf=\"homepageRouterLink || !homepageUrl\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n              <a *ngIf=\"!homepageRouterLink && homepageUrl\" [href]=\"homepageUrl | externalHref\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n\n              <ng-content select=\"desy-header-subnav\"></ng-content>\n              <desy-header-subnav *ngIf=\"!subnavComponent && subnavData && (subnavData.text || subnavData.html)\"\n                                  [classes]=\"subnavData.classes\"\n                                  [hiddenText]=\"subnavData.hiddenText\"\n                                  [classesContainer]=\"subnavData.classesContainer\"\n                                  [classesTooltip]=\"subnavData.classesTooltip\"\n                                  [role]=\"subnavData.role\"\n                                  [ariaLabel]=\"subnavData.ariaLabel\"\n                                  [ariaDescribedBy]=\"subnavData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"subnavData.ariaLabelledBy\"\n                                  [ariaHidden]=\"subnavData.ariaHidden\"\n                                  [ariaDisabled]=\"subnavData.ariaDisabled\"\n                                  [ariaControls]=\"subnavData.ariaControls\"\n                                  [ariaCurrent]=\"subnavData.ariaCurrent\"\n                                  [ariaLive]=\"subnavData.ariaLive\"\n                                  [ariaExpanded]=\"subnavData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"subnavData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"subnavData.ariaHasPopup\"\n                                  [tabindex]=\"subnavData.tabindex\">\n                <ng-container *desyCustomInnerContent=\"{ html: subnavData.html, text: subnavData.text }\"></ng-container>\n                <desy-nav *ngIf=\"subnavData && subnavData.items && subnavData.items.length > 0\"\n                          [hasNav]=\"true\"\n                          [idPrefix]=\"'header-subnav-nav-item'\"\n                          [classes]=\"'w-max max-w-64'\"\n                          [items]=\"subnavData.items\"\n                          [id]=\"'id-subnav-nav'\"\n                          [ariaLabel]=\"'Aplicaciones'\"></desy-nav>\n              </desy-header-subnav>\n\n              <ng-content select=\"desy-mobile-text\"></ng-content>\n              <desy-mobile-text *ngIf=\"!mobileTextComponent && mobileTextData && (mobileTextData.text || mobileTextData.html)\"\n                                  [classes]=\"mobileTextData.classes\"\n                                  [text]=\"mobileTextData.text\"\n                                  [html]=\"mobileTextData.html\"\n                                  [role]=\"mobileTextData.role\"\n                                  [ariaLabel]=\"mobileTextData.ariaLabel\"\n                                  [ariaDescribedBy]=\"mobileTextData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"mobileTextData.ariaLabelledBy\"\n                                  [ariaHidden]=\"mobileTextData.ariaHidden\"\n                                  [ariaDisabled]=\"mobileTextData.ariaDisabled\"\n                                  [ariaControls]=\"mobileTextData.ariaControls\"\n                                  [ariaCurrent]=\"mobileTextData.ariaCurrent\"\n                                  [ariaLive]=\"mobileTextData.ariaLive\"\n                                  [ariaExpanded]=\"mobileTextData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"mobileTextData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"mobileTextData.ariaHasPopup\"\n                                  [tabindex]=\"mobileTextData.tabindex\">\n              </desy-mobile-text>\n\n            </div>\n\n            <ng-content select=\"desy-header-navigation\"></ng-content>\n            <desy-header-navigation *ngIf=\"!navigationComponent && navigationData && navigationData.items && navigationData.items.length > 0\"\n                                    [idPrefix]=\"'header-nav-item'\"\n                                    [classes]=\"navigationData.classes\"\n                                    [items]=\"navigationData.items\"\n                                    [ariaLabel]=\"'Men\u00FA principal'\"></desy-header-navigation>\n          </div>\n\n          <ng-container *desyCustomInnerContent=\"{ component: customNavigationComponent, html: customNavigationHtml }\"></ng-container>\n\n          <ng-content select=\"desy-header-dropdown\"></ng-content>\n          <ng-container *ngIf=\"!dropdownComponent && dropdownData && dropdownData.items && dropdownData.items.length > 0\">\n            <desy-header-dropdown [classes]=\"dropdownData.classes\"\n                                  [hiddenText]=\"dropdownData.hiddenText\"\n                                  [classesContainer]=\"dropdownData.classesContainer\"\n                                  [classesTooltip]=\"dropdownData.classesTooltip\"\n                                  [role]=\"dropdownData.role\"\n                                  [ariaLabel]=\"dropdownData.ariaLabel\"\n                                  [ariaDescribedBy]=\"dropdownData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"dropdownData.ariaLabelledBy\"\n                                  [ariaHidden]=\"dropdownData.ariaHidden\"\n                                  [ariaDisabled]=\"dropdownData.ariaDisabled\"\n                                  [ariaControls]=\"dropdownData.ariaControls\"\n                                  [ariaCurrent]=\"dropdownData.ariaCurrent\"\n                                  [ariaLive]=\"dropdownData.ariaLive\"\n                                  [ariaExpanded]=\"dropdownData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"dropdownData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"dropdownData.ariaHasPopup\"\n                                  [tabindex]=\"dropdownData.tabindex\">\n              <ng-container *desyCustomInnerContent=\"{ html: dropdownData.html, text: dropdownData.text }\"></ng-container>\n              <desy-nav [hasNav]=\"true\"\n                        [idPrefix]=\"'header-dropdown-nav-item'\"\n                        [classes]=\"'w-max max-w-64'\"\n                        [items]=\"dropdownData.items\"\n                        [id]=\"'id-dropdown-nav'\"\n                        [ariaLabel]=\"'Men\u00FA de usuario'\"></desy-nav>\n            </desy-header-dropdown>\n          </ng-container>\n\n          <ng-content select=\"desy-header-offcanvas\"></ng-content>\n          <ng-container *ngIf=\"!offcanvasComponent && offcanvasData\">\n            <desy-header-offcanvas [classes]=\"offcanvasData.classes\">\n              <desy-header-offcanvas-button>\n                <ng-container *desyCustomInnerContent=\"{ html: offcanvasData.html, text: offcanvasData.text }\"></ng-container>\n              </desy-header-offcanvas-button>\n              <desy-header-offcanvas-close-button>{{ offcanvasData.textClose }}</desy-header-offcanvas-close-button>\n              <desy-content>\n                <ng-container *desyCustomInnerContent=\"{ template: offcanvasData.contentHtml }\"></ng-container>\n              </desy-content>\n            </desy-header-offcanvas>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: ContentComponent, selector: "desy-content", inputs: ["classes"] }, { kind: "component", type: HeaderSubnavComponent, selector: "desy-header-subnav", inputs: ["hiddenText", "classesContainer", "classesTooltip", "classes"] }, { kind: "component", type: HeaderNavigationComponent, selector: "desy-header-navigation, desy-header-advanced-navigation", inputs: ["idPrefix", "classes", "items"] }, { kind: "component", type: HeaderDropdownComponent, selector: "desy-header-dropdown", inputs: ["hiddenText", "classesContainer", "classesTooltip", "classes"] }, { kind: "component", type: HeaderOffcanvasButtonComponent, selector: "desy-header-offcanvas-button, desy-header-advanced-offcanvas-button" }, { kind: "component", type: HeaderOffcanvasComponent, selector: "desy-header-offcanvas, desy-header-advanced-offcanvas", inputs: ["classes"] }, { kind: "component", type: HeaderOffcanvasCloseButtonComponent, selector: "desy-header-offcanvas-close-button, desy-header-advanced-offcanvas-close-button" }, { kind: "component", type: HeaderMobileTextComponent, selector: "desy-mobile-text", inputs: ["html", "text", "classes"] }, { kind: "component", type: NavComponent, selector: "desy-nav", inputs: ["hasNav", "id", "idPrefix", "items", "classes"], outputs: ["clickEvent"] }, { kind: "component", type: SkipLinkComponent, selector: "desy-skip-link", inputs: ["html", "text", "fragment", "classes", "id"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderComponent, selector: "desy-header", inputs: { classes: "classes", containerClasses: "containerClasses", homepageUrl: "homepageUrl", homepageRouterLink: "homepageRouterLink", homepageFragment: "homepageFragment", expandedLogo: "expandedLogo", noLogo: "noLogo", customLogoHtml: "customLogoHtml", customNavigationHtml: "customNavigationHtml", subnavData: "subnavData", navigationData: "navigationData", dropdownData: "dropdownData", offcanvasData: "offcanvasData", skipLinkData: "skipLinkData", mobileTextData: "mobileTextData" }, queries: [{ propertyName: "skiplinkComponent", predicate: SkipLinkComponent }, { propertyName: "subnavComponent", predicate: HeaderSubnavComponent }, { propertyName: "mobileTextComponent", predicate: HeaderMobileTextComponent }, { propertyName: "customNavigationComponent", predicate: HeaderCustomNavigationComponent }, { propertyName: "navigationComponent", predicate: HeaderNavigationComponent }, { propertyName: "dropdownComponent", predicate: HeaderDropdownComponent }, { propertyName: "offcanvasComponent", predicate: HeaderOffcanvasComponent }], usesInheritance: true, ngImport: i0, template: "<header [ngClass]=\"classes\"\n        [desyAppAccessibility]=\"this\">\n  <div [ngClass]=\"containerClasses\">\n    <nav [attr.aria-labelledby]=\"skiplinkComponent && skiplinkComponent.id ? skiplinkComponent.id : 'skip-link'\">\n      <ng-content *ngIf=\"skiplinkComponent\" select=\"desy-skip-link\"></ng-content>        \n        <desy-skip-link *ngIf=\"!skiplinkComponent\" [id]=\"'skip-link'\"><ng-container *desyCustomInnerContent=\"{ html: skipLinkData && skipLinkData.html ? skipLinkData.html : '', text: skipLinkData && skipLinkData.text ? skipLinkData.text : 'Saltar al contenido principal' }\"></ng-container></desy-skip-link>\n    </nav>\n    <div class=\"bg-neutral-lighter border-b border-neutral-base\">\n      <div class=\"container mx-auto px-base\">\n        <div class=\"flex items-center justify-between min-h-14\">\n          <div class=\"flex flex-wrap items-center\">\n            <div class=\"flex items-center\">\n              <a *ngIf=\"homepageRouterLink || !homepageUrl\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n              <a *ngIf=\"!homepageRouterLink && homepageUrl\" [href]=\"homepageUrl | externalHref\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n\n              <ng-content select=\"desy-header-subnav\"></ng-content>\n              <desy-header-subnav *ngIf=\"!subnavComponent && subnavData && (subnavData.text || subnavData.html)\"\n                                  [classes]=\"subnavData.classes\"\n                                  [hiddenText]=\"subnavData.hiddenText\"\n                                  [classesContainer]=\"subnavData.classesContainer\"\n                                  [classesTooltip]=\"subnavData.classesTooltip\"\n                                  [role]=\"subnavData.role\"\n                                  [ariaLabel]=\"subnavData.ariaLabel\"\n                                  [ariaDescribedBy]=\"subnavData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"subnavData.ariaLabelledBy\"\n                                  [ariaHidden]=\"subnavData.ariaHidden\"\n                                  [ariaDisabled]=\"subnavData.ariaDisabled\"\n                                  [ariaControls]=\"subnavData.ariaControls\"\n                                  [ariaCurrent]=\"subnavData.ariaCurrent\"\n                                  [ariaLive]=\"subnavData.ariaLive\"\n                                  [ariaExpanded]=\"subnavData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"subnavData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"subnavData.ariaHasPopup\"\n                                  [tabindex]=\"subnavData.tabindex\">\n                <ng-container *desyCustomInnerContent=\"{ html: subnavData.html, text: subnavData.text }\"></ng-container>\n                <desy-nav *ngIf=\"subnavData && subnavData.items && subnavData.items.length > 0\"\n                          [hasNav]=\"true\"\n                          [idPrefix]=\"'header-subnav-nav-item'\"\n                          [classes]=\"'w-max max-w-64'\"\n                          [items]=\"subnavData.items\"\n                          [id]=\"'id-subnav-nav'\"\n                          [ariaLabel]=\"'Aplicaciones'\"></desy-nav>\n              </desy-header-subnav>\n\n              <ng-content select=\"desy-mobile-text\"></ng-content>\n              <desy-mobile-text *ngIf=\"!mobileTextComponent && mobileTextData && (mobileTextData.text || mobileTextData.html)\"\n                                  [classes]=\"mobileTextData.classes\"\n                                  [text]=\"mobileTextData.text\"\n                                  [html]=\"mobileTextData.html\"\n                                  [role]=\"mobileTextData.role\"\n                                  [ariaLabel]=\"mobileTextData.ariaLabel\"\n                                  [ariaDescribedBy]=\"mobileTextData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"mobileTextData.ariaLabelledBy\"\n                                  [ariaHidden]=\"mobileTextData.ariaHidden\"\n                                  [ariaDisabled]=\"mobileTextData.ariaDisabled\"\n                                  [ariaControls]=\"mobileTextData.ariaControls\"\n                                  [ariaCurrent]=\"mobileTextData.ariaCurrent\"\n                                  [ariaLive]=\"mobileTextData.ariaLive\"\n                                  [ariaExpanded]=\"mobileTextData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"mobileTextData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"mobileTextData.ariaHasPopup\"\n                                  [tabindex]=\"mobileTextData.tabindex\">\n              </desy-mobile-text>\n\n            </div>\n\n            <ng-content select=\"desy-header-navigation\"></ng-content>\n            <desy-header-navigation *ngIf=\"!navigationComponent && navigationData && navigationData.items && navigationData.items.length > 0\"\n                                    [idPrefix]=\"'header-nav-item'\"\n                                    [classes]=\"navigationData.classes\"\n                                    [items]=\"navigationData.items\"\n                                    [ariaLabel]=\"'Men\u00FA principal'\"></desy-header-navigation>\n          </div>\n\n          <ng-container *desyCustomInnerContent=\"{ component: customNavigationComponent, html: customNavigationHtml }\"></ng-container>\n\n          <ng-content select=\"desy-header-dropdown\"></ng-content>\n          <ng-container *ngIf=\"!dropdownComponent && dropdownData && dropdownData.items && dropdownData.items.length > 0\">\n            <desy-header-dropdown [classes]=\"dropdownData.classes\"\n                                  [hiddenText]=\"dropdownData.hiddenText\"\n                                  [classesContainer]=\"dropdownData.classesContainer\"\n                                  [classesTooltip]=\"dropdownData.classesTooltip\"\n                                  [role]=\"dropdownData.role\"\n                                  [ariaLabel]=\"dropdownData.ariaLabel\"\n                                  [ariaDescribedBy]=\"dropdownData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"dropdownData.ariaLabelledBy\"\n                                  [ariaHidden]=\"dropdownData.ariaHidden\"\n                                  [ariaDisabled]=\"dropdownData.ariaDisabled\"\n                                  [ariaControls]=\"dropdownData.ariaControls\"\n                                  [ariaCurrent]=\"dropdownData.ariaCurrent\"\n                                  [ariaLive]=\"dropdownData.ariaLive\"\n                                  [ariaExpanded]=\"dropdownData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"dropdownData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"dropdownData.ariaHasPopup\"\n                                  [tabindex]=\"dropdownData.tabindex\">\n              <ng-container *desyCustomInnerContent=\"{ html: dropdownData.html, text: dropdownData.text }\"></ng-container>\n              <desy-nav [hasNav]=\"true\"\n                        [idPrefix]=\"'header-dropdown-nav-item'\"\n                        [classes]=\"'w-max max-w-64'\"\n                        [items]=\"dropdownData.items\"\n                        [id]=\"'id-dropdown-nav'\"\n                        [ariaLabel]=\"'Men\u00FA de usuario'\"></desy-nav>\n            </desy-header-dropdown>\n          </ng-container>\n\n          <ng-content select=\"desy-header-offcanvas\"></ng-content>\n          <ng-container *ngIf=\"!offcanvasComponent && offcanvasData\">\n            <desy-header-offcanvas [classes]=\"offcanvasData.classes\">\n              <desy-header-offcanvas-button>\n                <ng-container *desyCustomInnerContent=\"{ html: offcanvasData.html, text: offcanvasData.text }\"></ng-container>\n              </desy-header-offcanvas-button>\n              <desy-header-offcanvas-close-button>{{ offcanvasData.textClose }}</desy-header-offcanvas-close-button>\n              <desy-content>\n                <ng-container *desyCustomInnerContent=\"{ template: offcanvasData.contentHtml }\"></ng-container>\n              </desy-content>\n            </desy-header-offcanvas>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: ContentComponent, selector: "desy-content", inputs: ["classes"] }, { kind: "component", type: HeaderSubnavComponent, selector: "desy-header-subnav", inputs: ["hiddenText", "classesContainer", "classesTooltip", "classes"] }, { kind: "component", type: HeaderNavigationComponent, selector: "desy-header-navigation, desy-header-advanced-navigation", inputs: ["idPrefix", "classes", "items"] }, { kind: "component", type: HeaderDropdownComponent, selector: "desy-header-dropdown", inputs: ["hiddenText", "classesContainer", "classesTooltip", "classes"] }, { kind: "component", type: HeaderOffcanvasButtonComponent, selector: "desy-header-offcanvas-button, desy-header-advanced-offcanvas-button" }, { kind: "component", type: HeaderOffcanvasComponent, selector: "desy-header-offcanvas, desy-header-advanced-offcanvas", inputs: ["classes"] }, { kind: "component", type: HeaderOffcanvasCloseButtonComponent, selector: "desy-header-offcanvas-close-button, desy-header-advanced-offcanvas-close-button" }, { kind: "component", type: HeaderMobileTextComponent, selector: "desy-mobile-text", inputs: ["html", "text", "classes"] }, { kind: "component", type: NavComponent, selector: "desy-nav", inputs: ["hasNav", "id", "idPrefix", "items", "classes"], outputs: ["clickEvent"] }, { kind: "component", type: SkipLinkComponent, selector: "desy-skip-link", inputs: ["html", "text", "fragment", "classes", "id"] }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
 }
 __decorate([
     DesyContentChild(),
@@ -7415,7 +7619,7 @@ __decorate([
 ], HeaderComponent.prototype, "offcanvasComponent", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-header', template: "<header [ngClass]=\"classes\"\n        [desyAppAccessibility]=\"this\">\n  <div [ngClass]=\"containerClasses\">\n    <nav [attr.aria-labelledby]=\"skiplinkComponent && skiplinkComponent.id ? skiplinkComponent.id : 'skip-link'\">\n      <ng-content *ngIf=\"skiplinkComponent\" select=\"desy-skip-link\"></ng-content>        \n        <desy-skip-link *ngIf=\"!skiplinkComponent\" [id]=\"'skip-link'\"><ng-container *desyCustomInnerContent=\"{ html: skipLinkData && skipLinkData.html ? skipLinkData.html : '', text: skipLinkData && skipLinkData.text ? skipLinkData.text : 'Saltar al contenido principal' }\"></ng-container></desy-skip-link>\n    </nav>\n    <div class=\"bg-neutral-lighter border-b border-neutral-base\">\n      <div class=\"container mx-auto px-base\">\n        <div class=\"flex items-center justify-between min-h-14\">\n          <div class=\"flex flex-wrap items-center\">\n            <div class=\"flex items-center\">\n              <a *ngIf=\"homepageRouterLink || !homepageUrl\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n              <a *ngIf=\"!homepageRouterLink && homepageUrl\" [href]=\"homepageUrl | externalHref\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Gobierno de Arag\u00F3n. Ir a la p\u00E1gina de inicio\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n\n              <ng-content select=\"desy-header-subnav\"></ng-content>\n              <desy-header-subnav *ngIf=\"!subnavComponent && subnavData && (subnavData.text || subnavData.html)\"\n                                  [classes]=\"subnavData.classes\"\n                                  [hiddenText]=\"subnavData.hiddenText\"\n                                  [classesContainer]=\"subnavData.classesContainer\"\n                                  [classesTooltip]=\"subnavData.classesTooltip\"\n                                  [role]=\"subnavData.role\"\n                                  [ariaLabel]=\"subnavData.ariaLabel\"\n                                  [ariaDescribedBy]=\"subnavData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"subnavData.ariaLabelledBy\"\n                                  [ariaHidden]=\"subnavData.ariaHidden\"\n                                  [ariaDisabled]=\"subnavData.ariaDisabled\"\n                                  [ariaControls]=\"subnavData.ariaControls\"\n                                  [ariaCurrent]=\"subnavData.ariaCurrent\"\n                                  [ariaLive]=\"subnavData.ariaLive\"\n                                  [ariaExpanded]=\"subnavData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"subnavData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"subnavData.ariaHasPopup\"\n                                  [tabindex]=\"subnavData.tabindex\">\n                <ng-container *desyCustomInnerContent=\"{ html: subnavData.html, text: subnavData.text }\"></ng-container>\n                <desy-nav *ngIf=\"subnavData && subnavData.items && subnavData.items.length > 0\"\n                          [hasNav]=\"true\"\n                          [idPrefix]=\"'header-subnav-nav-item'\"\n                          [classes]=\"'w-max max-w-64'\"\n                          [items]=\"subnavData.items\"\n                          [id]=\"'id-subnav-nav'\"\n                          [ariaLabel]=\"'Aplicaciones'\"></desy-nav>\n              </desy-header-subnav>\n\n              <ng-content select=\"desy-mobile-text\"></ng-content>\n              <desy-mobile-text *ngIf=\"!mobileTextComponent && mobileTextData && (mobileTextData.text || mobileTextData.html)\"\n                                  [classes]=\"mobileTextData.classes\"\n                                  [text]=\"mobileTextData.text\"\n                                  [html]=\"mobileTextData.html\"\n                                  [role]=\"mobileTextData.role\"\n                                  [ariaLabel]=\"mobileTextData.ariaLabel\"\n                                  [ariaDescribedBy]=\"mobileTextData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"mobileTextData.ariaLabelledBy\"\n                                  [ariaHidden]=\"mobileTextData.ariaHidden\"\n                                  [ariaDisabled]=\"mobileTextData.ariaDisabled\"\n                                  [ariaControls]=\"mobileTextData.ariaControls\"\n                                  [ariaCurrent]=\"mobileTextData.ariaCurrent\"\n                                  [ariaLive]=\"mobileTextData.ariaLive\"\n                                  [ariaExpanded]=\"mobileTextData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"mobileTextData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"mobileTextData.ariaHasPopup\"\n                                  [tabindex]=\"mobileTextData.tabindex\">\n              </desy-mobile-text>\n\n            </div>\n\n            <ng-content select=\"desy-header-navigation\"></ng-content>\n            <desy-header-navigation *ngIf=\"!navigationComponent && navigationData && navigationData.items && navigationData.items.length > 0\"\n                                    [idPrefix]=\"'header-nav-item'\"\n                                    [classes]=\"navigationData.classes\"\n                                    [items]=\"navigationData.items\"\n                                    [ariaLabel]=\"'Men\u00FA principal'\"></desy-header-navigation>\n          </div>\n\n          <ng-container *desyCustomInnerContent=\"{ component: customNavigationComponent, html: customNavigationHtml }\"></ng-container>\n\n          <ng-content select=\"desy-header-dropdown\"></ng-content>\n          <ng-container *ngIf=\"!dropdownComponent && dropdownData && dropdownData.items && dropdownData.items.length > 0\">\n            <desy-header-dropdown [classes]=\"dropdownData.classes\"\n                                  [hiddenText]=\"dropdownData.hiddenText\"\n                                  [classesContainer]=\"dropdownData.classesContainer\"\n                                  [classesTooltip]=\"dropdownData.classesTooltip\"\n                                  [role]=\"dropdownData.role\"\n                                  [ariaLabel]=\"dropdownData.ariaLabel\"\n                                  [ariaDescribedBy]=\"dropdownData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"dropdownData.ariaLabelledBy\"\n                                  [ariaHidden]=\"dropdownData.ariaHidden\"\n                                  [ariaDisabled]=\"dropdownData.ariaDisabled\"\n                                  [ariaControls]=\"dropdownData.ariaControls\"\n                                  [ariaCurrent]=\"dropdownData.ariaCurrent\"\n                                  [ariaLive]=\"dropdownData.ariaLive\"\n                                  [ariaExpanded]=\"dropdownData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"dropdownData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"dropdownData.ariaHasPopup\"\n                                  [tabindex]=\"dropdownData.tabindex\">\n              <ng-container *desyCustomInnerContent=\"{ html: dropdownData.html, text: dropdownData.text }\"></ng-container>\n              <desy-nav [hasNav]=\"true\"\n                        [idPrefix]=\"'header-dropdown-nav-item'\"\n                        [classes]=\"'w-max max-w-64'\"\n                        [items]=\"dropdownData.items\"\n                        [id]=\"'id-dropdown-nav'\"\n                        [ariaLabel]=\"'Men\u00FA de usuario'\"></desy-nav>\n            </desy-header-dropdown>\n          </ng-container>\n\n          <ng-content select=\"desy-header-offcanvas\"></ng-content>\n          <ng-container *ngIf=\"!offcanvasComponent && offcanvasData\">\n            <desy-header-offcanvas [classes]=\"offcanvasData.classes\">\n              <desy-header-offcanvas-button>\n                <ng-container *desyCustomInnerContent=\"{ html: offcanvasData.html, text: offcanvasData.text }\"></ng-container>\n              </desy-header-offcanvas-button>\n              <desy-header-offcanvas-close-button>{{ offcanvasData.textClose }}</desy-header-offcanvas-close-button>\n              <desy-content>\n                <ng-container *desyCustomInnerContent=\"{ template: offcanvasData.contentHtml }\"></ng-container>\n              </desy-content>\n            </desy-header-offcanvas>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n" }]
+            args: [{ selector: 'desy-header', template: "<header [ngClass]=\"classes\"\n        [desyAppAccessibility]=\"this\">\n  <div [ngClass]=\"containerClasses\">\n    <nav [attr.aria-labelledby]=\"skiplinkComponent && skiplinkComponent.id ? skiplinkComponent.id : 'skip-link'\">\n      <ng-content *ngIf=\"skiplinkComponent\" select=\"desy-skip-link\"></ng-content>        \n        <desy-skip-link *ngIf=\"!skiplinkComponent\" [id]=\"'skip-link'\"><ng-container *desyCustomInnerContent=\"{ html: skipLinkData && skipLinkData.html ? skipLinkData.html : '', text: skipLinkData && skipLinkData.text ? skipLinkData.text : 'Saltar al contenido principal' }\"></ng-container></desy-skip-link>\n    </nav>\n    <div class=\"bg-neutral-lighter border-b border-neutral-base\">\n      <div class=\"container mx-auto px-base\">\n        <div class=\"flex items-center justify-between min-h-14\">\n          <div class=\"flex flex-wrap items-center\">\n            <div class=\"flex items-center\">\n              <a *ngIf=\"homepageRouterLink || !homepageUrl\" [routerLink]=\"homepageRouterLink\" [fragment]=\"homepageFragment\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n              <a *ngIf=\"!homepageRouterLink && homepageUrl\" [href]=\"homepageUrl | externalHref\" class=\"flex flex-wrap mr-4 text-black focus:outline-none focus:shadow-outline-black\" title=\"Ir a la p\u00E1gina de inicio\">\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 144 32\" width=\"144\" height=\"32\" [ngClass]=\"{'sm:block': expandedLogo}\" class=\"fill-current hidden\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-expanded\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h31.509v31.495H0z\"/></clipPath><clipPath id=\"a-logo-expanded\"><path d=\"M0 0h144v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-expanded)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .205h31.509V31.7H0z\"/><g clip-path=\"url(#b-logo-expanded)\" transform=\"translate(0 .205)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.509 6.048-7.568 1.515a14.545 14.545 0 0 1-7.905-1.025 15.04 15.04 0 0 0-5-1.817 12.536 12.536 0 0 0-3.535-.011l-5.051.9c-.8.156-1.639.3-2.453.434V.315A7.1 7.1 0 0 1 3.888.226a9.926 9.926 0 0 1 2.085.936 17.6 17.6 0 0 0 4.293 1.962 13.92 13.92 0 0 0 6.6-.034l4.728-.858 4.939-.892 4.97-1.024ZM6.602 24.229a14.592 14.592 0 0 1 9.555 1.014 12.178 12.178 0 0 0 8.307 1.5l7.044-1.271v5.706a8.247 8.247 0 0 1-3.008.256 6.4 6.4 0 0 1-1.594-.457l-3.657-1.917a12.217 12.217 0 0 0-7.092-.825L1.026 31.011 0 31.177v-5.706l1.26-.256 3.312-.613c.669-.123 1.371-.245 2.029-.379ZM-.003 15.077v-4.391l13.027-2.377a15.5 15.5 0 0 1 9.11 1.638 12.535 12.535 0 0 0 8.474.925l.9-.189v4.391l-2.874-1.639a12.286 12.286 0 0 0-6.835-1.014l-8.006 1.46c-.959.179-2.877.524-2.877.524l-7.292 1.349a5.152 5.152 0 0 1-3.627-.677ZM31.509 16.583v4.324L18.6 23.282a15.5 15.5 0 0 1-9.11-1.638 12.532 12.532 0 0 0-8.474-.925l-1.015.19v-4.324l2.988 1.572a12.291 12.291 0 0 0 6.835 1.014l8.006-1.46c.959-.178 2.877-.524 2.877-.524l7.292-1.349a5.142 5.142 0 0 1 3.51.745Z\"/></g></g><path d=\"M38.2 28.807v-8.551h1.393c2.893 0 4.478 1.522 4.478 4.286 0 2.829-1.521 4.265-4.5 4.265Zm10.4-11.4v14.294h9.47v-2.893h-6.277v-3.257h6.214v-2.893h-6.214v-2.379h6.277v-2.871Zm21.751 0-5.206 14.294h3.385l1.542-4.35h4.371l1.521 4.35h3.45L74.1 17.407Zm1.885 2.956-1.328 4.223h2.679Zm42.341 4.03h-3.192v4.5a4.206 4.206 0 0 1-1.371.193 4.251 4.251 0 0 1-4.242-4.5 4.443 4.443 0 0 1 4.735-4.65 7.481 7.481 0 0 1 4.071 1.243v-3.257a11.674 11.674 0 0 0-4.349-.857c-4.628 0-7.841 3.107-7.841 7.564 0 4.393 3.149 7.372 7.841 7.372a12.977 12.977 0 0 0 4.349-.75Zm16.132.129a7.424 7.424 0 1 0-7.391 7.436 7.122 7.122 0 0 0 7.393-7.436Zm-7.456-4.458c-2.4 0-4.006 1.822-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.627-4.501-4.048-4.501Zm8.689-2.657v14.294h3.257v-9.108l5.762 9.108h3.021V17.407h-3.256v8.889l-5.532-8.889ZM46.922 7.33h-3.193v4.5a4.335 4.335 0 0 1-5.613-4.307 4.443 4.443 0 0 1 4.735-4.65 7.487 7.487 0 0 1 4.071 1.243V.859a11.674 11.674 0 0 0-4.35-.858c-4.628 0-7.841 3.107-7.841 7.565 0 4.393 3.15 7.371 7.841 7.371a12.99 12.99 0 0 0 4.35-.75Zm16.116.128a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.396-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM64.107.344v14.293h5.914c3.15 0 4.992-1.565 4.992-4.243a3.717 3.717 0 0 0-2.978-3.728 3.133 3.133 0 0 0 1.95-2.936c.021-2.272-1.521-3.386-4.606-3.386Zm4.757 5.336c1.393 0 1.95-.386 1.95-1.35 0-.921-.536-1.264-2.057-1.264h-1.393V5.68Zm.429 6.043c1.585 0 2.271-.493 2.271-1.651 0-1.2-.707-1.671-2.4-1.671h-1.8v3.322ZM78.879.344h-3.192v14.293h3.192Zm1.39 0v14.293h9.47v-2.893h-6.278V8.487h6.214V5.594h-6.214V3.216h6.278V.345Zm50.463 7.114a7.424 7.424 0 1 0-7.392 7.436 7.122 7.122 0 0 0 7.395-7.436Zm-7.456-4.457c-2.4 0-4.006 1.821-4.006 4.5s1.65 4.5 4.071 4.5c2.4 0 3.985-1.8 3.985-4.5s-1.626-4.5-4.047-4.5ZM97.917 24.585l-1.35-4.223-1.328 4.223ZM83.249 31.7v-5.872h.407c2.057 0 2.271.214 3.642 3.75a7.159 7.159 0 0 0 .3.729l.278.664a6.4 6.4 0 0 0 .343.729h4.641l1.543-4.35h4.371l1.521 4.35h3.45l-5.314-14.294h-3.749L90.46 28.997c-.3-.622-.642-1.371-1.04-2.291a3.042 3.042 0 0 0-1.907-2.014 3.416 3.416 0 0 0 2.614-3.429c0-2.571-1.693-3.857-5.1-3.857H79.97V31.7Zm0-8.572h1.414c1.371 0 2.057-.493 2.057-1.521s-.622-1.478-2.014-1.478h-1.457Zm11.156-8.492V8.764h.407c2.057 0 2.271.214 3.642 3.75a6.982 6.982 0 0 0 .3.729l.278.665a6.37 6.37 0 0 0 .342.729h6.432l.018-9.169 5.745 9.169h3.021V.344h-3.256l.014 8.769-5.542-8.769h-3.257v13.3a29.76 29.76 0 0 1-1.975-4 3.043 3.043 0 0 0-1.907-2.014 3.415 3.415 0 0 0 2.614-3.428c0-2.572-1.693-3.857-5.1-3.857h-5.054v14.293Zm0-8.572h1.412c1.371 0 2.056-.493 2.056-1.521s-.621-1.478-2.013-1.478h-1.457Zm-59.44 11.342V31.7h4.778c4.842 0 7.692-2.657 7.692-7.158 0-4.479-2.914-7.136-7.863-7.136Z\" fill=\"#161615\" fill-rule=\"evenodd\"/></g></svg>\n                <svg *ngIf=\"!noLogo\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" [ngClass]=\"{'sm:hidden': expandedLogo}\" class=\"w-8 h-8 fill-current\" aria-label=\"Ir a la p\u00E1gina de inicio de la aplicaci\u00F3n\" role=\"img\"><defs><clipPath id=\"b-logo-mini\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 0h32v32.001H0z\"/></clipPath><clipPath id=\"a-logo-mini\"><path d=\"M0 0h32v32H0z\"/></clipPath></defs><g clip-path=\"url(#a-logo-mini)\"><path fill=\"rgb(252, 228, 0)\" d=\"M0 .305h32v32.001H0z\"/><g clip-path=\"url(#b-logo-mini)\" transform=\"translate(0 .305)\"><g fill=\"#dd171b\" fill-rule=\"evenodd\"><path d=\"m31.997 6.145-7.686 1.539a14.764 14.764 0 0 1-8.028-1.042 15.267 15.267 0 0 0-5.073-1.846 12.725 12.725 0 0 0-3.59-.011l-5.13.918a94.41 94.41 0 0 1-2.491.442V.324a7.213 7.213 0 0 1 3.952-.09 10.087 10.087 0 0 1 2.118.951 17.859 17.859 0 0 0 4.36 1.993 14.13 14.13 0 0 0 6.7-.034l4.8-.872 5.016-.906 5.048-1.04ZM6.705 24.619a14.812 14.812 0 0 1 9.7 1.03 12.363 12.363 0 0 0 8.437 1.529l7.154-1.291v5.8a8.37 8.37 0 0 1-3.055.26 6.509 6.509 0 0 1-1.619-.464l-3.714-1.948a12.4 12.4 0 0 0-7.2-.838l-15.366 2.82L0 31.686v-5.8l1.28-.26 3.363-.623c.679-.125 1.393-.249 2.061-.385ZM-.003 15.32v-4.462l13.23-2.417a15.734 15.734 0 0 1 9.252 1.665 12.723 12.723 0 0 0 8.606.94l.914-.192v4.462L29.08 13.65a12.472 12.472 0 0 0-6.941-1.031l-8.131 1.483c-.974.182-2.921.532-2.921.532l-7.406 1.371a5.23 5.23 0 0 1-3.684-.685ZM31.997 16.851v4.393l-13.11 2.413a15.735 15.735 0 0 1-9.252-1.665 12.721 12.721 0 0 0-8.606-.94l-1.03.193v-4.394l3.035 1.6a12.476 12.476 0 0 0 6.941 1.03l8.13-1.483c.974-.182 2.922-.532 2.922-.532l7.406-1.371a5.219 5.219 0 0 1 3.564.756Z\"/></g></g></g></svg>\n                <ng-container *desyCustomInnerContent=\"{ html: customLogoHtml ? customLogoHtml : null}\"></ng-container>\n              </a>\n\n              <ng-content select=\"desy-header-subnav\"></ng-content>\n              <desy-header-subnav *ngIf=\"!subnavComponent && subnavData && (subnavData.text || subnavData.html)\"\n                                  [classes]=\"subnavData.classes\"\n                                  [hiddenText]=\"subnavData.hiddenText\"\n                                  [classesContainer]=\"subnavData.classesContainer\"\n                                  [classesTooltip]=\"subnavData.classesTooltip\"\n                                  [role]=\"subnavData.role\"\n                                  [ariaLabel]=\"subnavData.ariaLabel\"\n                                  [ariaDescribedBy]=\"subnavData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"subnavData.ariaLabelledBy\"\n                                  [ariaHidden]=\"subnavData.ariaHidden\"\n                                  [ariaDisabled]=\"subnavData.ariaDisabled\"\n                                  [ariaControls]=\"subnavData.ariaControls\"\n                                  [ariaCurrent]=\"subnavData.ariaCurrent\"\n                                  [ariaLive]=\"subnavData.ariaLive\"\n                                  [ariaExpanded]=\"subnavData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"subnavData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"subnavData.ariaHasPopup\"\n                                  [tabindex]=\"subnavData.tabindex\">\n                <ng-container *desyCustomInnerContent=\"{ html: subnavData.html, text: subnavData.text }\"></ng-container>\n                <desy-nav *ngIf=\"subnavData && subnavData.items && subnavData.items.length > 0\"\n                          [hasNav]=\"true\"\n                          [idPrefix]=\"'header-subnav-nav-item'\"\n                          [classes]=\"'w-max max-w-64'\"\n                          [items]=\"subnavData.items\"\n                          [id]=\"'id-subnav-nav'\"\n                          [ariaLabel]=\"'Aplicaciones'\"></desy-nav>\n              </desy-header-subnav>\n\n              <ng-content select=\"desy-mobile-text\"></ng-content>\n              <desy-mobile-text *ngIf=\"!mobileTextComponent && mobileTextData && (mobileTextData.text || mobileTextData.html)\"\n                                  [classes]=\"mobileTextData.classes\"\n                                  [text]=\"mobileTextData.text\"\n                                  [html]=\"mobileTextData.html\"\n                                  [role]=\"mobileTextData.role\"\n                                  [ariaLabel]=\"mobileTextData.ariaLabel\"\n                                  [ariaDescribedBy]=\"mobileTextData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"mobileTextData.ariaLabelledBy\"\n                                  [ariaHidden]=\"mobileTextData.ariaHidden\"\n                                  [ariaDisabled]=\"mobileTextData.ariaDisabled\"\n                                  [ariaControls]=\"mobileTextData.ariaControls\"\n                                  [ariaCurrent]=\"mobileTextData.ariaCurrent\"\n                                  [ariaLive]=\"mobileTextData.ariaLive\"\n                                  [ariaExpanded]=\"mobileTextData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"mobileTextData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"mobileTextData.ariaHasPopup\"\n                                  [tabindex]=\"mobileTextData.tabindex\">\n              </desy-mobile-text>\n\n            </div>\n\n            <ng-content select=\"desy-header-navigation\"></ng-content>\n            <desy-header-navigation *ngIf=\"!navigationComponent && navigationData && navigationData.items && navigationData.items.length > 0\"\n                                    [idPrefix]=\"'header-nav-item'\"\n                                    [classes]=\"navigationData.classes\"\n                                    [items]=\"navigationData.items\"\n                                    [ariaLabel]=\"'Men\u00FA principal'\"></desy-header-navigation>\n          </div>\n\n          <ng-container *desyCustomInnerContent=\"{ component: customNavigationComponent, html: customNavigationHtml }\"></ng-container>\n\n          <ng-content select=\"desy-header-dropdown\"></ng-content>\n          <ng-container *ngIf=\"!dropdownComponent && dropdownData && dropdownData.items && dropdownData.items.length > 0\">\n            <desy-header-dropdown [classes]=\"dropdownData.classes\"\n                                  [hiddenText]=\"dropdownData.hiddenText\"\n                                  [classesContainer]=\"dropdownData.classesContainer\"\n                                  [classesTooltip]=\"dropdownData.classesTooltip\"\n                                  [role]=\"dropdownData.role\"\n                                  [ariaLabel]=\"dropdownData.ariaLabel\"\n                                  [ariaDescribedBy]=\"dropdownData.ariaDescribedBy\"\n                                  [ariaLabelledBy]=\"dropdownData.ariaLabelledBy\"\n                                  [ariaHidden]=\"dropdownData.ariaHidden\"\n                                  [ariaDisabled]=\"dropdownData.ariaDisabled\"\n                                  [ariaControls]=\"dropdownData.ariaControls\"\n                                  [ariaCurrent]=\"dropdownData.ariaCurrent\"\n                                  [ariaLive]=\"dropdownData.ariaLive\"\n                                  [ariaExpanded]=\"dropdownData.ariaExpanded\"\n                                  [ariaErrorMessage]=\"dropdownData.ariaErrorMessage\"\n                                  [ariaHasPopup]=\"dropdownData.ariaHasPopup\"\n                                  [tabindex]=\"dropdownData.tabindex\">\n              <ng-container *desyCustomInnerContent=\"{ html: dropdownData.html, text: dropdownData.text }\"></ng-container>\n              <desy-nav [hasNav]=\"true\"\n                        [idPrefix]=\"'header-dropdown-nav-item'\"\n                        [classes]=\"'w-max max-w-64'\"\n                        [items]=\"dropdownData.items\"\n                        [id]=\"'id-dropdown-nav'\"\n                        [ariaLabel]=\"'Men\u00FA de usuario'\"></desy-nav>\n            </desy-header-dropdown>\n          </ng-container>\n\n          <ng-content select=\"desy-header-offcanvas\"></ng-content>\n          <ng-container *ngIf=\"!offcanvasComponent && offcanvasData\">\n            <desy-header-offcanvas [classes]=\"offcanvasData.classes\">\n              <desy-header-offcanvas-button>\n                <ng-container *desyCustomInnerContent=\"{ html: offcanvasData.html, text: offcanvasData.text }\"></ng-container>\n              </desy-header-offcanvas-button>\n              <desy-header-offcanvas-close-button>{{ offcanvasData.textClose }}</desy-header-offcanvas-close-button>\n              <desy-content>\n                <ng-container *desyCustomInnerContent=\"{ template: offcanvasData.contentHtml }\"></ng-container>\n              </desy-content>\n            </desy-header-offcanvas>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n" }]
         }], propDecorators: { classes: [{
                 type: Input
             }], containerClasses: [{
@@ -7469,6 +7673,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 args: [HeaderOffcanvasComponent]
             }] } });
 
+class LinksListIconRightComponent extends ContentBaseComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListIconRightComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinksListIconRightComponent, selector: "desy-links-icon-right", inputs: { type: "type", containerClasses: "containerClasses" }, usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n    <ng-content></ng-content>\n</ng-template>" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListIconRightComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'desy-links-icon-right', template: "<ng-template #contentTemplate>\n    <ng-content></ng-content>\n</ng-template>" }]
+        }], propDecorators: { type: [{
+                type: Input
+            }], containerClasses: [{
+                type: Input
+            }] } });
+
 class LinksListItemSubComponent extends ContentBaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListItemSubComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinksListItemSubComponent, selector: "desy-links-list-item-sub", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n" }); }
@@ -7482,7 +7699,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 class LinksListItemComponent extends ContentBaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinksListItemComponent, selector: "desy-links-list-item", inputs: { containerClasses: "containerClasses", classes: "classes", titleModal: "titleModal", id: "id", href: "href", routerLink: "routerLink", routerLinkActiveClasses: "routerLinkActiveClasses", target: "target", fragment: "fragment", active: "active", disabled: "disabled" }, queries: [{ propertyName: "icon", first: true, predicate: IconComponent, descendants: true }, { propertyName: "sub", first: true, predicate: LinksListItemSubComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n    <ng-content></ng-content>\n</ng-template>\n  " }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinksListItemComponent, selector: "desy-links-list-item", inputs: { containerClasses: "containerClasses", classes: "classes", titleModal: "titleModal", id: "id", href: "href", routerLink: "routerLink", routerLinkActiveClasses: "routerLinkActiveClasses", target: "target", fragment: "fragment", active: "active", disabled: "disabled" }, queries: [{ propertyName: "icon", first: true, predicate: IconComponent, descendants: true }, { propertyName: "iconRight", first: true, predicate: LinksListIconRightComponent, descendants: true }, { propertyName: "sub", first: true, predicate: LinksListItemSubComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #contentTemplate>\n    <ng-content></ng-content>\n</ng-template>\n  " }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListItemComponent, decorators: [{
             type: Component,
@@ -7512,6 +7729,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             }], icon: [{
                 type: ContentChild,
                 args: [IconComponent]
+            }], iconRight: [{
+                type: ContentChild,
+                args: [LinksListIconRightComponent]
             }], sub: [{
                 type: ContentChild,
                 args: [LinksListItemSubComponent]
@@ -7534,15 +7754,17 @@ class LinksListComponent extends AccessibilityComponent {
         return id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinksListComponent, selector: "desy-links-list", inputs: { hasNav: "hasNav", classes: "classes", idPrefix: "idPrefix" }, queries: [{ propertyName: "items", predicate: LinksListItemComponent }], usesInheritance: true, ngImport: i0, template: "\n<ng-template #innerHtml>\n    <ul *ngIf=\"items\">\n        <li *ngFor=\"let item of items; index as i\" [class]=\"item.containerClasses ? item.containerClasses : 'px-base border-y border-neutral-base -my-px'\">\n            <ng-template #itemContent>\n                <div class=\"flex gap-base justify-between items-center flex-1\">\n                    <div *ngIf=\"item.icon\" [class]=\"item.icon.containerClasses ? item.icon.containerClasses : 'self-center h-full'\">\n                      <ng-container *ngTemplateOutlet=\"item.icon.getContent()\"></ng-container>\n                    </div>\n                  <div class=\"flex-1\">\n                      <strong class=\"font-bold\" *ngIf=\"item.active; else item.getContent()\">\n                          <ng-container *ngTemplateOutlet=\"item.getContent()\"></ng-container>\n                      </strong>\n                  </div>\n                </div>\n            </ng-template>\n\n            <a *ngIf=\"item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [href]=\"item.href | externalHref\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n\n                <!-- arrow -->\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n            </a>\n\n            <a *ngIf=\"!item.href && item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [routerLink]=\"item.routerLink\" \n                  [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n                  [fragment]=\"item.fragment\" \n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n\n                <!-- arrow -->\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n            </a>\n\n            <div *ngIf=\"!item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none': '', item.active ? 'font-bold': ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </div>\n            <div *ngIf=\"item.sub\" [id]=\"'sub-' + getItemId(item, i)\" [class]=\"item.sub.classes ? item.sub.classes : 'c-paragraph-base text-neutral-dark -mt-base mr-lg'\">\n              <ng-container *ngTemplateOutlet=\"item.sub.getContent()\"></ng-container>\n            </div>\n        </li>\n      </ul>\n</ng-template>\n\n<div *ngIf=\"!hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</div>\n<nav *ngIf=\"hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinksListComponent, selector: "desy-links-list", inputs: { hasNav: "hasNav", classes: "classes", listClasses: "listClasses", idPrefix: "idPrefix" }, queries: [{ propertyName: "items", predicate: LinksListItemComponent }], usesInheritance: true, ngImport: i0, template: "\n<ng-template #innerHtml>\n    <ul *ngIf=\"items\" [ngClass]=\"listClasses ? listClasses : 'divide-y divide-neutral-base'\">\n        <li *ngFor=\"let item of items; index as i\" [class]=\"item.containerClasses ? item.containerClasses : 'px-base relative'\">\n            <ng-template #itemContent>\n                <div class=\"flex gap-base justify-between items-center flex-1\">\n                    <div *ngIf=\"item.icon\" [class]=\"item.icon.containerClasses ? item.icon.containerClasses : 'self-center h-full'\">\n                      <ng-container *ngTemplateOutlet=\"item.icon.getContent()\"></ng-container>\n                    </div>\n                  <div class=\"flex-1\">\n                      <strong class=\"font-bold\" *ngIf=\"item.active; else item.getContent()\">\n                          <ng-container *ngTemplateOutlet=\"item.getContent()\"></ng-container>\n                      </strong>\n                  </div>\n                </div>\n\n                <ng-container *ngIf=\"item.iconRight\">\n                  <div *ngIf=\"item.iconRight.type=='arrow'\" [ngClass]=\"item.iconRight.containerClasses ? item.iconRight.containerClasses : 'self-center h-full'\">\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n                  </div>\n                  <div *ngIf=\"item.iconRight.type=='chevron'\" [ngClass]=\"item.iconRight.containerClasses ? item.iconRight.containerClasses : 'self-center h-full'\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 14 14\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><g><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M3.4685 0.427C3.8512 0.0443 4.4717 0.0443 4.8545 0.427L10.388 5.9606C10.962 6.5346 10.962 7.4654 10.388 8.0395L4.8545 13.573C4.4717 13.9557 3.8512 13.9557 3.4685 13.573C3.0858 13.1903 3.0858 12.5698 3.4685 12.1871L8.6556 7L3.4685 1.813C3.0858 1.4303 3.0858 0.8098 3.4685 0.427Z\" clip-rule=\"evenodd\" stroke-width=\"1\"></path></g></svg>\n                  </div>\n                  <ng-container *ngIf=\"item.iconRight.type=='none'\"></ng-container>\n                  <div *ngIf=\"!item.iconRight.type\" [ngClass]=\"item.iconRight.containerClasses ? item.iconRight.containerClasses : 'self-center h-full'\">\n                   <ng-container *ngTemplateOutlet=\"item.iconRight.getContent()\"></ng-container>\n                  </div>\n                </ng-container>\n                <div *ngIf=\"!item.iconRight\" class=\"self-center h-full\">\n                  <!-- arrow -->\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n                </div>\n            </ng-template>\n\n            <a *ngIf=\"item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [href]=\"item.href | externalHref\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </a>\n\n            <a *ngIf=\"!item.href && item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [routerLink]=\"item.routerLink\" \n                  [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n                  [fragment]=\"item.fragment\" \n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </a>\n\n            <div *ngIf=\"!item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none': '', item.active ? 'font-bold': ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </div>\n            <div *ngIf=\"item.sub\" [id]=\"'sub-' + getItemId(item, i)\" [class]=\"item.sub.classes ? item.sub.classes : 'c-paragraph-base text-neutral-dark -mt-base mr-lg'\">\n              <ng-container *ngTemplateOutlet=\"item.sub.getContent()\"></ng-container>\n            </div>\n        </li>\n      </ul>\n</ng-template>\n\n<div *ngIf=\"!hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</div>\n<nav *ngIf=\"hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinksListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-links-list', template: "\n<ng-template #innerHtml>\n    <ul *ngIf=\"items\">\n        <li *ngFor=\"let item of items; index as i\" [class]=\"item.containerClasses ? item.containerClasses : 'px-base border-y border-neutral-base -my-px'\">\n            <ng-template #itemContent>\n                <div class=\"flex gap-base justify-between items-center flex-1\">\n                    <div *ngIf=\"item.icon\" [class]=\"item.icon.containerClasses ? item.icon.containerClasses : 'self-center h-full'\">\n                      <ng-container *ngTemplateOutlet=\"item.icon.getContent()\"></ng-container>\n                    </div>\n                  <div class=\"flex-1\">\n                      <strong class=\"font-bold\" *ngIf=\"item.active; else item.getContent()\">\n                          <ng-container *ngTemplateOutlet=\"item.getContent()\"></ng-container>\n                      </strong>\n                  </div>\n                </div>\n            </ng-template>\n\n            <a *ngIf=\"item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [href]=\"item.href | externalHref\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n\n                <!-- arrow -->\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n            </a>\n\n            <a *ngIf=\"!item.href && item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [routerLink]=\"item.routerLink\" \n                  [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n                  [fragment]=\"item.fragment\" \n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n\n                <!-- arrow -->\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n            </a>\n\n            <div *ngIf=\"!item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none': '', item.active ? 'font-bold': ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </div>\n            <div *ngIf=\"item.sub\" [id]=\"'sub-' + getItemId(item, i)\" [class]=\"item.sub.classes ? item.sub.classes : 'c-paragraph-base text-neutral-dark -mt-base mr-lg'\">\n              <ng-container *ngTemplateOutlet=\"item.sub.getContent()\"></ng-container>\n            </div>\n        </li>\n      </ul>\n</ng-template>\n\n<div *ngIf=\"!hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</div>\n<nav *ngIf=\"hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</nav>\n" }]
+            args: [{ selector: 'desy-links-list', template: "\n<ng-template #innerHtml>\n    <ul *ngIf=\"items\" [ngClass]=\"listClasses ? listClasses : 'divide-y divide-neutral-base'\">\n        <li *ngFor=\"let item of items; index as i\" [class]=\"item.containerClasses ? item.containerClasses : 'px-base relative'\">\n            <ng-template #itemContent>\n                <div class=\"flex gap-base justify-between items-center flex-1\">\n                    <div *ngIf=\"item.icon\" [class]=\"item.icon.containerClasses ? item.icon.containerClasses : 'self-center h-full'\">\n                      <ng-container *ngTemplateOutlet=\"item.icon.getContent()\"></ng-container>\n                    </div>\n                  <div class=\"flex-1\">\n                      <strong class=\"font-bold\" *ngIf=\"item.active; else item.getContent()\">\n                          <ng-container *ngTemplateOutlet=\"item.getContent()\"></ng-container>\n                      </strong>\n                  </div>\n                </div>\n\n                <ng-container *ngIf=\"item.iconRight\">\n                  <div *ngIf=\"item.iconRight.type=='arrow'\" [ngClass]=\"item.iconRight.containerClasses ? item.iconRight.containerClasses : 'self-center h-full'\">\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n                  </div>\n                  <div *ngIf=\"item.iconRight.type=='chevron'\" [ngClass]=\"item.iconRight.containerClasses ? item.iconRight.containerClasses : 'self-center h-full'\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 14 14\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><g><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M3.4685 0.427C3.8512 0.0443 4.4717 0.0443 4.8545 0.427L10.388 5.9606C10.962 6.5346 10.962 7.4654 10.388 8.0395L4.8545 13.573C4.4717 13.9557 3.8512 13.9557 3.4685 13.573C3.0858 13.1903 3.0858 12.5698 3.4685 12.1871L8.6556 7L3.4685 1.813C3.0858 1.4303 3.0858 0.8098 3.4685 0.427Z\" clip-rule=\"evenodd\" stroke-width=\"1\"></path></g></svg>\n                  </div>\n                  <ng-container *ngIf=\"item.iconRight.type=='none'\"></ng-container>\n                  <div *ngIf=\"!item.iconRight.type\" [ngClass]=\"item.iconRight.containerClasses ? item.iconRight.containerClasses : 'self-center h-full'\">\n                   <ng-container *ngTemplateOutlet=\"item.iconRight.getContent()\"></ng-container>\n                  </div>\n                </ng-container>\n                <div *ngIf=\"!item.iconRight\" class=\"self-center h-full\">\n                  <!-- arrow -->\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"self-center\" aria-hidden=\"true\" focusable=\"false\" width=\"1em\" height=\"1em\"><path d=\"M102.07 27.93l35 35a10 10 0 010 14.14l-35 35a10 10 0 01-14.14-14.14l13.66-13.66A2.5 2.5 0 0099.82 80H10a10 10 0 010-20h89.82a2.5 2.5 0 001.77-4.27L87.93 42.07a10 10 0 0114.14-14.14z\" fill=\"currentColor\"></path></svg>\n                </div>\n            </ng-template>\n\n            <a *ngIf=\"item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [href]=\"item.href | externalHref\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </a>\n\n            <a *ngIf=\"!item.href && item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [routerLink]=\"item.routerLink\" \n                  [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n                  [fragment]=\"item.fragment\" \n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ 'c-link', item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none' : '', item.active ? 'font-bold' : ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </a>\n\n            <div *ngIf=\"!item.href && !item.routerLink\" [id]=\"getItemId(item, i)\"\n                  [attr.current-page]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\n                  [attr.tabindex]=\"item.disabled ? '-1' : item.tabindex || null\"\n                  [attr.target]=\"item.target ? item.target : null\"\n                  [desyAppAccessibility]=\"item\"\n                  [class]=\"[ item.classes ? item.classes : 'flex justify-between items-center gap-base flex-1 py-base', item.disabled ? 'text-neutral-base no-underline pointer-events-none': '', item.active ? 'font-bold': ''] | makeHtmlList\">\n                <ng-container *ngTemplateOutlet=\"itemContent\"></ng-container>\n            </div>\n            <div *ngIf=\"item.sub\" [id]=\"'sub-' + getItemId(item, i)\" [class]=\"item.sub.classes ? item.sub.classes : 'c-paragraph-base text-neutral-dark -mt-base mr-lg'\">\n              <ng-container *ngTemplateOutlet=\"item.sub.getContent()\"></ng-container>\n            </div>\n        </li>\n      </ul>\n</ng-template>\n\n<div *ngIf=\"!hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</div>\n<nav *ngIf=\"hasNav\" [class]=\"classes\"\n    [desyAppAccessibility]=\"this\">\n  <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\n</nav>\n" }]
         }], propDecorators: { hasNav: [{
                 type: Input
             }], classes: [{
                 type: Input
+            }], listClasses: [{
+                type: Input
             }], idPrefix: [{
                 type: Input
             }], items: [{
@@ -7635,11 +7857,11 @@ class MenuHorizontalComponent extends AccessibilityComponent {
         return id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MenuHorizontalComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MenuHorizontalComponent, selector: "desy-menu-horizontal", inputs: { id: "id", idPrefix: "idPrefix", classes: "classes", items: "items" }, outputs: { clickEvent: "clickEvent" }, queries: [{ propertyName: "itemComponents", predicate: MenuHorizontalItemComponent }], usesInheritance: true, ngImport: i0, template: "<!-- menu-horizontal -->\n<nav [class]=\"['c-menu-horizontal', classes] | makeHtmlList\"\n     [attr.id]=\"id ? id : null\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"c-menu-horizontal__list lg:flex lg:flex-wrap\">\n    <ng-container *ngFor=\"let item of getItemList(); index as i\">\n      <li *ngIf=\"item\">\n          <a *ngIf=\"item.routerLink && !item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [routerLink]=\"item.routerLink\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [fragment]=\"item.fragment\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center py-sm lg:px-lg lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n          <a *ngIf=\"!item.routerLink && item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [href]=\"item.href | externalHref\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center py-sm lg:px-lg lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n<!-- /menu-horizontal -->\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MenuHorizontalComponent, selector: "desy-menu-horizontal", inputs: { id: "id", idPrefix: "idPrefix", classes: "classes", items: "items" }, outputs: { clickEvent: "clickEvent" }, queries: [{ propertyName: "itemComponents", predicate: MenuHorizontalItemComponent }], usesInheritance: true, ngImport: i0, template: "<!-- menu-horizontal -->\n<nav [class]=\"['c-menu-horizontal', classes] | makeHtmlList\"\n     [attr.id]=\"id ? id : null\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"c-menu-horizontal__list lg:flex lg:flex-wrap\">\n    <ng-container *ngFor=\"let item of getItemList(); index as i\">\n      <li *ngIf=\"item\">\n          <a *ngIf=\"item.routerLink && !item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [routerLink]=\"item.routerLink\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [fragment]=\"item.fragment\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center px-base py-sm lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"flex items-center pointer-events-none font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n          <a *ngIf=\"!item.routerLink && item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [href]=\"item.href | externalHref\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center px-base py-sm lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"flex items-center pointer-events-none font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n<!-- /menu-horizontal -->\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MenuHorizontalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-menu-horizontal', template: "<!-- menu-horizontal -->\n<nav [class]=\"['c-menu-horizontal', classes] | makeHtmlList\"\n     [attr.id]=\"id ? id : null\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"c-menu-horizontal__list lg:flex lg:flex-wrap\">\n    <ng-container *ngFor=\"let item of getItemList(); index as i\">\n      <li *ngIf=\"item\">\n          <a *ngIf=\"item.routerLink && !item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [routerLink]=\"item.routerLink\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [fragment]=\"item.fragment\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center py-sm lg:px-lg lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n          <a *ngIf=\"!item.routerLink && item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [href]=\"item.href | externalHref\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center py-sm lg:px-lg lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n<!-- /menu-horizontal -->\n" }]
+            args: [{ selector: 'desy-menu-horizontal', template: "<!-- menu-horizontal -->\n<nav [class]=\"['c-menu-horizontal', classes] | makeHtmlList\"\n     [attr.id]=\"id ? id : null\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"c-menu-horizontal__list lg:flex lg:flex-wrap\">\n    <ng-container *ngFor=\"let item of getItemList(); index as i\">\n      <li *ngIf=\"item\">\n          <a *ngIf=\"item.routerLink && !item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [routerLink]=\"item.routerLink\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [fragment]=\"item.fragment\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center px-base py-sm lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"flex items-center pointer-events-none font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n          <a *ngIf=\"!item.routerLink && item.href\" (click)=\"onClick($event, item)\"\n             [attr.id]=\"getItemId(item, i)\"\n             [href]=\"item.href | externalHref\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [class]=\"['c-menu-horizontal__link relative flex items-center px-base py-sm lg:py-base border border-transparent text-black hover:text-primary-base underline truncate focus:outline-none', item.classes] | makeHtmlList\"\n             [ngClass]=\"{'no-underline pointer-events-none': item.disabled, 'c-menu-horizontal__active': item.active}\"\n             [attr.disabled]=\"item.disabled ? 'disabled' : null\"\n             [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\n             [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\n             [desyAppAccessibility]=\"item\">\n             <strong *ngIf=\"item.active\" class=\"flex items-center pointer-events-none font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </strong>\n             <span *ngIf=\"!item.active\" class=\"flex items-center pointer-events-none\">\n               <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n             </span>\n          </a>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n<!-- /menu-horizontal -->\n" }]
         }], propDecorators: { id: [{
                 type: Input
             }], idPrefix: [{
@@ -7825,7 +8047,7 @@ class MenuVerticalComponent extends AccessibilityComponent {
         return subItems && subItems.length > 0 ? subItems : null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MenuVerticalComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MenuVerticalComponent, selector: "desy-menu-vertical", inputs: { id: "id", idPrefix: "idPrefix", items: "items", hasUnderline: "hasUnderline", classes: "classes" }, queries: [{ propertyName: "itemComponents", predicate: MenuVerticalItemComponent }], usesInheritance: true, ngImport: i0, template: "<!--\n  Template para ser utilizado tanto por los items como por los subitems:\n  - item: Item que representa\n  - index: indice del item en la lista\n  - id: identificador del item\n  - isRoot: si pertenece al nivel raiz\n-->\n<ng-template #itemTemplate let-item=\"item\" let-index=\"index\" let-id=\"id\" let-sub=\"sub\" let-isRoot=\"isRoot\">\n  <ng-template #noActiveTemplate><ng-container  *desyCustomInnerContent=\"{component: item, html: getItemHtml(item), text: item.text }\"></ng-container></ng-template>\n  <ng-container *ngIf=\"item\">\n    <li class=\"m-base\" [ngClass]=\"{'origin-top-left text-sm': !isRoot}\">\n      <ng-container *ngIf=\"item.href || item.routerLink; else notHref\">\n        <a *ngIf=\"item.href; else hasRouterLink\" [attr.id]=\"id\"\n           [href]=\"item.href | externalHref\"\n           [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n           [ngClass]=\"{\n            'underline': hasUnderline,\n            'hover:text-primary-base hover:underline': !item.disabled,\n            'no-underline pointer-events-none': item.disabled\n           }\"\n           [attr.tabindex]=\"item.disabled ? -1 : null\"\n           [attr.target]=\"item.target ? item.target : null\"\n           [attr.aria-current]=\"item.active ? 'page' : null\"\n           [attr.aria-disabled]=\"item.disabled\"\n           [desyAppAccessibility]=\"item\"\n           [attr.disabled]=\"item.disabled\">\n           <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n            <strong class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n           </strong>\n          </ng-container>\n        </a>\n        <ng-template #hasRouterLink>\n          <!-- Todos los enlaces que admiten o href o routerLink estar\u00EDa bien unificarlos (en todos los componentes).\n                Para ello, ser\u00EDa necesario crear una directiva para a\u00F1adir o quitar la directiva routerLink si no tiene href.\n                Sin embargo, esto no es posible actualmente, ya que Angular todav\u00EDa no permite a\u00F1adir directivas din\u00E1micamente:\n                https://angular.io/guide/roadmap#support-adding-directives-to-host-elements -->\n          <a [attr.id]=\"id\"\n             [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment ? item.fragment : null\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{\n              'underline': hasUnderline,\n              'hover:text-primary-base hover:underline': !item.disabled,\n              'no-underline pointer-events-none': item.disabled\n             }\"\n             [attr.tabindex]=\"item.disabled ? -1 : null\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [attr.aria-current]=\"item.active ? 'page' : null\"\n             [attr.aria-disabled]=\"item.disabled\"\n             [desyAppAccessibility]=\"item\"\n             [attr.disabled]=\"item.disabled\">\n             <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n              <strong class=\"font-bold\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n             </strong>\n            </ng-container>\n          </a>\n        </ng-template>\n      </ng-container>\n      <ng-template #notHref>\n            <span [attr.id]=\"id\"\n                  [class]=\"['block px-xs', item.classes] | makeHtmlList\"\n                  [attr.tabindex]=\"item.disabled ? -1 : null\"\n                  [attr.aria-current]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled\"\n                  [desyAppAccessibility]=\"item\"\n                  [attr.disabled]=\"item.disabled\">\n                  <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n                    <strong class=\"font-bold\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n                    </strong>\n                  </ng-container>\n                </span>\n      </ng-template>\n      <ng-container *ngIf=\"isRoot && sub\">\n        <ul *ngIf=\"getSubItems(sub)\" [ngClass]=\"sub.classes\"\n            [desyAppAccessibility]=\"sub\">\n          <ng-container *ngFor=\"let subItem of getSubItems(sub); index as subIndex\">\n            <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                          [ngTemplateOutletContext]=\"{\n                           item: subItem,\n                           id: getSubItemId(item, index, subIndex),\n                           index: subIndex,\n                           isRoot: false\n                          }\">\n            </ng-container>\n          </ng-container>\n        </ul>\n        <div *ngIf=\"!getSubItems(sub)\"\n             [class]=\"['mb-base px-xs origin-top-left text-sm text-neutral-dark', sub.classes] | makeHtmlList\"\n             [id]=\"'sub-' + id\">\n          <ng-container *desyCustomInnerContent=\"{ component: sub, html: sub.html }\"></ng-container>\n        </div>\n      </ng-container>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n      <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n<nav [ngClass]=\"classes\"\n     [attr.role]=\"(role ? role : null)\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"text-base\">\n    <ng-container *ngFor=\"let item of getItems(); index as index\">\n      <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                    [ngTemplateOutletContext]=\"{  item: item, id: getId(item, index), index: index, sub: getItemSub(item), isRoot: true }\">\n      </ng-container>\n    </ng-container>\n  </ul>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MenuVerticalComponent, selector: "desy-menu-vertical", inputs: { id: "id", idPrefix: "idPrefix", items: "items", hasUnderline: "hasUnderline", classes: "classes" }, queries: [{ propertyName: "itemComponents", predicate: MenuVerticalItemComponent }], usesInheritance: true, ngImport: i0, template: "<!--\n  Template para ser utilizado tanto por los items como por los subitems:\n  - item: Item que representa\n  - index: indice del item en la lista\n  - id: identificador del item\n  - isRoot: si pertenece al nivel raiz\n-->\n<ng-template #itemTemplate let-item=\"item\" let-index=\"index\" let-id=\"id\" let-sub=\"sub\" let-isRoot=\"isRoot\">\n  <ng-template #noActiveTemplate><ng-container  *desyCustomInnerContent=\"{component: item, html: getItemHtml(item), text: item.text }\"></ng-container></ng-template>\n  <ng-container *ngIf=\"item\">\n    <li class=\"my-base break-inside-avoid-column\" [ngClass]=\"{'origin-top-left text-sm': !isRoot}\">\n      <ng-container *ngIf=\"item.href || item.routerLink; else notHref\">\n        <a *ngIf=\"item.href; else hasRouterLink\" [attr.id]=\"id\"\n           [href]=\"item.href | externalHref\"\n           [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n           [ngClass]=\"{\n            'underline': hasUnderline,\n            'hover:text-primary-base hover:underline': !item.disabled,\n            'no-underline pointer-events-none': item.disabled\n           }\"\n           [attr.tabindex]=\"item.disabled ? -1 : null\"\n           [attr.target]=\"item.target ? item.target : null\"\n           [attr.aria-current]=\"item.active ? 'page' : null\"\n           [attr.aria-disabled]=\"item.disabled\"\n           [desyAppAccessibility]=\"item\"\n           [attr.disabled]=\"item.disabled\">\n           <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n            <strong class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n           </strong>\n          </ng-container>\n        </a>\n        <ng-template #hasRouterLink>\n          <!-- Todos los enlaces que admiten o href o routerLink estar\u00EDa bien unificarlos (en todos los componentes).\n                Para ello, ser\u00EDa necesario crear una directiva para a\u00F1adir o quitar la directiva routerLink si no tiene href.\n                Sin embargo, esto no es posible actualmente, ya que Angular todav\u00EDa no permite a\u00F1adir directivas din\u00E1micamente:\n                https://angular.io/guide/roadmap#support-adding-directives-to-host-elements -->\n          <a [attr.id]=\"id\"\n             [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment ? item.fragment : null\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{\n              'underline': hasUnderline,\n              'hover:text-primary-base hover:underline': !item.disabled,\n              'no-underline pointer-events-none': item.disabled\n             }\"\n             [attr.tabindex]=\"item.disabled ? -1 : null\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [attr.aria-current]=\"item.active ? 'page' : null\"\n             [attr.aria-disabled]=\"item.disabled\"\n             [desyAppAccessibility]=\"item\"\n             [attr.disabled]=\"item.disabled\">\n             <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n              <strong class=\"font-bold\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n             </strong>\n            </ng-container>\n          </a>\n        </ng-template>\n      </ng-container>\n      <ng-template #notHref>\n            <span [attr.id]=\"id\"\n                  [class]=\"['block px-xs', item.classes] | makeHtmlList\"\n                  [attr.tabindex]=\"item.disabled ? -1 : null\"\n                  [attr.aria-current]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled\"\n                  [desyAppAccessibility]=\"item\"\n                  [attr.disabled]=\"item.disabled\">\n                  <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n                    <strong class=\"font-bold\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n                    </strong>\n                  </ng-container>\n                </span>\n      </ng-template>\n      <ng-container *ngIf=\"isRoot && sub\">\n        <ul *ngIf=\"getSubItems(sub)\" [ngClass]=\"sub.classes\"\n            [desyAppAccessibility]=\"sub\">\n          <ng-container *ngFor=\"let subItem of getSubItems(sub); index as subIndex\">\n            <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                          [ngTemplateOutletContext]=\"{\n                           item: subItem,\n                           id: getSubItemId(item, index, subIndex),\n                           index: subIndex,\n                           isRoot: false\n                          }\">\n            </ng-container>\n          </ng-container>\n        </ul>\n        <div *ngIf=\"!getSubItems(sub)\"\n             [class]=\"['mb-base px-xs origin-top-left text-sm text-neutral-dark', sub.classes] | makeHtmlList\"\n             [id]=\"'sub-' + id\">\n          <ng-container *desyCustomInnerContent=\"{ component: sub, html: sub.html }\"></ng-container>\n        </div>\n      </ng-container>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n      <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n<nav [ngClass]=\"classes\"\n     [attr.role]=\"(role ? role : null)\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"text-base\">\n    <ng-container *ngFor=\"let item of getItems(); index as index\">\n      <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                    [ngTemplateOutletContext]=\"{  item: item, id: getId(item, index), index: index, sub: getItemSub(item), isRoot: true }\">\n      </ng-container>\n    </ng-container>\n  </ul>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }], animations: [
             trigger('displayMenuVertical', [
                 state('void', style({
                     opacity: '0.0',
@@ -7857,7 +8079,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                                 animate('100ms ease-out')
                             ])
                         ])
-                    ], template: "<!--\n  Template para ser utilizado tanto por los items como por los subitems:\n  - item: Item que representa\n  - index: indice del item en la lista\n  - id: identificador del item\n  - isRoot: si pertenece al nivel raiz\n-->\n<ng-template #itemTemplate let-item=\"item\" let-index=\"index\" let-id=\"id\" let-sub=\"sub\" let-isRoot=\"isRoot\">\n  <ng-template #noActiveTemplate><ng-container  *desyCustomInnerContent=\"{component: item, html: getItemHtml(item), text: item.text }\"></ng-container></ng-template>\n  <ng-container *ngIf=\"item\">\n    <li class=\"m-base\" [ngClass]=\"{'origin-top-left text-sm': !isRoot}\">\n      <ng-container *ngIf=\"item.href || item.routerLink; else notHref\">\n        <a *ngIf=\"item.href; else hasRouterLink\" [attr.id]=\"id\"\n           [href]=\"item.href | externalHref\"\n           [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n           [ngClass]=\"{\n            'underline': hasUnderline,\n            'hover:text-primary-base hover:underline': !item.disabled,\n            'no-underline pointer-events-none': item.disabled\n           }\"\n           [attr.tabindex]=\"item.disabled ? -1 : null\"\n           [attr.target]=\"item.target ? item.target : null\"\n           [attr.aria-current]=\"item.active ? 'page' : null\"\n           [attr.aria-disabled]=\"item.disabled\"\n           [desyAppAccessibility]=\"item\"\n           [attr.disabled]=\"item.disabled\">\n           <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n            <strong class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n           </strong>\n          </ng-container>\n        </a>\n        <ng-template #hasRouterLink>\n          <!-- Todos los enlaces que admiten o href o routerLink estar\u00EDa bien unificarlos (en todos los componentes).\n                Para ello, ser\u00EDa necesario crear una directiva para a\u00F1adir o quitar la directiva routerLink si no tiene href.\n                Sin embargo, esto no es posible actualmente, ya que Angular todav\u00EDa no permite a\u00F1adir directivas din\u00E1micamente:\n                https://angular.io/guide/roadmap#support-adding-directives-to-host-elements -->\n          <a [attr.id]=\"id\"\n             [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment ? item.fragment : null\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{\n              'underline': hasUnderline,\n              'hover:text-primary-base hover:underline': !item.disabled,\n              'no-underline pointer-events-none': item.disabled\n             }\"\n             [attr.tabindex]=\"item.disabled ? -1 : null\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [attr.aria-current]=\"item.active ? 'page' : null\"\n             [attr.aria-disabled]=\"item.disabled\"\n             [desyAppAccessibility]=\"item\"\n             [attr.disabled]=\"item.disabled\">\n             <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n              <strong class=\"font-bold\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n             </strong>\n            </ng-container>\n          </a>\n        </ng-template>\n      </ng-container>\n      <ng-template #notHref>\n            <span [attr.id]=\"id\"\n                  [class]=\"['block px-xs', item.classes] | makeHtmlList\"\n                  [attr.tabindex]=\"item.disabled ? -1 : null\"\n                  [attr.aria-current]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled\"\n                  [desyAppAccessibility]=\"item\"\n                  [attr.disabled]=\"item.disabled\">\n                  <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n                    <strong class=\"font-bold\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n                    </strong>\n                  </ng-container>\n                </span>\n      </ng-template>\n      <ng-container *ngIf=\"isRoot && sub\">\n        <ul *ngIf=\"getSubItems(sub)\" [ngClass]=\"sub.classes\"\n            [desyAppAccessibility]=\"sub\">\n          <ng-container *ngFor=\"let subItem of getSubItems(sub); index as subIndex\">\n            <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                          [ngTemplateOutletContext]=\"{\n                           item: subItem,\n                           id: getSubItemId(item, index, subIndex),\n                           index: subIndex,\n                           isRoot: false\n                          }\">\n            </ng-container>\n          </ng-container>\n        </ul>\n        <div *ngIf=\"!getSubItems(sub)\"\n             [class]=\"['mb-base px-xs origin-top-left text-sm text-neutral-dark', sub.classes] | makeHtmlList\"\n             [id]=\"'sub-' + id\">\n          <ng-container *desyCustomInnerContent=\"{ component: sub, html: sub.html }\"></ng-container>\n        </div>\n      </ng-container>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n      <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n<nav [ngClass]=\"classes\"\n     [attr.role]=\"(role ? role : null)\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"text-base\">\n    <ng-container *ngFor=\"let item of getItems(); index as index\">\n      <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                    [ngTemplateOutletContext]=\"{  item: item, id: getId(item, index), index: index, sub: getItemSub(item), isRoot: true }\">\n      </ng-container>\n    </ng-container>\n  </ul>\n</nav>\n" }]
+                    ], template: "<!--\n  Template para ser utilizado tanto por los items como por los subitems:\n  - item: Item que representa\n  - index: indice del item en la lista\n  - id: identificador del item\n  - isRoot: si pertenece al nivel raiz\n-->\n<ng-template #itemTemplate let-item=\"item\" let-index=\"index\" let-id=\"id\" let-sub=\"sub\" let-isRoot=\"isRoot\">\n  <ng-template #noActiveTemplate><ng-container  *desyCustomInnerContent=\"{component: item, html: getItemHtml(item), text: item.text }\"></ng-container></ng-template>\n  <ng-container *ngIf=\"item\">\n    <li class=\"my-base break-inside-avoid-column\" [ngClass]=\"{'origin-top-left text-sm': !isRoot}\">\n      <ng-container *ngIf=\"item.href || item.routerLink; else notHref\">\n        <a *ngIf=\"item.href; else hasRouterLink\" [attr.id]=\"id\"\n           [href]=\"item.href | externalHref\"\n           [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n           [ngClass]=\"{\n            'underline': hasUnderline,\n            'hover:text-primary-base hover:underline': !item.disabled,\n            'no-underline pointer-events-none': item.disabled\n           }\"\n           [attr.tabindex]=\"item.disabled ? -1 : null\"\n           [attr.target]=\"item.target ? item.target : null\"\n           [attr.aria-current]=\"item.active ? 'page' : null\"\n           [attr.aria-disabled]=\"item.disabled\"\n           [desyAppAccessibility]=\"item\"\n           [attr.disabled]=\"item.disabled\">\n           <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n            <strong class=\"font-bold\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n           </strong>\n          </ng-container>\n        </a>\n        <ng-template #hasRouterLink>\n          <!-- Todos los enlaces que admiten o href o routerLink estar\u00EDa bien unificarlos (en todos los componentes).\n                Para ello, ser\u00EDa necesario crear una directiva para a\u00F1adir o quitar la directiva routerLink si no tiene href.\n                Sin embargo, esto no es posible actualmente, ya que Angular todav\u00EDa no permite a\u00F1adir directivas din\u00E1micamente:\n                https://angular.io/guide/roadmap#support-adding-directives-to-host-elements -->\n          <a [attr.id]=\"id\"\n             [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment ? item.fragment : null\"\n             [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n             [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\n             [ngClass]=\"{\n              'underline': hasUnderline,\n              'hover:text-primary-base hover:underline': !item.disabled,\n              'no-underline pointer-events-none': item.disabled\n             }\"\n             [attr.tabindex]=\"item.disabled ? -1 : null\"\n             [attr.target]=\"item.target ? item.target : null\"\n             [attr.aria-current]=\"item.active ? 'page' : null\"\n             [attr.aria-disabled]=\"item.disabled\"\n             [desyAppAccessibility]=\"item\"\n             [attr.disabled]=\"item.disabled\">\n             <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n              <strong class=\"font-bold\">\n                <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n             </strong>\n            </ng-container>\n          </a>\n        </ng-template>\n      </ng-container>\n      <ng-template #notHref>\n            <span [attr.id]=\"id\"\n                  [class]=\"['block px-xs', item.classes] | makeHtmlList\"\n                  [attr.tabindex]=\"item.disabled ? -1 : null\"\n                  [attr.aria-current]=\"item.active ? 'page' : null\"\n                  [attr.aria-disabled]=\"item.disabled\"\n                  [desyAppAccessibility]=\"item\"\n                  [attr.disabled]=\"item.disabled\">\n                  <ng-container *ngIf=\"item.active; else noActiveTemplate\">\n                    <strong class=\"font-bold\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\n                    </strong>\n                  </ng-container>\n                </span>\n      </ng-template>\n      <ng-container *ngIf=\"isRoot && sub\">\n        <ul *ngIf=\"getSubItems(sub)\" [ngClass]=\"sub.classes\"\n            [desyAppAccessibility]=\"sub\">\n          <ng-container *ngFor=\"let subItem of getSubItems(sub); index as subIndex\">\n            <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                          [ngTemplateOutletContext]=\"{\n                           item: subItem,\n                           id: getSubItemId(item, index, subIndex),\n                           index: subIndex,\n                           isRoot: false\n                          }\">\n            </ng-container>\n          </ng-container>\n        </ul>\n        <div *ngIf=\"!getSubItems(sub)\"\n             [class]=\"['mb-base px-xs origin-top-left text-sm text-neutral-dark', sub.classes] | makeHtmlList\"\n             [id]=\"'sub-' + id\">\n          <ng-container *desyCustomInnerContent=\"{ component: sub, html: sub.html }\"></ng-container>\n        </div>\n      </ng-container>\n    </li>\n    <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\n      <div class=\"sr-only\">Separador</div>\n    </li>\n  </ng-container>\n</ng-template>\n\n<nav [ngClass]=\"classes\"\n     [attr.role]=\"(role ? role : null)\"\n     [desyAppAccessibility]=\"this\">\n  <ul class=\"text-base\">\n    <ng-container *ngFor=\"let item of getItems(); index as index\">\n      <ng-container [ngTemplateOutlet]=\"itemTemplate\"\n                    [ngTemplateOutletContext]=\"{  item: item, id: getId(item, index), index: index, sub: getItemSub(item), isRoot: true }\">\n      </ng-container>\n    </ng-container>\n  </ul>\n</nav>\n" }]
         }], propDecorators: { id: [{
                 type: Input
             }], idPrefix: [{
@@ -9021,7 +9243,7 @@ class NotificationComponent extends AccessibilityComponent {
         return this.itemCompontents && this.itemCompontents.length > 0 ? this.itemCompontents.toArray() : this.items;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NotificationComponent, selector: "desy-notification", inputs: { id: "id", classes: "classes", isOpen: "isOpen", titleNotification: "titleNotification", description: "description", content: "content", items: "items", icon: "icon", type: "type", isDismissible: "isDismissible", headingLevel: "headingLevel" }, outputs: { isOpenChange: "isOpenChange" }, queries: [{ propertyName: "titleComponent", predicate: TitleComponent }, { propertyName: "descriptionComponent", predicate: DescriptionComponent }, { propertyName: "contentComponent", predicate: ContentComponent }, { propertyName: "iconComponent", predicate: IconComponent }, { propertyName: "itemCompontents", predicate: NotificationItemComponent }], usesInheritance: true, ngImport: i0, template: "<div [attr.id]=\"id ? id : null\" [class]=\"(classes ? 'c-notification ' + classes : type==='success' ? 'c-notification c-notification--success' : type==='alert' ? 'c-notification c-notification--alert' : 'c-notification c-notification--primary') \"\n     *ngIf=\"isOpen && !isDismissing\"\n     @displayNotification\n     [desyAppAccessibility]=\"this\">\n  <div *ngIf=\"iconComponent || icon || type\" class=\"h-full mr-base\">\n    <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon ? icon.html : null }\"></ng-container>\n    <ng-container *ngIf=\"type && !iconComponent && !icon\">\n      <ng-container [ngSwitch]=\"getType()\">\n        <svg *ngSwitchCase=\"'success'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-success-dark\" aria-label=\"\u00C9xito\" focusable=\"false\" role=\"img\"><path d=\"M39.94 125a19.88 19.88 0 01-15.53-7.81L2.48 92.26a10 10 0 0115-13.2l20.55 23.39a2.5 2.5 0 003.68.08l81-84.42a10.002 10.002 0 1114.5 13.78l-82.02 86.33A19.41 19.41 0 0139.94 125z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'alert'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-alert-base\" aria-label=\"Error\" focusable=\"false\" role=\"img\"><path d=\"M138.42 118.29l-55-110a15 15 0 00-26.84 0l-55 110A15 15 0 0015 140h110a15 15 0 0013.42-21.71zM62.5 50a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 70a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'info'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-primary-base\" aria-label=\"Informaci\u00F3n\" focusable=\"false\" role=\"img\"><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zm7.5 105a7.5 7.5 0 01-15 0V70a7.5 7.5 0 0115 0zM70 50a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n      </ng-container>\n    </ng-container>\n  </div>\n  <div class=\"lg:flex flex-1 self-center\">\n    <div class=\"lg:flex-1 lg:self-center\">\n      <ng-container *ngIf=\"titleComponent || titleNotification\" [ngSwitch]=\"headingLevel\">\n        <h1 *ngSwitchCase=\"1\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h1>\n        <h2 *ngSwitchCase=\"2\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h2>\n        <h3 *ngSwitchCase=\"3\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h3>\n        <h4 *ngSwitchCase=\"4\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h4>\n        <h5 *ngSwitchCase=\"5\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h5>\n        <p *ngSwitchDefault [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n           [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </p>\n      </ng-container>\n      <ng-container *ngIf=\"descriptionComponent || description\">\n        <p [class]=\"descriptionComponent ? descriptionComponent.classes : description.classes\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: descriptionComponent,\n            html: description ? description.html : null,\n            text: description ? description.text : null\n          }\"></ng-container>\n        </p>\n      </ng-container>\n      <ul *ngIf=\"(itemCompontents && itemCompontents.length > 0) || items\">\n        <ng-container *ngFor=\"let item of getItems(); index as i\">\n          <li *ngIf=\"item.routerLink || item.href\">\n            <a *ngIf=\"item.routerLink\" class=\"c-link\"\n               [routerLink]=\"item.routerLink\"\n               [fragment]=\"item.fragment\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n            <a *ngIf=\"!item.routerLink && item.href\" class=\"c-link\"\n               [href]=\"item.href | externalHref\"\n               [target]=\"item.target\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n          </li>\n          <li *ngIf=\"!item.routerLink && !item.href\">\n            <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n          </li>\n        </ng-container>\n      </ul>\n      <p *ngIf=\"contentComponent || content\" [class]=\"['text-sm', contentComponent ? contentComponent.classes : content.classes] | makeHtmlList\">\n        <ng-container *desyCustomInnerContent=\"{\n          component: contentComponent,\n          html: content ? content.html : null,\n          text: content ? content.text : null\n        }\"></ng-container>\n      </p>\n    </div>\n    <ng-container *ngIf=\"isDismissible\">\n      <div class=\"absolute top-0 right-0 p-sm\">\n        <button (click)=\"dismiss()\" class=\"p-sm focus:bg-warning-base focus:border-warning-base focus:shadow-outline-black focus:text-black focus:outline-none\" aria-label=\"X: Cerrar notificaci\u00F3n\" type=\"button\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-4 h-4 pointer-events-none\" aria-hidden=\"true\" role=\"presentation\"><path d=\"M85.91 71.77a2.5 2.5 0 010-3.54l46.16-46.16a10 10 0 10-14.14-14.14L71.77 54.09a2.5 2.5 0 01-3.54 0L22.07 7.93A10 10 0 007.93 22.07l46.16 46.16a2.5 2.5 0 010 3.54L7.93 117.93a10 10 0 0014.14 14.14l46.16-46.16a2.5 2.5 0 013.54 0l46.16 46.16a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n        </button>\n      </div>\n    </ng-container>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NotificationComponent, selector: "desy-notification", inputs: { id: "id", classes: "classes", isOpen: "isOpen", titleNotification: "titleNotification", description: "description", content: "content", items: "items", icon: "icon", type: "type", isDismissible: "isDismissible", headingLevel: "headingLevel" }, outputs: { isOpenChange: "isOpenChange" }, queries: [{ propertyName: "titleComponent", predicate: TitleComponent }, { propertyName: "descriptionComponent", predicate: DescriptionComponent }, { propertyName: "contentComponent", predicate: ContentComponent }, { propertyName: "iconComponent", predicate: IconComponent }, { propertyName: "itemCompontents", predicate: NotificationItemComponent }], usesInheritance: true, ngImport: i0, template: "<div [attr.id]=\"id ? id : null\" [class]=\"(classes ? 'c-notification ' + classes : type==='success' ? 'c-notification c-notification--success' : type==='alert' ? 'c-notification c-notification--alert' : 'c-notification c-notification--primary') \"\n     *ngIf=\"isOpen && !isDismissing\"\n     @displayNotification\n     [desyAppAccessibility]=\"this\">\n  <div *ngIf=\"iconComponent || icon || type\" class=\"h-full mr-base\">\n    <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon ? icon.html : null }\"></ng-container>\n    <ng-container *ngIf=\"type && !iconComponent && !icon\">\n      <ng-container [ngSwitch]=\"getType()\">\n        <svg *ngSwitchCase=\"'success'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-success-dark\" aria-label=\"\u00C9xito\" focusable=\"false\" role=\"img\"><path d=\"M39.94 125a19.88 19.88 0 01-15.53-7.81L2.48 92.26a10 10 0 0115-13.2l20.55 23.39a2.5 2.5 0 003.68.08l81-84.42a10.002 10.002 0 1114.5 13.78l-82.02 86.33A19.41 19.41 0 0139.94 125z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'alert'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-alert-base\" aria-label=\"Error\" focusable=\"false\" role=\"img\"><path d=\"M138.42 118.29l-55-110a15 15 0 00-26.84 0l-55 110A15 15 0 0015 140h110a15 15 0 0013.42-21.71zM62.5 50a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 70a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'info'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-primary-base\" aria-label=\"Informaci\u00F3n\" focusable=\"false\" role=\"img\"><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zm7.5 105a7.5 7.5 0 01-15 0V70a7.5 7.5 0 0115 0zM70 50a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n      </ng-container>\n    </ng-container>\n  </div>\n  <div class=\"lg:flex flex-1 self-center\">\n    <div class=\"lg:flex-1 lg:self-center\">\n      <ng-container *ngIf=\"titleComponent || titleNotification\" [ngSwitch]=\"headingLevel\">\n        <h1 *ngSwitchCase=\"1\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h1>\n        <h2 *ngSwitchCase=\"2\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h2>\n        <h3 *ngSwitchCase=\"3\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h3>\n        <h4 *ngSwitchCase=\"4\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h4>\n        <h5 *ngSwitchCase=\"5\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h5>\n        <p *ngSwitchDefault [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n           [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </p>\n      </ng-container>\n      <div *ngIf=\"descriptionComponent || description && description.html\" [ngClass]=\"descriptionComponent?.classes || description?.classes\">\n        <ng-container *desyCustomInnerContent=\"{\n          component: descriptionComponent,\n          html: description ? description.html : null\n        }\"></ng-container>\n      </div>\n      <p *ngIf=\"description && description.text && !description.html && !descriptionComponent\" [ngClass]=\"description?.classes\">\n        <ng-container *desyCustomInnerContent=\"{\n          text: description ? description.text : null\n        }\"></ng-container>\n      </p>\n      <ul *ngIf=\"(itemCompontents && itemCompontents.length > 0) || items\">\n        <ng-container *ngFor=\"let item of getItems(); index as i\">\n          <li *ngIf=\"item.routerLink || item.href\">\n            <a *ngIf=\"item.routerLink\" class=\"c-link\"\n               [routerLink]=\"item.routerLink\"\n               [fragment]=\"item.fragment\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n            <a *ngIf=\"!item.routerLink && item.href\" class=\"c-link\"\n               [href]=\"item.href | externalHref\"\n               [target]=\"item.target\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n          </li>\n          <li *ngIf=\"!item.routerLink && !item.href\">\n            <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n          </li>\n        </ng-container>\n      </ul>\n      <div *ngIf=\"contentComponent || content && content.html\" [ngClass]=\"contentComponent?.classes || content?.classes || 'text-sm'\">\n        <ng-container *desyCustomInnerContent=\"{\n          component: contentComponent,\n          html: content ? content.html : null\n        }\"></ng-container>\n      </div>\n      <p *ngIf=\"content && content.text && !content.html && !contentComponent\" [ngClass]=\"content?.classes || 'text-sm'\">\n        <ng-container *desyCustomInnerContent=\"{\n          text: content ? content.text : null\n        }\"></ng-container>\n      </p>\n    </div>\n    <ng-container *ngIf=\"isDismissible\">\n      <div class=\"absolute top-0 right-0 p-sm\">\n        <button (click)=\"dismiss()\" class=\"p-sm focus:bg-warning-base focus:border-warning-base focus:shadow-outline-black focus:text-black focus:outline-none\" aria-label=\"X: Cerrar notificaci\u00F3n\" type=\"button\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-4 h-4 pointer-events-none\" aria-hidden=\"true\" role=\"presentation\"><path d=\"M85.91 71.77a2.5 2.5 0 010-3.54l46.16-46.16a10 10 0 10-14.14-14.14L71.77 54.09a2.5 2.5 0 01-3.54 0L22.07 7.93A10 10 0 007.93 22.07l46.16 46.16a2.5 2.5 0 010 3.54L7.93 117.93a10 10 0 0014.14 14.14l46.16-46.16a2.5 2.5 0 013.54 0l46.16 46.16a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n        </button>\n      </div>\n    </ng-container>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }, { kind: "pipe", type: ExternalHrefPipe, name: "externalHref" }], animations: [
             trigger('displayNotification', [
                 state('void', style({
                     opacity: '0.0',
@@ -9071,7 +9293,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                                 animate('150ms ease-in')
                             ])
                         ])
-                    ], template: "<div [attr.id]=\"id ? id : null\" [class]=\"(classes ? 'c-notification ' + classes : type==='success' ? 'c-notification c-notification--success' : type==='alert' ? 'c-notification c-notification--alert' : 'c-notification c-notification--primary') \"\n     *ngIf=\"isOpen && !isDismissing\"\n     @displayNotification\n     [desyAppAccessibility]=\"this\">\n  <div *ngIf=\"iconComponent || icon || type\" class=\"h-full mr-base\">\n    <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon ? icon.html : null }\"></ng-container>\n    <ng-container *ngIf=\"type && !iconComponent && !icon\">\n      <ng-container [ngSwitch]=\"getType()\">\n        <svg *ngSwitchCase=\"'success'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-success-dark\" aria-label=\"\u00C9xito\" focusable=\"false\" role=\"img\"><path d=\"M39.94 125a19.88 19.88 0 01-15.53-7.81L2.48 92.26a10 10 0 0115-13.2l20.55 23.39a2.5 2.5 0 003.68.08l81-84.42a10.002 10.002 0 1114.5 13.78l-82.02 86.33A19.41 19.41 0 0139.94 125z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'alert'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-alert-base\" aria-label=\"Error\" focusable=\"false\" role=\"img\"><path d=\"M138.42 118.29l-55-110a15 15 0 00-26.84 0l-55 110A15 15 0 0015 140h110a15 15 0 0013.42-21.71zM62.5 50a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 70a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'info'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-primary-base\" aria-label=\"Informaci\u00F3n\" focusable=\"false\" role=\"img\"><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zm7.5 105a7.5 7.5 0 01-15 0V70a7.5 7.5 0 0115 0zM70 50a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n      </ng-container>\n    </ng-container>\n  </div>\n  <div class=\"lg:flex flex-1 self-center\">\n    <div class=\"lg:flex-1 lg:self-center\">\n      <ng-container *ngIf=\"titleComponent || titleNotification\" [ngSwitch]=\"headingLevel\">\n        <h1 *ngSwitchCase=\"1\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h1>\n        <h2 *ngSwitchCase=\"2\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h2>\n        <h3 *ngSwitchCase=\"3\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h3>\n        <h4 *ngSwitchCase=\"4\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h4>\n        <h5 *ngSwitchCase=\"5\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h5>\n        <p *ngSwitchDefault [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n           [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </p>\n      </ng-container>\n      <ng-container *ngIf=\"descriptionComponent || description\">\n        <p [class]=\"descriptionComponent ? descriptionComponent.classes : description.classes\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: descriptionComponent,\n            html: description ? description.html : null,\n            text: description ? description.text : null\n          }\"></ng-container>\n        </p>\n      </ng-container>\n      <ul *ngIf=\"(itemCompontents && itemCompontents.length > 0) || items\">\n        <ng-container *ngFor=\"let item of getItems(); index as i\">\n          <li *ngIf=\"item.routerLink || item.href\">\n            <a *ngIf=\"item.routerLink\" class=\"c-link\"\n               [routerLink]=\"item.routerLink\"\n               [fragment]=\"item.fragment\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n            <a *ngIf=\"!item.routerLink && item.href\" class=\"c-link\"\n               [href]=\"item.href | externalHref\"\n               [target]=\"item.target\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n          </li>\n          <li *ngIf=\"!item.routerLink && !item.href\">\n            <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n          </li>\n        </ng-container>\n      </ul>\n      <p *ngIf=\"contentComponent || content\" [class]=\"['text-sm', contentComponent ? contentComponent.classes : content.classes] | makeHtmlList\">\n        <ng-container *desyCustomInnerContent=\"{\n          component: contentComponent,\n          html: content ? content.html : null,\n          text: content ? content.text : null\n        }\"></ng-container>\n      </p>\n    </div>\n    <ng-container *ngIf=\"isDismissible\">\n      <div class=\"absolute top-0 right-0 p-sm\">\n        <button (click)=\"dismiss()\" class=\"p-sm focus:bg-warning-base focus:border-warning-base focus:shadow-outline-black focus:text-black focus:outline-none\" aria-label=\"X: Cerrar notificaci\u00F3n\" type=\"button\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-4 h-4 pointer-events-none\" aria-hidden=\"true\" role=\"presentation\"><path d=\"M85.91 71.77a2.5 2.5 0 010-3.54l46.16-46.16a10 10 0 10-14.14-14.14L71.77 54.09a2.5 2.5 0 01-3.54 0L22.07 7.93A10 10 0 007.93 22.07l46.16 46.16a2.5 2.5 0 010 3.54L7.93 117.93a10 10 0 0014.14 14.14l46.16-46.16a2.5 2.5 0 013.54 0l46.16 46.16a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n        </button>\n      </div>\n    </ng-container>\n  </div>\n</div>\n" }]
+                    ], template: "<div [attr.id]=\"id ? id : null\" [class]=\"(classes ? 'c-notification ' + classes : type==='success' ? 'c-notification c-notification--success' : type==='alert' ? 'c-notification c-notification--alert' : 'c-notification c-notification--primary') \"\n     *ngIf=\"isOpen && !isDismissing\"\n     @displayNotification\n     [desyAppAccessibility]=\"this\">\n  <div *ngIf=\"iconComponent || icon || type\" class=\"h-full mr-base\">\n    <ng-container *desyCustomInnerContent=\"{ component: iconComponent, html: icon ? icon.html : null }\"></ng-container>\n    <ng-container *ngIf=\"type && !iconComponent && !icon\">\n      <ng-container [ngSwitch]=\"getType()\">\n        <svg *ngSwitchCase=\"'success'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-success-dark\" aria-label=\"\u00C9xito\" focusable=\"false\" role=\"img\"><path d=\"M39.94 125a19.88 19.88 0 01-15.53-7.81L2.48 92.26a10 10 0 0115-13.2l20.55 23.39a2.5 2.5 0 003.68.08l81-84.42a10.002 10.002 0 1114.5 13.78l-82.02 86.33A19.41 19.41 0 0139.94 125z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'alert'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-alert-base\" aria-label=\"Error\" focusable=\"false\" role=\"img\"><path d=\"M138.42 118.29l-55-110a15 15 0 00-26.84 0l-55 110A15 15 0 0015 140h110a15 15 0 0013.42-21.71zM62.5 50a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 70a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n        <svg *ngSwitchCase=\"'info'\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-5 h-5 text-primary-base\" aria-label=\"Informaci\u00F3n\" focusable=\"false\" role=\"img\"><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zm7.5 105a7.5 7.5 0 01-15 0V70a7.5 7.5 0 0115 0zM70 50a10 10 0 1110-10 10 10 0 01-10 10z\" fill=\"currentColor\"/></svg>\n      </ng-container>\n    </ng-container>\n  </div>\n  <div class=\"lg:flex flex-1 self-center\">\n    <div class=\"lg:flex-1 lg:self-center\">\n      <ng-container *ngIf=\"titleComponent || titleNotification\" [ngSwitch]=\"headingLevel\">\n        <h1 *ngSwitchCase=\"1\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h1>\n        <h2 *ngSwitchCase=\"2\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h2>\n        <h3 *ngSwitchCase=\"3\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h3>\n        <h4 *ngSwitchCase=\"4\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h4>\n        <h5 *ngSwitchCase=\"5\" [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n            [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </h5>\n        <p *ngSwitchDefault [id]=\"id ? id + '-titleNotification' : null\" tabindex=\"-1\"\n           [class]=\"['font-bold pr-base focus:outline-none focus:underline', titleComponent ? titleComponent.classes : titleNotification.classes] | makeHtmlList\">\n          <ng-container *desyCustomInnerContent=\"{\n            component: titleComponent,\n            html: titleNotification ? titleNotification.html : null,\n            text: titleNotification ? titleNotification.text : null\n          }\"></ng-container>\n        </p>\n      </ng-container>\n      <div *ngIf=\"descriptionComponent || description && description.html\" [ngClass]=\"descriptionComponent?.classes || description?.classes\">\n        <ng-container *desyCustomInnerContent=\"{\n          component: descriptionComponent,\n          html: description ? description.html : null\n        }\"></ng-container>\n      </div>\n      <p *ngIf=\"description && description.text && !description.html && !descriptionComponent\" [ngClass]=\"description?.classes\">\n        <ng-container *desyCustomInnerContent=\"{\n          text: description ? description.text : null\n        }\"></ng-container>\n      </p>\n      <ul *ngIf=\"(itemCompontents && itemCompontents.length > 0) || items\">\n        <ng-container *ngFor=\"let item of getItems(); index as i\">\n          <li *ngIf=\"item.routerLink || item.href\">\n            <a *ngIf=\"item.routerLink\" class=\"c-link\"\n               [routerLink]=\"item.routerLink\"\n               [fragment]=\"item.fragment\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n            <a *ngIf=\"!item.routerLink && item.href\" class=\"c-link\"\n               [href]=\"item.href | externalHref\"\n               [target]=\"item.target\"\n               [ngClass]=\"{'c-link--alert': type==='alert'}\"\n               [attr.id]=\"item.id ? item.id : null\"\n               [desyAppAccessibility]=\"item\">\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n            </a>\n          </li>\n          <li *ngIf=\"!item.routerLink && !item.href\">\n            <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\n          </li>\n        </ng-container>\n      </ul>\n      <div *ngIf=\"contentComponent || content && content.html\" [ngClass]=\"contentComponent?.classes || content?.classes || 'text-sm'\">\n        <ng-container *desyCustomInnerContent=\"{\n          component: contentComponent,\n          html: content ? content.html : null\n        }\"></ng-container>\n      </div>\n      <p *ngIf=\"content && content.text && !content.html && !contentComponent\" [ngClass]=\"content?.classes || 'text-sm'\">\n        <ng-container *desyCustomInnerContent=\"{\n          text: content ? content.text : null\n        }\"></ng-container>\n      </p>\n    </div>\n    <ng-container *ngIf=\"isDismissible\">\n      <div class=\"absolute top-0 right-0 p-sm\">\n        <button (click)=\"dismiss()\" class=\"p-sm focus:bg-warning-base focus:border-warning-base focus:shadow-outline-black focus:text-black focus:outline-none\" aria-label=\"X: Cerrar notificaci\u00F3n\" type=\"button\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" width=\"1em\" height=\"1em\" class=\"w-4 h-4 pointer-events-none\" aria-hidden=\"true\" role=\"presentation\"><path d=\"M85.91 71.77a2.5 2.5 0 010-3.54l46.16-46.16a10 10 0 10-14.14-14.14L71.77 54.09a2.5 2.5 0 01-3.54 0L22.07 7.93A10 10 0 007.93 22.07l46.16 46.16a2.5 2.5 0 010 3.54L7.93 117.93a10 10 0 0014.14 14.14l46.16-46.16a2.5 2.5 0 013.54 0l46.16 46.16a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n        </button>\n      </div>\n    </ng-container>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
                 type: Input
             }], classes: [{
@@ -9232,11 +9454,11 @@ class HeaderAdvancedSubComponent {
         this.sub = Type.Sub;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderAdvancedSubComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderAdvancedSubComponent, selector: "desy-header-advanced-sub", inputs: { classes: "classes", backgroundFullColor: "backgroundFullColor", backgroundFullUrl: "backgroundFullUrl", backgroundContainerUrl: "backgroundContainerUrl", logoUrl: "logoUrl", logoAlt: "logoAlt", logoHref: "logoHref", logoRouterLink: "logoRouterLink", logoRouterLinkActiveClasses: "logoRouterLinkActiveClasses", logoTarget: "logoTarget", logoFragment: "logoFragment", logoClasses: "logoClasses" }, ngImport: i0, template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes : 'h-32 bg-cover bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"sub\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HeaderAdvancedLogoComponent, selector: "desy-header-advanced-logo", inputs: ["url", "alt", "href", "fragment", "routerLink", "routerLinkActiveClasses", "target", "classes", "type"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderAdvancedSubComponent, selector: "desy-header-advanced-sub, desy-header-mini-sub", inputs: { classes: "classes", backgroundFullColor: "backgroundFullColor", backgroundFullUrl: "backgroundFullUrl", backgroundContainerUrl: "backgroundContainerUrl", logoUrl: "logoUrl", logoAlt: "logoAlt", logoHref: "logoHref", logoRouterLink: "logoRouterLink", logoRouterLinkActiveClasses: "logoRouterLinkActiveClasses", logoTarget: "logoTarget", logoFragment: "logoFragment", logoClasses: "logoClasses" }, ngImport: i0, template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes : 'h-32 bg-cover bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"sub\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HeaderAdvancedLogoComponent, selector: "desy-header-advanced-logo", inputs: ["url", "alt", "href", "fragment", "routerLink", "routerLinkActiveClasses", "target", "classes", "type"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderAdvancedSubComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-header-advanced-sub', template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes : 'h-32 bg-cover bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"sub\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>" }]
+            args: [{ selector: 'desy-header-advanced-sub, desy-header-mini-sub', template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes : 'h-32 bg-cover bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"sub\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>" }]
         }], propDecorators: { classes: [{
                 type: Input
             }], backgroundFullColor: [{
@@ -9279,11 +9501,11 @@ class HeaderAdvancedSuperComponent {
         this.super = Type.Super;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderAdvancedSuperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderAdvancedSuperComponent, selector: "desy-header-advanced-super", inputs: { classes: "classes", backgroundFullColor: "backgroundFullColor", backgroundFullUrl: "backgroundFullUrl", backgroundContainerUrl: "backgroundContainerUrl", logoUrl: "logoUrl", logoAlt: "logoAlt", logoHref: "logoHref", logoRouterLink: "logoRouterLink", logoRouterLinkActiveClasses: "logoRouterLinkActiveClasses", logoTarget: "logoTarget", logoFragment: "logoFragment", logoClasses: "logoClasses" }, ngImport: i0, template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes :'h-32 bg-cover bg-center bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"super\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HeaderAdvancedLogoComponent, selector: "desy-header-advanced-logo", inputs: ["url", "alt", "href", "fragment", "routerLink", "routerLinkActiveClasses", "target", "classes", "type"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderAdvancedSuperComponent, selector: "desy-header-advanced-super, desy-header-mini-super", inputs: { classes: "classes", backgroundFullColor: "backgroundFullColor", backgroundFullUrl: "backgroundFullUrl", backgroundContainerUrl: "backgroundContainerUrl", logoUrl: "logoUrl", logoAlt: "logoAlt", logoHref: "logoHref", logoRouterLink: "logoRouterLink", logoRouterLinkActiveClasses: "logoRouterLinkActiveClasses", logoTarget: "logoTarget", logoFragment: "logoFragment", logoClasses: "logoClasses" }, ngImport: i0, template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes :'h-32 bg-cover bg-center bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"super\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HeaderAdvancedLogoComponent, selector: "desy-header-advanced-logo", inputs: ["url", "alt", "href", "fragment", "routerLink", "routerLinkActiveClasses", "target", "classes", "type"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderAdvancedSuperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-header-advanced-super', template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes :'h-32 bg-cover bg-center bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"super\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>" }]
+            args: [{ selector: 'desy-header-advanced-super, desy-header-mini-super', template: "<ng-container *ngIf=\"!(classes||backgroundFullColor||backgroundFullUrl);else noContent\">\n  <ng-content></ng-content>\n</ng-container>\n<ng-template #noContent>\n  <div [ngClass]=\"classes ? classes :'h-32 bg-cover bg-center bg-no-repeat overflow-hidden'\"\n       [ngStyle]=\"{'background-color': backgroundFullColor, 'background-image': backgroundFullUrl ? 'url(' + backgroundFullUrl + ')' : ''}\">\n    <div class=\"container h-full mx-auto px-base\">\n      <div class=\"relative h-full bg-cover bg-no-repeat\"\n           [ngStyle]=\"{'background-image': backgroundContainerUrl ? 'url(' + backgroundContainerUrl + ')' : ''}\">\n        <desy-header-advanced-logo *ngIf=\"logoUrl\"\n                                   [url]=\"logoUrl\"\n                                   [alt]=\"logoAlt\"\n                                   [href]=\"logoHref\"\n                                   [routerLink]=\"logoRouterLink\"\n                                   [routerLinkActiveClasses]=\"logoRouterLinkActiveClasses\"\n                                   [target]=\"logoTarget\"\n                                   [fragment]=\"logoFragment\"\n                                   [classes]=\"logoClasses\"\n                                   [type]=\"super\" />\n        <ng-content select=\"desy-header-advanced-custom-navigation\"></ng-content>\n      </div>\n    </div>\n  </div>\n</ng-template>" }]
         }], propDecorators: { classes: [{
                 type: Input
             }], backgroundFullColor: [{
@@ -9985,11 +10207,11 @@ class MenuNavigationComponent extends AccessibilityComponent {
         return id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MenuNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MenuNavigationComponent, selector: "desy-menu-navigation", inputs: { idPrefix: "idPrefix", items: "items", classes: "classes", id: "id" }, outputs: { itemsChange: "itemsChange", activeItemChange: "activeItemChange", activeSubItemChange: "activeSubItemChange" }, host: { properties: { "class": "this.classes", "class.c-menu-navigation": "this.cfg", "attr.id": "this.id", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-labelledby": "this.ariaLabelledBy", "attr.aria-hidden": "this.ariaHidden", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-controls": "this.ariaControls", "attr.aria-current": "this.ariaCurrent", "attr.aria-live": "this.ariaLive", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-errormessage": "this.ariaErrorMessage", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-modal": "this.ariaModal", "attr.aria-checked": "this.ariaChecked", "attr.aria-pressed": "this.ariaPressed", "attr.aria-readonly": "this.ariaReadonly", "attr.aria-required": "this.ariaRequired", "attr.aria-selected": "this.ariaSelected", "attr.aria-valuemin": "this.ariaValuemin", "attr.aria-valuemax": "this.ariaValuemax", "attr.aria-valuenow": "this.ariaValuenow", "attr.aria-valuetext": "this.ariaValuetext", "attr.aria-orientation": "this.ariaOrientation", "attr.aria-level": "this.ariaLevel", "attr.aria-multiselectable": "this.ariaMultiselectable", "attr.aria-placeholder": "this.ariaPlaceholder", "attr.aria-posinset": "this.ariaPosinset", "attr.aria-setsize": "this.ariaSetsize", "attr.aria-sort": "this.ariaSort", "attr.aria-busy": "this.ariaBusy", "attr.aria-dropeffect": "this.ariaDropeffect", "attr.aria-grabbed": "this.ariaGrabbed", "attr.aria-activedescendant": "this.ariaActivedescendant", "attr.aria-atomic": "this.ariaAtomic", "attr.aria-autocomplete": "this.ariaAutocomplete", "attr.aria-braillelabel": "this.ariaBraillelabel", "attr.aria-brailleroledescription": "this.ariaBrailleroledescription", "attr.aria-colcount": "this.ariaColcount", "attr.aria-colindex": "this.ariaColindex", "attr.aria-colindextext": "this.ariaColindextext", "attr.aria-colspan": "this.ariaColspan", "attr.aria-description": "this.ariaDescription", "attr.aria-details": "this.ariaDetails", "attr.aria-flowto": "this.ariaFlowto", "attr.aria-invalid": "this.ariaInvalid", "attr.aria-keyshortcuts": "this.ariaKeyshortcuts", "attr.aria-owns": "this.ariaOwns", "attr.aria-relevant": "this.ariaRelevant", "attr.aria-roledescription": "this.ariaRoledescription", "attr.aria-rowcount": "this.ariaRowcount", "attr.aria-rowindex": "this.ariaRowindex", "attr.aria-rowindextext": "this.ariaRowindextext", "attr.aria-rowspan": "this.ariaRowspan", "attr.tabindex": "this.tabindex", "attr.title": "this.title", "attr.alt": "this.alt", "attr.lang": "this.lang", "attr.accesskey": "this.accesskey", "attr.autocomplete": "this.autocomplete", "attr.autofocus": "this.autofocus", "attr.contenteditable": "this.contenteditable", "attr.dir": "this.dir", "attr.draggable": "this.draggable", "attr.enterkeyhint": "this.enterkeyhint", "attr.hidden": "this.hidden", "attr.inputmode": "this.inputmode", "attr.spellcheck": "this.spellcheck", "attr.translate": "this.translate", "attr.aria-multiline": "this.ariaMultiline", "attr.for": "this.for", "attr.form": "this.form", "attr.headers": "this.headers", "attr.placeholder": "this.placeholder", "attr.readonly": "this.readonly", "attr.required": "this.required" } }, queries: [{ propertyName: "itemComponentList", predicate: MenuNavigationItemComponent }], viewQueries: [{ propertyName: "menunavigation", first: true, predicate: ["menunavigation"], descendants: true, read: ElementRef }, { propertyName: "menuItems", predicate: MenubaritemDirective, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ul #menunavigation [id]=\"id + '-menu-navigation'\" class=\"flex flex-wrap gap-base\"\n(focusin)=\"handleMenuFocusIn()\"\n(focusout)=\"handleMenuFocusOut($event)\"\n[ngClass]=\"{ 'focus': isFocused }\"\n[attr.aria-label]=\"ariaLabel ? ariaLabel : null\">\n<ng-container *ngFor=\"let item of getItems(); index as itemIndex\">\n<li class=\"relative\" desyMenubaritem (contentChanged)=\"checkChanges()\">\n  <a *ngIf=\"item.href\" #link\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [attr.role]=\"item.disabled ? link : null\"\n      [id]=\"getItemId(item, itemIndex)\"\n      [target]=\"item.target\"\n      [href]=\"item.href\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.title]=\"item.title ? item.title : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n      <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n          <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n      </span>          \n  </a>\n  <a *ngIf=\"!item.href && item.routerLink\" #link\n    (click)=\"handleMenuItemClick($event, itemIndex)\"\n     (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n     (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n     (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n     [attr.role]=\"item.disabled ? link : null\"\n     [id]=\"getItemId(item, itemIndex)\"\n     [target]=\"item.target\"\n     [routerLink]=\"item.routerLink\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n     [fragment]=\"item.fragment\"\n     [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n     [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n     [attr.disabled]=\"item.disabled ? item.disabled : null\"\n     [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n     [desyAppAccessibility]=\"item\"\n     [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n     [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n     <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n         <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n     </span>          \n  </a>\n  <button *ngIf=\"!item.href && !item.routerLink\" #link #itemContentWrapper\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.aria-expanded]=\"item.sub ? (!!(menuData && menuData[itemIndex].open) ?  true :  false) : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.aria-controls]=\"item.sub ? (item.ariaControls ?  item.ariaControls :  id + '-sub-list') : null\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n          <span *ngIf=\"item.active\" class=\"sr-only\">Item activo: </span>\n          <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n            </span>\n          <svg *ngIf=\"item.sub\" class=\"inline-block -mr-2  align-middle -my-px pointer-events-none\" viewBox=\"0 0 96 96\" aria-hidden=\"true\" fill=\"currentColor\" focusable=\"false\" width=\"1.5em\" height=\"1.5em\"><g><path d=\"M46.71 58.037a1.823 1.823 0 002.581 0L62.048 45.28a1.823 1.823 0 00-1.29-3.113H35.243a1.823 1.823 0 00-1.291 3.113z\"/></g></svg>\n  </button>        \n\n  <div *ngIf=\"item.sub && getItemSubitems(item)\" class=\"c-menu-navigation__sub absolute bottom-0 left-0\">\n      <ul  [id]=\"id + '-sub-list'\" [style]=\"menuData && menuData[itemIndex].open?'display:block':'display:none'\" #popupMenu role=\"menu\" tabindex=\"-1\"\n      [class]=\"item.sub.classes ? item.sub.classes : 'c-menu-navigation__tooltip w-max max-w-64 border border-neutral-base shadow-md bg-white text-sm'\"\n      [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : (item.sub.ariaLabel ? item.sub.ariaLabel : null)\"\n      [attr.aria-disabled]=\"item.sub.ariaDisabled ? item.sub.ariaDisabled : null\"\n      [desyAppAccessibility]=\"item.sub\">\n        <ng-container *ngFor=\"let subItem of getItemSubitems(item); index as subItemIndex\">\t\t\t\t\n            <li #popupMenuItem tabindex=\"-1\"\n                [id]=\"getSubItemId(subItem, subItemIndex, getItemId(item, itemIndex))\"\n                (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\">\n              <a *ngIf=\"subItem.href\" #itemContentWrapper\n                  [href]=\"subItem.href\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n              </a>\n              <a *ngIf=\"!subItem.href && subItem.routerLink\" #itemContentWrapper\n                  [routerLink]=\"subItem.routerLink\"\n                  [routerLinkActive]=\"subItem.routerLinkActiveClasses ? subItem.routerLinkActiveClasses : []\"\n                  [fragment]=\"subItem.fragment\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n            </a>\n            </li>\n            <li *ngIf=\"subItem.divider\" class=\"my-sm border-b border-neutral-base\">\n              <div class=\"sr-only\">Separador</div>\n          </li>\n        </ng-container>\n      </ul>\n  </div>\n</li>\n<li #popupMenuItem *ngIf=\"item.divider\" [class]=\"item.divider.classes\" role=\"presentation\" aria-hidden=\"true\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.divider, html: item.divider.html, text: item.divider.text}\"></ng-container>\n</li>\n</ng-container>\n</ul>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: AttributeChangeDirective, selector: "[desyAttributeChange]", inputs: ["attributesToCheck", "desyAttributeChangeEnabled"], outputs: ["desyAttributeChange", "desyAttributeChangeMutation"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "directive", type: MenubaritemDirective, selector: "[desyMenubaritem]", outputs: ["contentChanged"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MenuNavigationComponent, selector: "desy-menu-navigation", inputs: { idPrefix: "idPrefix", items: "items", classes: "classes", id: "id" }, outputs: { itemsChange: "itemsChange", activeItemChange: "activeItemChange", activeSubItemChange: "activeSubItemChange" }, host: { properties: { "class": "this.classes", "class.c-menu-navigation": "this.cfg", "attr.id": "this.id", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-labelledby": "this.ariaLabelledBy", "attr.aria-hidden": "this.ariaHidden", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-controls": "this.ariaControls", "attr.aria-current": "this.ariaCurrent", "attr.aria-live": "this.ariaLive", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-errormessage": "this.ariaErrorMessage", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-modal": "this.ariaModal", "attr.aria-checked": "this.ariaChecked", "attr.aria-pressed": "this.ariaPressed", "attr.aria-readonly": "this.ariaReadonly", "attr.aria-required": "this.ariaRequired", "attr.aria-selected": "this.ariaSelected", "attr.aria-valuemin": "this.ariaValuemin", "attr.aria-valuemax": "this.ariaValuemax", "attr.aria-valuenow": "this.ariaValuenow", "attr.aria-valuetext": "this.ariaValuetext", "attr.aria-orientation": "this.ariaOrientation", "attr.aria-level": "this.ariaLevel", "attr.aria-multiselectable": "this.ariaMultiselectable", "attr.aria-placeholder": "this.ariaPlaceholder", "attr.aria-posinset": "this.ariaPosinset", "attr.aria-setsize": "this.ariaSetsize", "attr.aria-sort": "this.ariaSort", "attr.aria-busy": "this.ariaBusy", "attr.aria-dropeffect": "this.ariaDropeffect", "attr.aria-grabbed": "this.ariaGrabbed", "attr.aria-activedescendant": "this.ariaActivedescendant", "attr.aria-atomic": "this.ariaAtomic", "attr.aria-autocomplete": "this.ariaAutocomplete", "attr.aria-braillelabel": "this.ariaBraillelabel", "attr.aria-brailleroledescription": "this.ariaBrailleroledescription", "attr.aria-colcount": "this.ariaColcount", "attr.aria-colindex": "this.ariaColindex", "attr.aria-colindextext": "this.ariaColindextext", "attr.aria-colspan": "this.ariaColspan", "attr.aria-description": "this.ariaDescription", "attr.aria-details": "this.ariaDetails", "attr.aria-flowto": "this.ariaFlowto", "attr.aria-invalid": "this.ariaInvalid", "attr.aria-keyshortcuts": "this.ariaKeyshortcuts", "attr.aria-owns": "this.ariaOwns", "attr.aria-relevant": "this.ariaRelevant", "attr.aria-roledescription": "this.ariaRoledescription", "attr.aria-rowcount": "this.ariaRowcount", "attr.aria-rowindex": "this.ariaRowindex", "attr.aria-rowindextext": "this.ariaRowindextext", "attr.aria-rowspan": "this.ariaRowspan", "attr.tabindex": "this.tabindex", "attr.title": "this.title", "attr.alt": "this.alt", "attr.lang": "this.lang", "attr.accesskey": "this.accesskey", "attr.autocomplete": "this.autocomplete", "attr.autofocus": "this.autofocus", "attr.contenteditable": "this.contenteditable", "attr.dir": "this.dir", "attr.draggable": "this.draggable", "attr.enterkeyhint": "this.enterkeyhint", "attr.hidden": "this.hidden", "attr.inputmode": "this.inputmode", "attr.spellcheck": "this.spellcheck", "attr.translate": "this.translate", "attr.aria-multiline": "this.ariaMultiline", "attr.for": "this.for", "attr.form": "this.form", "attr.headers": "this.headers", "attr.placeholder": "this.placeholder", "attr.readonly": "this.readonly", "attr.required": "this.required" } }, queries: [{ propertyName: "itemComponentList", predicate: MenuNavigationItemComponent }], viewQueries: [{ propertyName: "menunavigation", first: true, predicate: ["menunavigation"], descendants: true, read: ElementRef }, { propertyName: "menuItems", predicate: MenubaritemDirective, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ul #menunavigation [id]=\"id + '-menu-navigation'\" class=\"flex flex-wrap gap-base\"\n(focusin)=\"handleMenuFocusIn()\"\n(focusout)=\"handleMenuFocusOut($event)\"\n[ngClass]=\"{ 'focus': isFocused }\"\n[attr.aria-label]=\"ariaLabel ? ariaLabel : null\">\n<ng-container *ngFor=\"let item of getItems(); index as itemIndex\">\n<li class=\"relative\" desyMenubaritem (contentChanged)=\"checkChanges()\">\n  <a *ngIf=\"item.href\" #link\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [attr.role]=\"item.disabled ? link : null\"\n      [id]=\"getItemId(item, itemIndex)\"\n      [target]=\"item.target\"\n      [href]=\"item.href\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.title]=\"item.title ? item.title : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n      <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n          <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n      </span>          \n  </a>\n  <a *ngIf=\"!item.href && item.routerLink\" #link\n    (click)=\"handleMenuItemClick($event, itemIndex)\"\n     (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n     (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n     (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n     [attr.role]=\"item.disabled ? link : null\"\n     [id]=\"getItemId(item, itemIndex)\"\n     [target]=\"item.target\"\n     [routerLink]=\"item.routerLink\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n     [fragment]=\"item.fragment\"\n     [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n     [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n     [attr.disabled]=\"item.disabled ? item.disabled : null\"\n     [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n     [desyAppAccessibility]=\"item\"\n     [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n     [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n     <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n         <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n     </span>          \n  </a>\n  <button *ngIf=\"!item.href && !item.routerLink\" #link #itemContentWrapper\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.aria-expanded]=\"item.sub ? (!!(menuData && menuData[itemIndex].open) ?  true :  false) : null\"\n      [attr.aria-haspopup]=\"item.sub ? (!!(menuData && menuData[itemIndex].open) ?  true :  false) : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.aria-controls]=\"item.sub ? (item.ariaControls ?  item.ariaControls :  id + '-sub-list') : null\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n          <span *ngIf=\"item.active\" class=\"sr-only\">Item activo: </span>\n          <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n            </span>\n          <svg *ngIf=\"item.sub\" class=\"inline-block -mr-2  align-middle -my-px pointer-events-none\" viewBox=\"0 0 96 96\" aria-hidden=\"true\" fill=\"currentColor\" focusable=\"false\" width=\"1.5em\" height=\"1.5em\"><g><path d=\"M46.71 58.037a1.823 1.823 0 002.581 0L62.048 45.28a1.823 1.823 0 00-1.29-3.113H35.243a1.823 1.823 0 00-1.291 3.113z\"/></g></svg>\n  </button>        \n\n  <div *ngIf=\"item.sub && getItemSubitems(item)\" class=\"c-menu-navigation__sub absolute bottom-0 left-0\">\n      <ul  [id]=\"id + '-sub-list'\" [style]=\"menuData && menuData[itemIndex].open?'display:block':'display:none'\" #popupMenu role=\"menu\" tabindex=\"-1\"\n      [class]=\"item.sub.classes ? item.sub.classes : 'c-menu-navigation__tooltip w-max max-w-64 border border-neutral-base shadow-md bg-white text-sm'\"\n      [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : (item.sub.ariaLabel ? item.sub.ariaLabel : null)\"\n      [attr.aria-disabled]=\"item.sub.ariaDisabled ? item.sub.ariaDisabled : null\"\n      [desyAppAccessibility]=\"item.sub\">\n        <ng-container *ngFor=\"let subItem of getItemSubitems(item); index as subItemIndex\">\t\t\t\t\n            <li #popupMenuItem tabindex=\"-1\"\n                [id]=\"getSubItemId(subItem, subItemIndex, getItemId(item, itemIndex))\"\n                (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\">\n              <a *ngIf=\"subItem.href\" #itemContentWrapper\n                  [href]=\"subItem.href\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n              </a>\n              <a *ngIf=\"!subItem.href && subItem.routerLink\" #itemContentWrapper\n                  [routerLink]=\"subItem.routerLink\"\n                  [routerLinkActive]=\"subItem.routerLinkActiveClasses ? subItem.routerLinkActiveClasses : []\"\n                  [fragment]=\"subItem.fragment\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n            </a>\n            </li>\n            <li *ngIf=\"subItem.divider\" class=\"my-sm border-b border-neutral-base\">\n              <div class=\"sr-only\">Separador</div>\n          </li>\n        </ng-container>\n      </ul>\n  </div>\n</li>\n<li #popupMenuItem *ngIf=\"item.divider\" [class]=\"item.divider.classes\" role=\"presentation\" aria-hidden=\"true\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.divider, html: item.divider.html, text: item.divider.text}\"></ng-container>\n</li>\n</ng-container>\n</ul>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: AttributeChangeDirective, selector: "[desyAttributeChange]", inputs: ["attributesToCheck", "desyAttributeChangeEnabled"], outputs: ["desyAttributeChange", "desyAttributeChangeMutation"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "directive", type: MenubaritemDirective, selector: "[desyMenubaritem]", outputs: ["contentChanged"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MenuNavigationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-menu-navigation', template: "<ul #menunavigation [id]=\"id + '-menu-navigation'\" class=\"flex flex-wrap gap-base\"\n(focusin)=\"handleMenuFocusIn()\"\n(focusout)=\"handleMenuFocusOut($event)\"\n[ngClass]=\"{ 'focus': isFocused }\"\n[attr.aria-label]=\"ariaLabel ? ariaLabel : null\">\n<ng-container *ngFor=\"let item of getItems(); index as itemIndex\">\n<li class=\"relative\" desyMenubaritem (contentChanged)=\"checkChanges()\">\n  <a *ngIf=\"item.href\" #link\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [attr.role]=\"item.disabled ? link : null\"\n      [id]=\"getItemId(item, itemIndex)\"\n      [target]=\"item.target\"\n      [href]=\"item.href\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.title]=\"item.title ? item.title : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n      <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n          <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n      </span>          \n  </a>\n  <a *ngIf=\"!item.href && item.routerLink\" #link\n    (click)=\"handleMenuItemClick($event, itemIndex)\"\n     (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n     (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n     (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n     [attr.role]=\"item.disabled ? link : null\"\n     [id]=\"getItemId(item, itemIndex)\"\n     [target]=\"item.target\"\n     [routerLink]=\"item.routerLink\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n     [fragment]=\"item.fragment\"\n     [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n     [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n     [attr.disabled]=\"item.disabled ? item.disabled : null\"\n     [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n     [desyAppAccessibility]=\"item\"\n     [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n     [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n     <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n         <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n     </span>          \n  </a>\n  <button *ngIf=\"!item.href && !item.routerLink\" #link #itemContentWrapper\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.aria-expanded]=\"item.sub ? (!!(menuData && menuData[itemIndex].open) ?  true :  false) : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.aria-controls]=\"item.sub ? (item.ariaControls ?  item.ariaControls :  id + '-sub-list') : null\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n          <span *ngIf=\"item.active\" class=\"sr-only\">Item activo: </span>\n          <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n            </span>\n          <svg *ngIf=\"item.sub\" class=\"inline-block -mr-2  align-middle -my-px pointer-events-none\" viewBox=\"0 0 96 96\" aria-hidden=\"true\" fill=\"currentColor\" focusable=\"false\" width=\"1.5em\" height=\"1.5em\"><g><path d=\"M46.71 58.037a1.823 1.823 0 002.581 0L62.048 45.28a1.823 1.823 0 00-1.29-3.113H35.243a1.823 1.823 0 00-1.291 3.113z\"/></g></svg>\n  </button>        \n\n  <div *ngIf=\"item.sub && getItemSubitems(item)\" class=\"c-menu-navigation__sub absolute bottom-0 left-0\">\n      <ul  [id]=\"id + '-sub-list'\" [style]=\"menuData && menuData[itemIndex].open?'display:block':'display:none'\" #popupMenu role=\"menu\" tabindex=\"-1\"\n      [class]=\"item.sub.classes ? item.sub.classes : 'c-menu-navigation__tooltip w-max max-w-64 border border-neutral-base shadow-md bg-white text-sm'\"\n      [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : (item.sub.ariaLabel ? item.sub.ariaLabel : null)\"\n      [attr.aria-disabled]=\"item.sub.ariaDisabled ? item.sub.ariaDisabled : null\"\n      [desyAppAccessibility]=\"item.sub\">\n        <ng-container *ngFor=\"let subItem of getItemSubitems(item); index as subItemIndex\">\t\t\t\t\n            <li #popupMenuItem tabindex=\"-1\"\n                [id]=\"getSubItemId(subItem, subItemIndex, getItemId(item, itemIndex))\"\n                (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\">\n              <a *ngIf=\"subItem.href\" #itemContentWrapper\n                  [href]=\"subItem.href\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n              </a>\n              <a *ngIf=\"!subItem.href && subItem.routerLink\" #itemContentWrapper\n                  [routerLink]=\"subItem.routerLink\"\n                  [routerLinkActive]=\"subItem.routerLinkActiveClasses ? subItem.routerLinkActiveClasses : []\"\n                  [fragment]=\"subItem.fragment\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n            </a>\n            </li>\n            <li *ngIf=\"subItem.divider\" class=\"my-sm border-b border-neutral-base\">\n              <div class=\"sr-only\">Separador</div>\n          </li>\n        </ng-container>\n      </ul>\n  </div>\n</li>\n<li #popupMenuItem *ngIf=\"item.divider\" [class]=\"item.divider.classes\" role=\"presentation\" aria-hidden=\"true\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.divider, html: item.divider.html, text: item.divider.text}\"></ng-container>\n</li>\n</ng-container>\n</ul>\n" }]
+            args: [{ selector: 'desy-menu-navigation', template: "<ul #menunavigation [id]=\"id + '-menu-navigation'\" class=\"flex flex-wrap gap-base\"\n(focusin)=\"handleMenuFocusIn()\"\n(focusout)=\"handleMenuFocusOut($event)\"\n[ngClass]=\"{ 'focus': isFocused }\"\n[attr.aria-label]=\"ariaLabel ? ariaLabel : null\">\n<ng-container *ngFor=\"let item of getItems(); index as itemIndex\">\n<li class=\"relative\" desyMenubaritem (contentChanged)=\"checkChanges()\">\n  <a *ngIf=\"item.href\" #link\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [attr.role]=\"item.disabled ? link : null\"\n      [id]=\"getItemId(item, itemIndex)\"\n      [target]=\"item.target\"\n      [href]=\"item.href\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.title]=\"item.title ? item.title : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n      <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n          <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n      </span>          \n  </a>\n  <a *ngIf=\"!item.href && item.routerLink\" #link\n    (click)=\"handleMenuItemClick($event, itemIndex)\"\n     (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n     (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n     (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n     [attr.role]=\"item.disabled ? link : null\"\n     [id]=\"getItemId(item, itemIndex)\"\n     [target]=\"item.target\"\n     [routerLink]=\"item.routerLink\"\n     [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\n     [fragment]=\"item.fragment\"\n     [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n     [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n     [attr.disabled]=\"item.disabled ? item.disabled : null\"\n     [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n     [desyAppAccessibility]=\"item\"\n     [attr.aria-current]=\"item.disabled ? 'page' : (item.ariaCurrent ? item.ariaCurrent : null)\"\n     [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n     <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n         <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n     </span>          \n  </a>\n  <button *ngIf=\"!item.href && !item.routerLink\" #link #itemContentWrapper\n     (click)=\"handleMenuItemClick($event, itemIndex)\"\n      (keydown)=\"handleMenuItemKeydown($event, itemIndex)\"\n      (mouseover)=\"handleMenuItemMouseOver(itemIndex)\"\n      (desyAttributeChange)=\"checkChanges()\" [attributesToCheck]=\"'disabled'\"\n      [class]=\"['c-menu-navigation__button', item.classes] | makeHtmlList\"\n      [ngClass]=\"{'c-menu-navigation__button--disabled': item.disabled, 'c-menu-navigation__button--primary': item.active, 'c-menu-navigation__button--has-selection': item.active}\"\n      [attr.aria-expanded]=\"item.sub ? (!!(menuData && menuData[itemIndex].open) ?  true :  false) : null\"\n      [attr.aria-haspopup]=\"item.sub ? (!!(menuData && menuData[itemIndex].open) ?  true :  false) : null\"\n      [attr.disabled]=\"item.disabled ? item.disabled : null\"\n      [attr.aria-disabled]=\"item.disabled ? item.disabled : (item.ariaDisabled ? item.ariaDisabled : null)\"\n      [desyAppAccessibility]=\"item\"\n      [attr.aria-controls]=\"item.sub ? (item.ariaControls ?  item.ariaControls :  id + '-sub-list') : null\"\n      [attr.tabindex]=\"item.disabled ? -1 : (itemIndex === currentFocusItemIndex ? 0 : -1)\">\n          <span *ngIf=\"item.active\" class=\"sr-only\">Item activo: </span>\n          <span class=\"inline-flex self-center max-w-xs align-middle truncate pointer-events-none\" #itemContentWrapper>\n              <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text}\"></ng-container>\n            </span>\n          <svg *ngIf=\"item.sub\" class=\"inline-block -mr-2  align-middle -my-px pointer-events-none\" viewBox=\"0 0 96 96\" aria-hidden=\"true\" fill=\"currentColor\" focusable=\"false\" width=\"1.5em\" height=\"1.5em\"><g><path d=\"M46.71 58.037a1.823 1.823 0 002.581 0L62.048 45.28a1.823 1.823 0 00-1.29-3.113H35.243a1.823 1.823 0 00-1.291 3.113z\"/></g></svg>\n  </button>        \n\n  <div *ngIf=\"item.sub && getItemSubitems(item)\" class=\"c-menu-navigation__sub absolute bottom-0 left-0\">\n      <ul  [id]=\"id + '-sub-list'\" [style]=\"menuData && menuData[itemIndex].open?'display:block':'display:none'\" #popupMenu role=\"menu\" tabindex=\"-1\"\n      [class]=\"item.sub.classes ? item.sub.classes : 'c-menu-navigation__tooltip w-max max-w-64 border border-neutral-base shadow-md bg-white text-sm'\"\n      [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : (item.sub.ariaLabel ? item.sub.ariaLabel : null)\"\n      [attr.aria-disabled]=\"item.sub.ariaDisabled ? item.sub.ariaDisabled : null\"\n      [desyAppAccessibility]=\"item.sub\">\n        <ng-container *ngFor=\"let subItem of getItemSubitems(item); index as subItemIndex\">\t\t\t\t\n            <li #popupMenuItem tabindex=\"-1\"\n                [id]=\"getSubItemId(subItem, subItemIndex, getItemId(item, itemIndex))\"\n                (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\">\n              <a *ngIf=\"subItem.href\" #itemContentWrapper\n                  [href]=\"subItem.href\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n              </a>\n              <a *ngIf=\"!subItem.href && subItem.routerLink\" #itemContentWrapper\n                  [routerLink]=\"subItem.routerLink\"\n                  [routerLinkActive]=\"subItem.routerLinkActiveClasses ? subItem.routerLinkActiveClasses : []\"\n                  [fragment]=\"subItem.fragment\"\n                  (click)=\"handlePopupMenuItemClick(itemIndex, subItemIndex)\"\n                  (mouseover)=\"handlePopupMenuItemMouseOver(itemIndex, subItemIndex)\"\n                  (keydown)=\"handlePopupMenuItemKeydown($event, itemIndex, subItemIndex)\"\n                  (desyAttributeChange)=\"checkChanges()\"\n                  [class]=\"['flex items-center px-base py-sm text-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', subItem.classes] | makeHtmlList\"\n                  [ngClass]=\"{'pointer-events-none': subItem.disabled}\"\n                  [tabindex]=\"subItem.disabled ? -1 : null\"\n                  [attr.aria-current]=\"subItem.active ? 'page' : null\"\n                  [target]=\"subItem.target\">\n                  <strong class=\"font-bold\" *ngIf=\"subItem.active; else noActive\">\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </strong>\n                  <ng-template #noActive>\n                    <ng-container *desyCustomInnerContent=\"{ component: subItem, html: subItem.html, text: subItem.text}\"></ng-container>\n                  </ng-template>\n                  <svg *ngIf=\"subItem.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle flex-initial ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\n            </a>\n            </li>\n            <li *ngIf=\"subItem.divider\" class=\"my-sm border-b border-neutral-base\">\n              <div class=\"sr-only\">Separador</div>\n          </li>\n        </ng-container>\n      </ul>\n  </div>\n</li>\n<li #popupMenuItem *ngIf=\"item.divider\" [class]=\"item.divider.classes\" role=\"presentation\" aria-hidden=\"true\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.divider, html: item.divider.html, text: item.divider.text}\"></ng-container>\n</li>\n</ng-container>\n</ul>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { idPrefix: [{
                 type: Input
             }], items: [{
@@ -10521,10 +10743,6 @@ class FocusClickedCellDirective {
                 next.focus();
             }
         }
-        if (event.code === 'Enter' || event.code === 'Space') {
-            this.handleFocus();
-            event.preventDefault();
-        }
     }
     handleFocus() {
         const hostElem = this.el.nativeElement;
@@ -10742,7 +10960,7 @@ class TableAdvancedComponent extends AccessibilityComponent {
         });
         return filteredRows;
     }
-    handleSortByColumn(index) {
+    handleSortByColumn(index, event) {
         const head = this.getHeaderCells();
         if (head) {
             head.forEach((cell, cellIndex) => {
@@ -10752,6 +10970,7 @@ class TableAdvancedComponent extends AccessibilityComponent {
             });
         }
         this.recalculateVisibleElements();
+        event?.preventDefault();
     }
     sortRows(recalculateParams, rows) {
         let sortedRows = rows;
@@ -10764,13 +10983,13 @@ class TableAdvancedComponent extends AccessibilityComponent {
     }
     compareCellContent(a, b, isAsc) {
         let result;
-        const aComparable = this.cleanCurrency(a.getContent());
-        const bComparable = this.cleanCurrency(b.getContent());
+        const aComparable = this.cleanCurrency(a.getContent()).trim();
+        const bComparable = this.cleanCurrency(b.getContent()).trim();
         const numberRegex = /^-?\d+(\.|,)?\d*$/;
         const dateRegex = /^(\d{2})(\/|-)(\d{2})(\/|-)(\d{4})( (\d{2}):(\d{2})(:(\d{2}))?)?$/;
         if (aComparable && bComparable) {
             if (numberRegex.test(aComparable) && numberRegex.test(bComparable)) {
-                result = aComparable.localeCompare(bComparable, undefined, { numeric: true });
+                result = (parseFloat(aComparable) - parseFloat(bComparable));
             }
             else if (dateRegex.test(aComparable) && dateRegex.test(bComparable)) {
                 result = this.parseDateTime(aComparable) - this.parseDateTime(bComparable);
@@ -10797,9 +11016,7 @@ class TableAdvancedComponent extends AccessibilityComponent {
         }
     }
     cleanCurrency(txt) {
-        if (/[\d.,]+[\€]/g.test(txt)) {
-            txt = txt.replace(/€/g, '');
-        }
+        txt = txt.replace(/€/g, '');
         return txt;
     }
     selectFilter(item, itemValue) {
@@ -10814,7 +11031,7 @@ class TableAdvancedComponent extends AccessibilityComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableAdvancedComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableAdvancedComponent, selector: "desy-table-advanced", inputs: { rows: "rows", head: "head", foot: "foot", caption: "caption", captionClasses: "captionClasses", firstCellIsHeader: "firstCellIsHeader", hasCheckboxes: "hasCheckboxes", idPrefix: "idPrefix", classes: "classes", checkboxClasses: "checkboxClasses", id: "id", wrapper: "wrapper" }, outputs: { rowsChange: "rowsChange", rowsChecked: "rowsChecked", recalculateTable: "recalculateTable" }, queries: [{ propertyName: "captionComponent", predicate: TableCaptionComponent }, { propertyName: "headerComponent", predicate: TableAdvancedHeaderComponent }, { propertyName: "footerComponent", predicate: TableAdvancedFooterComponent }, { propertyName: "rowComponentList", predicate: TableAdvancedRowComponent }], viewQueries: [{ propertyName: "rowData", predicate: RowDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #tableContent>\n  <table role=\"grid\"\n          [class]=\"['c-table-advanced border-t-2 border-b-2 border-neutral-base', classes] | makeHtmlList\"\n          [attr.id]=\"id ? id : null\"\n          [desyAppAccessibility]=\"this\">\n      <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n        <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n      </caption>\n      <thead *ngIf=\"getHeaderCells()\">\n          <tr class=\"border-t border-neutral-base divide-x divide-neutral-base\">\n              <th *ngIf=\"hasCheckboxes\" scope=\"col\" [class]=\"['align-top px-base py-xs', 'w-16', checkboxClasses] | makeHtmlList\">\n                  <span class=\"sr-only\">Seleccionar fila</span>\n              </th>\n              <th scope=\"col\" *ngFor=\"let item of getHeaderCells(); index as iHeader\" [id]=\"getIdHeader(iHeader)\"\n                      [attr.aria-sort]=\"item.orderBy ? getStringOrderBy(item.orderBy) : null\"\n                      [class]=\"['align-top px-base py-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\"\n                      [attr.colspan]=\"item.colspan ? item.colspan  : null\"\n                      [attr.rowspan]=\"item.rowspan ? item.rowspan  : null\"\n                      [desyAppAccessibility]=\"item\">\n\n                  <span *ngIf=\"item.orderBy\" class=\"inline-block relative\" (click)=\"handleSortByColumn(iHeader)\" (keydown.enter)=\"handleSortByColumn(iHeader)\" (keydown.space)=\"handleSortByColumn(iHeader)\" desyFocusClickedCell\n                        [attr.tabindex]=\"item.orderBy ? -1 : null\"\n                        [attr.role]=\"item.orderBy ? 'button' : null\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                    <span class=\"c-table-advanced__order\" *ngIf=\"item.orderBy\">\n                        <span class=\"sr-only\">Pulsa para ordenar por esta columna</span>\n                        <span class=\"c-table-advanced__ascending\" *ngIf=\"item.orderBy === orderByType.asc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M112.07 37.93l-35-35a10 10 0 00-14.14 0l-35 35a10 10 0 0014.14 14.14l13.66-13.66A2.5 2.5 0 0160 40.18V130a10 10 0 0020 0V40.18a2.5 2.5 0 014.27-1.77l13.66 13.66a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__descending\" *ngIf=\"item.orderBy === orderByType.desc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M27.93 102.07l35 35a10 10 0 0014.14 0l35-35a10 10 0 00-14.14-14.14l-13.66 13.66A2.5 2.5 0 0180 99.82V10a10 10 0 00-20 0v89.82a2.5 2.5 0 01-4.27 1.77L42.07 87.93a10 10 0 00-14.14 14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__none\"  *ngIf=\"item.orderBy === orderByType.none\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"text-neutral-dark\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M94.7 97.2l-17.2 17.19V25.61L94.7 42.8a7.5 7.5 0 0010.6-10.6l-30-30a7.49 7.49 0 00-10.6 0l-30 30a7.5 7.5 0 0010.6 10.6l17.2-17.19v88.78L45.3 97.2a7.5 7.5 0 10-10.6 10.6l30 30a7.48 7.48 0 0010.6 0l30-30a7.5 7.5 0 00-10.6-10.6z\" fill=\"currentColor\"/></svg>\n                        </span>\n                    </span>\n                  </span>\n\n                  <span *ngIf=\"!item.orderBy\" class=\"inline-block relative\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                  </span>\n              </th>\n          </tr>\n      </thead>\n\n      <tbody>\n          <tr class=\"divide-x divide-neutral-base\" *ngIf=\"hasFilters()\">\n              <td *ngIf=\"hasCheckboxes\" [ngClass]=\"checkboxClasses\"></td>\n              <td tabindex=\"-1\" *ngFor=\"let item of getHeaderCells(); index as iHead\" desyFocusClickedCell\n                  [class]=\"['align-top px-base pb-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\">\n                  <ng-container *ngIf=\"item.hasSelect && getSelectForItem(item) !== null\">\n                    <ng-container *ngTemplateOutlet=\"tableSelect; context: {selectable: getSelectForItem(item)}\"></ng-container>\n                    <ng-template #tableSelect let-selectable=\"selectable\">\n                      <desy-select [id]=\"getIdHeaderSelect(iHead)\"\n                        [labelData]=\"{ text: 'Filtrar por esta columna', classes: 'sr-only' }\"\n                        [classes]=\"selectable.classes ? selectable.classes : 'c-select--sm w-full'\"\n                        [formGroupClasses]=\"selectable.formGroupClasses ? selectable.formGroupClasses : '-mt-sm mb-0'\"\n                        [name]=\"selectable.name\"\n                        [items]=\"getItemSelectOptions(selectable)\"\n                        [disabled]=\"selectable.disabled\"\n                        [describedBy]=\"getIdHeaderSelect(iHead)\"\n\n                        [(ngModel)]=\"item.valueSelect\" (ngModelChange)=\"handleInputSearch(item)\"\n\n                        [role]=\"selectable.role\"\n                        [ariaLabel]=\"selectable.ariaLabel\"\n                        [ariaDescribedBy]=\"selectable.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"selectable.ariaLabelledBy\"\n                        [ariaHidden]=\"selectable.ariaHidden\"\n                        [ariaDisabled]=\"selectable.ariaDisabled\"\n                        [ariaControls]=\"selectable.ariaControls\"\n                        [ariaCurrent]=\"selectable.ariaCurrent\"\n                        [ariaLive]=\"selectable.ariaLive\"\n                        [ariaExpanded]=\"selectable.ariaExpanded\"\n                        [ariaErrorMessage]=\"selectable.ariaErrorMessage\"\n                        [ariaHasPopup]=\"selectable.ariaHasPopup\"\n                        [tabindex]=\"selectable.tabindex\">\n                      </desy-select>\n                    </ng-template>\n                  </ng-container>\n\n                  <div *ngIf=\"item.hasSelect && item.hasFilter\" class=\"pb-sm\"></div>\n\n                  <desy-search-bar *ngIf=\"item.hasFilter\"\n                                   [(ngModel)]=\"item.valueFilter\" [ngModelOptions]=\"{standalone: true}\"\n                                   (clickEvent)=\"handleInputSearch(item)\"\n                                   (ngModelChange)=\"handleInputSearch(item)\"\n                                   labelText=\"Buscar en esta columna\"\n                                   [id]=\"getIdHeaderFilter(iHead)\"\n                                   placeholder=\"Buscar\"\n                                   [classes]=\"['c-input--sm', item.filterClasses] | makeHtmlList\"\n                                   buttonClasses=\"m-xs p-0.5 text-xs\"\n                                   [describedBy]=\"getIdHeader(iHead)\"> </desy-search-bar>\n              </td>\n          </tr>\n\n\n          <tr *ngFor=\"let row of getVisibleRows(); index as iRow\" class=\"border-t border-b border-neutral-base hover:bg-neutral-lighter\"\n              [desyRow]=\"row\">\n              <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n                  tabindex=\"-1\" >\n                <div class=\"c-checkboxes c-checkboxes--sm\">\n                  <div>\n                    <div class=\"relative flex items-start\">\n                      <div class=\"flex items-center mx-sm\">\n                        <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                               [(ngModel)]=\"row.checked\" (ngModelChange)=\"handleCheckboxChange(row)\"\n                               [id]=\"getIdRowCheckbox(iRow)\"\n                               [name]=\"getIdRowCheckbox(iRow)\">\n                      </div>\n                      <div class=\"pt-0.5 leading-5\">\n                        <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iRow)\">Selecciona fila {{ iRow }}</label>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </td>\n              <ng-container *ngFor=\"let cell of row.cellsList; first as isFirstCell; index as columnIndex\">\n                  <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                      [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                      desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </th>\n                  <ng-template #elseTd>\n                      <td tabindex=\"-1\" desyFocusClickedCell\n                          [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                          desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                          [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                          [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                          [attr.id]=\"cell.id ? cell.id : null\"\n                          [desyAppAccessibility]=\"cell\"\n                          [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                        <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                      </td>\n                  </ng-template>\n              </ng-container>\n          </tr>\n      </tbody>\n      \n      <tfoot *ngIf=\"getFooterCells()\">\n         <tr *ngFor=\"let foot of getFooterCells(); index as iFooter\" class=\"border-t-2 border-b border-neutral-base hover:bg-neutral-lighter\">\n           <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n               tabindex=\"-1\">\n             <div class=\"c-checkboxes c-checkboxes--sm\">\n               <div>\n                 <div class=\"relative flex items-start\">\n                   <div class=\"flex items-center mx-sm\">\n                     <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                            [(ngModel)]=\"foot.checked\" (ngModelChange)=\"handleCheckboxChange(foot)\"\n                            [id]=\"getIdRowCheckbox(iFooter)\"\n                            [name]=\"getIdRowCheckbox(iFooter)\">\n                   </div>\n                   <div class=\"pt-0.5 leading-5\">\n                     <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iFooter)\">Selecciona fila {{ iFooter }}</label>\n                   </div>\n                 </div>\n               </div>\n             </div>\n           </td>\n           <ng-container *ngFor=\"let cell of foot.cellsList; first as isFirstCell; index as columnIndex\">\n               <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                   [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                   desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                   [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                   [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                   [attr.id]=\"cell.id ? cell.id : null\"\n                   [desyAppAccessibility]=\"cell\">\n                 <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n               </th>\n               <ng-template #elseTd>\n                   <td tabindex=\"-1\" desyFocusClickedCell\n                       [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                       desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                       [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                       [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                       [attr.id]=\"cell.id ? cell.id : null\"\n                       [desyAppAccessibility]=\"cell\"\n                       [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                     <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                   </td>\n               </ng-template>\n           </ng-container>\n       </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: SelectComponent, selector: "desy-select", inputs: ["name", "items", "describedBy", "formGroupClasses", "classes"] }, { kind: "component", type: SearchBarComponent, selector: "desy-search-bar", inputs: ["describedBy", "classes", "buttonClasses", "placeholder"], outputs: ["clickEvent"] }, { kind: "directive", type: FocusClickedCellDirective, selector: "[desyFocusClickedCell]" }, { kind: "directive", type: CellDirective, selector: "[desyCell]", inputs: ["row", "rowIndex", "columnIndex"] }, { kind: "directive", type: RowDirective, selector: "[desyRow]", inputs: ["desyRow"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableAdvancedComponent, selector: "desy-table-advanced", inputs: { rows: "rows", head: "head", foot: "foot", caption: "caption", captionClasses: "captionClasses", firstCellIsHeader: "firstCellIsHeader", hasCheckboxes: "hasCheckboxes", idPrefix: "idPrefix", classes: "classes", checkboxClasses: "checkboxClasses", id: "id", wrapper: "wrapper" }, outputs: { rowsChange: "rowsChange", rowsChecked: "rowsChecked", recalculateTable: "recalculateTable" }, queries: [{ propertyName: "captionComponent", predicate: TableCaptionComponent }, { propertyName: "headerComponent", predicate: TableAdvancedHeaderComponent }, { propertyName: "footerComponent", predicate: TableAdvancedFooterComponent }, { propertyName: "rowComponentList", predicate: TableAdvancedRowComponent }], viewQueries: [{ propertyName: "rowData", predicate: RowDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #tableContent>\n  <table role=\"grid\"\n          [class]=\"['c-table-advanced border-t-2 border-b-2 border-neutral-base', classes] | makeHtmlList\"\n          [attr.id]=\"id ? id : null\"\n          [desyAppAccessibility]=\"this\">\n      <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n        <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n      </caption>\n      <thead *ngIf=\"getHeaderCells()\">\n          <tr class=\"border-t border-neutral-base divide-x divide-neutral-base\">\n              <th *ngIf=\"hasCheckboxes\" scope=\"col\" [class]=\"['align-top px-base py-xs', 'w-16', checkboxClasses] | makeHtmlList\">\n                  <span class=\"sr-only\">Seleccionar fila</span>\n              </th>\n              <th scope=\"col\" *ngFor=\"let item of getHeaderCells(); index as iHeader\" [id]=\"getIdHeader(iHeader)\"\n                      [attr.aria-sort]=\"item.orderBy ? getStringOrderBy(item.orderBy) : null\"\n                      [class]=\"['align-top px-base py-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\"\n                      [attr.colspan]=\"item.colspan ? item.colspan  : null\"\n                      [attr.rowspan]=\"item.rowspan ? item.rowspan  : null\"\n                      [desyAppAccessibility]=\"item\">\n\n                  <span *ngIf=\"item.orderBy\" class=\"inline-block relative\" (click)=\"handleSortByColumn(iHeader,$event)\" (keydown.enter)=\"handleSortByColumn(iHeader,$event)\" (keydown.space)=\"handleSortByColumn(iHeader,$event)\" desyFocusClickedCell\n                        [attr.tabindex]=\"item.orderBy ? -1 : null\"\n                        [attr.role]=\"item.orderBy ? 'button' : null\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                    <span class=\"c-table-advanced__order\" *ngIf=\"item.orderBy\">\n                        <span class=\"sr-only\">Pulsa para ordenar por esta columna</span>\n                        <span class=\"c-table-advanced__ascending\" *ngIf=\"item.orderBy === orderByType.asc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M112.07 37.93l-35-35a10 10 0 00-14.14 0l-35 35a10 10 0 0014.14 14.14l13.66-13.66A2.5 2.5 0 0160 40.18V130a10 10 0 0020 0V40.18a2.5 2.5 0 014.27-1.77l13.66 13.66a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__descending\" *ngIf=\"item.orderBy === orderByType.desc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M27.93 102.07l35 35a10 10 0 0014.14 0l35-35a10 10 0 00-14.14-14.14l-13.66 13.66A2.5 2.5 0 0180 99.82V10a10 10 0 00-20 0v89.82a2.5 2.5 0 01-4.27 1.77L42.07 87.93a10 10 0 00-14.14 14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__none\"  *ngIf=\"item.orderBy === orderByType.none\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"text-neutral-dark\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M94.7 97.2l-17.2 17.19V25.61L94.7 42.8a7.5 7.5 0 0010.6-10.6l-30-30a7.49 7.49 0 00-10.6 0l-30 30a7.5 7.5 0 0010.6 10.6l17.2-17.19v88.78L45.3 97.2a7.5 7.5 0 10-10.6 10.6l30 30a7.48 7.48 0 0010.6 0l30-30a7.5 7.5 0 00-10.6-10.6z\" fill=\"currentColor\"/></svg>\n                        </span>\n                    </span>\n                  </span>\n\n                  <span *ngIf=\"!item.orderBy\" class=\"inline-block relative\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                  </span>\n              </th>\n          </tr>\n      </thead>\n\n      <tbody>\n          <tr class=\"divide-x divide-neutral-base\" *ngIf=\"hasFilters()\">\n              <td *ngIf=\"hasCheckboxes\" [ngClass]=\"checkboxClasses\"></td>\n              <td tabindex=\"-1\" *ngFor=\"let item of getHeaderCells(); index as iHead\" desyFocusClickedCell\n                  [class]=\"['align-top px-base pb-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\">\n                  <ng-container *ngIf=\"item.hasSelect && getSelectForItem(item) !== null\">\n                    <ng-container *ngTemplateOutlet=\"tableSelect; context: {selectable: getSelectForItem(item)}\"></ng-container>\n                    <ng-template #tableSelect let-selectable=\"selectable\">\n                      <desy-select [id]=\"getIdHeaderSelect(iHead)\"\n                        [labelData]=\"{ text: 'Filtrar por esta columna', classes: 'sr-only' }\"\n                        [classes]=\"selectable.classes ? selectable.classes : 'c-select--sm w-full'\"\n                        [formGroupClasses]=\"selectable.formGroupClasses ? selectable.formGroupClasses : '-mt-sm mb-0'\"\n                        [name]=\"selectable.name\"\n                        [items]=\"getItemSelectOptions(selectable)\"\n                        [disabled]=\"selectable.disabled\"\n                        [describedBy]=\"getIdHeaderSelect(iHead)\"\n\n                        [(ngModel)]=\"item.valueSelect\" (ngModelChange)=\"handleInputSearch(item)\"\n\n                        [role]=\"selectable.role\"\n                        [ariaLabel]=\"selectable.ariaLabel\"\n                        [ariaDescribedBy]=\"selectable.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"selectable.ariaLabelledBy\"\n                        [ariaHidden]=\"selectable.ariaHidden\"\n                        [ariaDisabled]=\"selectable.ariaDisabled\"\n                        [ariaControls]=\"selectable.ariaControls\"\n                        [ariaCurrent]=\"selectable.ariaCurrent\"\n                        [ariaLive]=\"selectable.ariaLive\"\n                        [ariaExpanded]=\"selectable.ariaExpanded\"\n                        [ariaErrorMessage]=\"selectable.ariaErrorMessage\"\n                        [ariaHasPopup]=\"selectable.ariaHasPopup\"\n                        [tabindex]=\"selectable.tabindex\">\n                      </desy-select>\n                    </ng-template>\n                  </ng-container>\n\n                  <div *ngIf=\"item.hasSelect && item.hasFilter\" class=\"pb-sm\"></div>\n\n                  <desy-search-bar *ngIf=\"item.hasFilter\"\n                                   [(ngModel)]=\"item.valueFilter\" [ngModelOptions]=\"{standalone: true}\"\n                                   (clickEvent)=\"handleInputSearch(item)\"\n                                   (ngModelChange)=\"handleInputSearch(item)\"\n                                   labelText=\"Buscar en esta columna\"\n                                   [id]=\"getIdHeaderFilter(iHead)\"\n                                   placeholder=\"Buscar\"\n                                   [classes]=\"['c-input--sm', item.filterClasses] | makeHtmlList\"\n                                   buttonClasses=\"m-xs p-0.5 text-xs\"\n                                   [describedBy]=\"getIdHeader(iHead)\"> </desy-search-bar>\n              </td>\n          </tr>\n\n\n          <tr *ngFor=\"let row of getVisibleRows(); index as iRow\" class=\"border-t border-b border-neutral-base hover:bg-neutral-lighter\"\n              [desyRow]=\"row\">\n              <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n                  tabindex=\"-1\" >\n                <div class=\"c-checkboxes c-checkboxes--sm\">\n                  <div>\n                    <div class=\"relative flex items-start\">\n                      <div class=\"flex items-center mx-sm\">\n                        <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                               [(ngModel)]=\"row.checked\" (ngModelChange)=\"handleCheckboxChange(row)\"\n                               [id]=\"getIdRowCheckbox(iRow)\"\n                               [name]=\"getIdRowCheckbox(iRow)\">\n                      </div>\n                      <div class=\"pt-0.5 leading-5\">\n                        <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iRow)\">Selecciona fila {{ iRow }}</label>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </td>\n              <ng-container *ngFor=\"let cell of row.cellsList; first as isFirstCell; index as columnIndex\">\n                  <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                      [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                      desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </th>\n                  <ng-template #elseTd>\n                      <td tabindex=\"-1\" desyFocusClickedCell\n                          [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                          desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                          [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                          [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                          [attr.id]=\"cell.id ? cell.id : null\"\n                          [desyAppAccessibility]=\"cell\"\n                          [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                        <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                      </td>\n                  </ng-template>\n              </ng-container>\n          </tr>\n      </tbody>\n      \n      <tfoot *ngIf=\"getFooterCells()\">\n         <tr *ngFor=\"let foot of getFooterCells(); index as iFooter\" class=\"border-t-2 border-b border-neutral-base hover:bg-neutral-lighter\">\n           <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n               tabindex=\"-1\">\n             <div class=\"c-checkboxes c-checkboxes--sm\">\n               <div>\n                 <div class=\"relative flex items-start\">\n                   <div class=\"flex items-center mx-sm\">\n                     <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                            [(ngModel)]=\"foot.checked\" (ngModelChange)=\"handleCheckboxChange(foot)\"\n                            [id]=\"getIdRowCheckbox(iFooter)\"\n                            [name]=\"getIdRowCheckbox(iFooter)\">\n                   </div>\n                   <div class=\"pt-0.5 leading-5\">\n                     <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iFooter)\">Selecciona fila {{ iFooter }}</label>\n                   </div>\n                 </div>\n               </div>\n             </div>\n           </td>\n           <ng-container *ngFor=\"let cell of foot.cellsList; first as isFirstCell; index as columnIndex\">\n               <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                   [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                   desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                   [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                   [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                   [attr.id]=\"cell.id ? cell.id : null\"\n                   [desyAppAccessibility]=\"cell\">\n                 <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n               </th>\n               <ng-template #elseTd>\n                   <td tabindex=\"-1\" desyFocusClickedCell\n                       [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                       desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                       [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                       [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                       [attr.id]=\"cell.id ? cell.id : null\"\n                       [desyAppAccessibility]=\"cell\"\n                       [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                     <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                   </td>\n               </ng-template>\n           </ng-container>\n       </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: SelectComponent, selector: "desy-select", inputs: ["name", "items", "describedBy", "formGroupClasses", "classes"] }, { kind: "component", type: SearchBarComponent, selector: "desy-search-bar", inputs: ["describedBy", "classes", "buttonClasses", "placeholder"], outputs: ["clickEvent"] }, { kind: "directive", type: FocusClickedCellDirective, selector: "[desyFocusClickedCell]" }, { kind: "directive", type: CellDirective, selector: "[desyCell]", inputs: ["row", "rowIndex", "columnIndex"] }, { kind: "directive", type: RowDirective, selector: "[desyRow]", inputs: ["desyRow"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
 }
 __decorate([
     DesyContentChild(),
@@ -10826,7 +11043,7 @@ __decorate([
 ], TableAdvancedComponent.prototype, "headerComponent", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableAdvancedComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-table-advanced', template: "<ng-template #tableContent>\n  <table role=\"grid\"\n          [class]=\"['c-table-advanced border-t-2 border-b-2 border-neutral-base', classes] | makeHtmlList\"\n          [attr.id]=\"id ? id : null\"\n          [desyAppAccessibility]=\"this\">\n      <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n        <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n      </caption>\n      <thead *ngIf=\"getHeaderCells()\">\n          <tr class=\"border-t border-neutral-base divide-x divide-neutral-base\">\n              <th *ngIf=\"hasCheckboxes\" scope=\"col\" [class]=\"['align-top px-base py-xs', 'w-16', checkboxClasses] | makeHtmlList\">\n                  <span class=\"sr-only\">Seleccionar fila</span>\n              </th>\n              <th scope=\"col\" *ngFor=\"let item of getHeaderCells(); index as iHeader\" [id]=\"getIdHeader(iHeader)\"\n                      [attr.aria-sort]=\"item.orderBy ? getStringOrderBy(item.orderBy) : null\"\n                      [class]=\"['align-top px-base py-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\"\n                      [attr.colspan]=\"item.colspan ? item.colspan  : null\"\n                      [attr.rowspan]=\"item.rowspan ? item.rowspan  : null\"\n                      [desyAppAccessibility]=\"item\">\n\n                  <span *ngIf=\"item.orderBy\" class=\"inline-block relative\" (click)=\"handleSortByColumn(iHeader)\" (keydown.enter)=\"handleSortByColumn(iHeader)\" (keydown.space)=\"handleSortByColumn(iHeader)\" desyFocusClickedCell\n                        [attr.tabindex]=\"item.orderBy ? -1 : null\"\n                        [attr.role]=\"item.orderBy ? 'button' : null\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                    <span class=\"c-table-advanced__order\" *ngIf=\"item.orderBy\">\n                        <span class=\"sr-only\">Pulsa para ordenar por esta columna</span>\n                        <span class=\"c-table-advanced__ascending\" *ngIf=\"item.orderBy === orderByType.asc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M112.07 37.93l-35-35a10 10 0 00-14.14 0l-35 35a10 10 0 0014.14 14.14l13.66-13.66A2.5 2.5 0 0160 40.18V130a10 10 0 0020 0V40.18a2.5 2.5 0 014.27-1.77l13.66 13.66a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__descending\" *ngIf=\"item.orderBy === orderByType.desc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M27.93 102.07l35 35a10 10 0 0014.14 0l35-35a10 10 0 00-14.14-14.14l-13.66 13.66A2.5 2.5 0 0180 99.82V10a10 10 0 00-20 0v89.82a2.5 2.5 0 01-4.27 1.77L42.07 87.93a10 10 0 00-14.14 14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__none\"  *ngIf=\"item.orderBy === orderByType.none\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"text-neutral-dark\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M94.7 97.2l-17.2 17.19V25.61L94.7 42.8a7.5 7.5 0 0010.6-10.6l-30-30a7.49 7.49 0 00-10.6 0l-30 30a7.5 7.5 0 0010.6 10.6l17.2-17.19v88.78L45.3 97.2a7.5 7.5 0 10-10.6 10.6l30 30a7.48 7.48 0 0010.6 0l30-30a7.5 7.5 0 00-10.6-10.6z\" fill=\"currentColor\"/></svg>\n                        </span>\n                    </span>\n                  </span>\n\n                  <span *ngIf=\"!item.orderBy\" class=\"inline-block relative\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                  </span>\n              </th>\n          </tr>\n      </thead>\n\n      <tbody>\n          <tr class=\"divide-x divide-neutral-base\" *ngIf=\"hasFilters()\">\n              <td *ngIf=\"hasCheckboxes\" [ngClass]=\"checkboxClasses\"></td>\n              <td tabindex=\"-1\" *ngFor=\"let item of getHeaderCells(); index as iHead\" desyFocusClickedCell\n                  [class]=\"['align-top px-base pb-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\">\n                  <ng-container *ngIf=\"item.hasSelect && getSelectForItem(item) !== null\">\n                    <ng-container *ngTemplateOutlet=\"tableSelect; context: {selectable: getSelectForItem(item)}\"></ng-container>\n                    <ng-template #tableSelect let-selectable=\"selectable\">\n                      <desy-select [id]=\"getIdHeaderSelect(iHead)\"\n                        [labelData]=\"{ text: 'Filtrar por esta columna', classes: 'sr-only' }\"\n                        [classes]=\"selectable.classes ? selectable.classes : 'c-select--sm w-full'\"\n                        [formGroupClasses]=\"selectable.formGroupClasses ? selectable.formGroupClasses : '-mt-sm mb-0'\"\n                        [name]=\"selectable.name\"\n                        [items]=\"getItemSelectOptions(selectable)\"\n                        [disabled]=\"selectable.disabled\"\n                        [describedBy]=\"getIdHeaderSelect(iHead)\"\n\n                        [(ngModel)]=\"item.valueSelect\" (ngModelChange)=\"handleInputSearch(item)\"\n\n                        [role]=\"selectable.role\"\n                        [ariaLabel]=\"selectable.ariaLabel\"\n                        [ariaDescribedBy]=\"selectable.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"selectable.ariaLabelledBy\"\n                        [ariaHidden]=\"selectable.ariaHidden\"\n                        [ariaDisabled]=\"selectable.ariaDisabled\"\n                        [ariaControls]=\"selectable.ariaControls\"\n                        [ariaCurrent]=\"selectable.ariaCurrent\"\n                        [ariaLive]=\"selectable.ariaLive\"\n                        [ariaExpanded]=\"selectable.ariaExpanded\"\n                        [ariaErrorMessage]=\"selectable.ariaErrorMessage\"\n                        [ariaHasPopup]=\"selectable.ariaHasPopup\"\n                        [tabindex]=\"selectable.tabindex\">\n                      </desy-select>\n                    </ng-template>\n                  </ng-container>\n\n                  <div *ngIf=\"item.hasSelect && item.hasFilter\" class=\"pb-sm\"></div>\n\n                  <desy-search-bar *ngIf=\"item.hasFilter\"\n                                   [(ngModel)]=\"item.valueFilter\" [ngModelOptions]=\"{standalone: true}\"\n                                   (clickEvent)=\"handleInputSearch(item)\"\n                                   (ngModelChange)=\"handleInputSearch(item)\"\n                                   labelText=\"Buscar en esta columna\"\n                                   [id]=\"getIdHeaderFilter(iHead)\"\n                                   placeholder=\"Buscar\"\n                                   [classes]=\"['c-input--sm', item.filterClasses] | makeHtmlList\"\n                                   buttonClasses=\"m-xs p-0.5 text-xs\"\n                                   [describedBy]=\"getIdHeader(iHead)\"> </desy-search-bar>\n              </td>\n          </tr>\n\n\n          <tr *ngFor=\"let row of getVisibleRows(); index as iRow\" class=\"border-t border-b border-neutral-base hover:bg-neutral-lighter\"\n              [desyRow]=\"row\">\n              <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n                  tabindex=\"-1\" >\n                <div class=\"c-checkboxes c-checkboxes--sm\">\n                  <div>\n                    <div class=\"relative flex items-start\">\n                      <div class=\"flex items-center mx-sm\">\n                        <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                               [(ngModel)]=\"row.checked\" (ngModelChange)=\"handleCheckboxChange(row)\"\n                               [id]=\"getIdRowCheckbox(iRow)\"\n                               [name]=\"getIdRowCheckbox(iRow)\">\n                      </div>\n                      <div class=\"pt-0.5 leading-5\">\n                        <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iRow)\">Selecciona fila {{ iRow }}</label>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </td>\n              <ng-container *ngFor=\"let cell of row.cellsList; first as isFirstCell; index as columnIndex\">\n                  <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                      [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                      desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </th>\n                  <ng-template #elseTd>\n                      <td tabindex=\"-1\" desyFocusClickedCell\n                          [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                          desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                          [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                          [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                          [attr.id]=\"cell.id ? cell.id : null\"\n                          [desyAppAccessibility]=\"cell\"\n                          [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                        <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                      </td>\n                  </ng-template>\n              </ng-container>\n          </tr>\n      </tbody>\n      \n      <tfoot *ngIf=\"getFooterCells()\">\n         <tr *ngFor=\"let foot of getFooterCells(); index as iFooter\" class=\"border-t-2 border-b border-neutral-base hover:bg-neutral-lighter\">\n           <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n               tabindex=\"-1\">\n             <div class=\"c-checkboxes c-checkboxes--sm\">\n               <div>\n                 <div class=\"relative flex items-start\">\n                   <div class=\"flex items-center mx-sm\">\n                     <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                            [(ngModel)]=\"foot.checked\" (ngModelChange)=\"handleCheckboxChange(foot)\"\n                            [id]=\"getIdRowCheckbox(iFooter)\"\n                            [name]=\"getIdRowCheckbox(iFooter)\">\n                   </div>\n                   <div class=\"pt-0.5 leading-5\">\n                     <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iFooter)\">Selecciona fila {{ iFooter }}</label>\n                   </div>\n                 </div>\n               </div>\n             </div>\n           </td>\n           <ng-container *ngFor=\"let cell of foot.cellsList; first as isFirstCell; index as columnIndex\">\n               <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                   [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                   desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                   [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                   [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                   [attr.id]=\"cell.id ? cell.id : null\"\n                   [desyAppAccessibility]=\"cell\">\n                 <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n               </th>\n               <ng-template #elseTd>\n                   <td tabindex=\"-1\" desyFocusClickedCell\n                       [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                       desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                       [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                       [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                       [attr.id]=\"cell.id ? cell.id : null\"\n                       [desyAppAccessibility]=\"cell\"\n                       [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                     <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                   </td>\n               </ng-template>\n           </ng-container>\n       </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n" }]
+            args: [{ selector: 'desy-table-advanced', template: "<ng-template #tableContent>\n  <table role=\"grid\"\n          [class]=\"['c-table-advanced border-t-2 border-b-2 border-neutral-base', classes] | makeHtmlList\"\n          [attr.id]=\"id ? id : null\"\n          [desyAppAccessibility]=\"this\">\n      <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n        <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n      </caption>\n      <thead *ngIf=\"getHeaderCells()\">\n          <tr class=\"border-t border-neutral-base divide-x divide-neutral-base\">\n              <th *ngIf=\"hasCheckboxes\" scope=\"col\" [class]=\"['align-top px-base py-xs', 'w-16', checkboxClasses] | makeHtmlList\">\n                  <span class=\"sr-only\">Seleccionar fila</span>\n              </th>\n              <th scope=\"col\" *ngFor=\"let item of getHeaderCells(); index as iHeader\" [id]=\"getIdHeader(iHeader)\"\n                      [attr.aria-sort]=\"item.orderBy ? getStringOrderBy(item.orderBy) : null\"\n                      [class]=\"['align-top px-base py-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\"\n                      [attr.colspan]=\"item.colspan ? item.colspan  : null\"\n                      [attr.rowspan]=\"item.rowspan ? item.rowspan  : null\"\n                      [desyAppAccessibility]=\"item\">\n\n                  <span *ngIf=\"item.orderBy\" class=\"inline-block relative\" (click)=\"handleSortByColumn(iHeader,$event)\" (keydown.enter)=\"handleSortByColumn(iHeader,$event)\" (keydown.space)=\"handleSortByColumn(iHeader,$event)\" desyFocusClickedCell\n                        [attr.tabindex]=\"item.orderBy ? -1 : null\"\n                        [attr.role]=\"item.orderBy ? 'button' : null\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                    <span class=\"c-table-advanced__order\" *ngIf=\"item.orderBy\">\n                        <span class=\"sr-only\">Pulsa para ordenar por esta columna</span>\n                        <span class=\"c-table-advanced__ascending\" *ngIf=\"item.orderBy === orderByType.asc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M112.07 37.93l-35-35a10 10 0 00-14.14 0l-35 35a10 10 0 0014.14 14.14l13.66-13.66A2.5 2.5 0 0160 40.18V130a10 10 0 0020 0V40.18a2.5 2.5 0 014.27-1.77l13.66 13.66a10 10 0 0014.14-14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__descending\" *ngIf=\"item.orderBy === orderByType.desc\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M27.93 102.07l35 35a10 10 0 0014.14 0l35-35a10 10 0 00-14.14-14.14l-13.66 13.66A2.5 2.5 0 0180 99.82V10a10 10 0 00-20 0v89.82a2.5 2.5 0 01-4.27 1.77L42.07 87.93a10 10 0 00-14.14 14.14z\" fill=\"currentColor\"/></svg>\n                        </span>\n                        <span class=\"c-table-advanced__none\"  *ngIf=\"item.orderBy === orderByType.none\">\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 140 140\" class=\"text-neutral-dark\" aria-hidden=\"true\" width=\"1em\" height=\"1em\"><path d=\"M94.7 97.2l-17.2 17.19V25.61L94.7 42.8a7.5 7.5 0 0010.6-10.6l-30-30a7.49 7.49 0 00-10.6 0l-30 30a7.5 7.5 0 0010.6 10.6l17.2-17.19v88.78L45.3 97.2a7.5 7.5 0 10-10.6 10.6l30 30a7.48 7.48 0 0010.6 0l30-30a7.5 7.5 0 00-10.6-10.6z\" fill=\"currentColor\"/></svg>\n                        </span>\n                    </span>\n                  </span>\n\n                  <span *ngIf=\"!item.orderBy\" class=\"inline-block relative\">\n                    <ng-container *ngIf=\"item.text\">{{item.text}}</ng-container>\n                    <ng-container *ngIf=\"item.contentComponent\">\n                      <ng-container *desyCustomInnerContent=\"{ component: item.contentComponent }\"></ng-container>\n                    </ng-container>\n                  </span>\n              </th>\n          </tr>\n      </thead>\n\n      <tbody>\n          <tr class=\"divide-x divide-neutral-base\" *ngIf=\"hasFilters()\">\n              <td *ngIf=\"hasCheckboxes\" [ngClass]=\"checkboxClasses\"></td>\n              <td tabindex=\"-1\" *ngFor=\"let item of getHeaderCells(); index as iHead\" desyFocusClickedCell\n                  [class]=\"['align-top px-base pb-sm border-neutral-base border-b-0 text-left text-sm font-normal text-neutral-dark', item.classes] | makeHtmlList\">\n                  <ng-container *ngIf=\"item.hasSelect && getSelectForItem(item) !== null\">\n                    <ng-container *ngTemplateOutlet=\"tableSelect; context: {selectable: getSelectForItem(item)}\"></ng-container>\n                    <ng-template #tableSelect let-selectable=\"selectable\">\n                      <desy-select [id]=\"getIdHeaderSelect(iHead)\"\n                        [labelData]=\"{ text: 'Filtrar por esta columna', classes: 'sr-only' }\"\n                        [classes]=\"selectable.classes ? selectable.classes : 'c-select--sm w-full'\"\n                        [formGroupClasses]=\"selectable.formGroupClasses ? selectable.formGroupClasses : '-mt-sm mb-0'\"\n                        [name]=\"selectable.name\"\n                        [items]=\"getItemSelectOptions(selectable)\"\n                        [disabled]=\"selectable.disabled\"\n                        [describedBy]=\"getIdHeaderSelect(iHead)\"\n\n                        [(ngModel)]=\"item.valueSelect\" (ngModelChange)=\"handleInputSearch(item)\"\n\n                        [role]=\"selectable.role\"\n                        [ariaLabel]=\"selectable.ariaLabel\"\n                        [ariaDescribedBy]=\"selectable.ariaDescribedBy\"\n                        [ariaLabelledBy]=\"selectable.ariaLabelledBy\"\n                        [ariaHidden]=\"selectable.ariaHidden\"\n                        [ariaDisabled]=\"selectable.ariaDisabled\"\n                        [ariaControls]=\"selectable.ariaControls\"\n                        [ariaCurrent]=\"selectable.ariaCurrent\"\n                        [ariaLive]=\"selectable.ariaLive\"\n                        [ariaExpanded]=\"selectable.ariaExpanded\"\n                        [ariaErrorMessage]=\"selectable.ariaErrorMessage\"\n                        [ariaHasPopup]=\"selectable.ariaHasPopup\"\n                        [tabindex]=\"selectable.tabindex\">\n                      </desy-select>\n                    </ng-template>\n                  </ng-container>\n\n                  <div *ngIf=\"item.hasSelect && item.hasFilter\" class=\"pb-sm\"></div>\n\n                  <desy-search-bar *ngIf=\"item.hasFilter\"\n                                   [(ngModel)]=\"item.valueFilter\" [ngModelOptions]=\"{standalone: true}\"\n                                   (clickEvent)=\"handleInputSearch(item)\"\n                                   (ngModelChange)=\"handleInputSearch(item)\"\n                                   labelText=\"Buscar en esta columna\"\n                                   [id]=\"getIdHeaderFilter(iHead)\"\n                                   placeholder=\"Buscar\"\n                                   [classes]=\"['c-input--sm', item.filterClasses] | makeHtmlList\"\n                                   buttonClasses=\"m-xs p-0.5 text-xs\"\n                                   [describedBy]=\"getIdHeader(iHead)\"> </desy-search-bar>\n              </td>\n          </tr>\n\n\n          <tr *ngFor=\"let row of getVisibleRows(); index as iRow\" class=\"border-t border-b border-neutral-base hover:bg-neutral-lighter\"\n              [desyRow]=\"row\">\n              <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n                  tabindex=\"-1\" >\n                <div class=\"c-checkboxes c-checkboxes--sm\">\n                  <div>\n                    <div class=\"relative flex items-start\">\n                      <div class=\"flex items-center mx-sm\">\n                        <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                               [(ngModel)]=\"row.checked\" (ngModelChange)=\"handleCheckboxChange(row)\"\n                               [id]=\"getIdRowCheckbox(iRow)\"\n                               [name]=\"getIdRowCheckbox(iRow)\">\n                      </div>\n                      <div class=\"pt-0.5 leading-5\">\n                        <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iRow)\">Selecciona fila {{ iRow }}</label>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </td>\n              <ng-container *ngFor=\"let cell of row.cellsList; first as isFirstCell; index as columnIndex\">\n                  <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                      [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                      desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </th>\n                  <ng-template #elseTd>\n                      <td tabindex=\"-1\" desyFocusClickedCell\n                          [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                          desyCell [row]=\"row\" [rowIndex]=\"iRow\" [columnIndex]=\"columnIndex\"\n                          [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                          [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                          [attr.id]=\"cell.id ? cell.id : null\"\n                          [desyAppAccessibility]=\"cell\"\n                          [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                        <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                      </td>\n                  </ng-template>\n              </ng-container>\n          </tr>\n      </tbody>\n      \n      <tfoot *ngIf=\"getFooterCells()\">\n         <tr *ngFor=\"let foot of getFooterCells(); index as iFooter\" class=\"border-t-2 border-b border-neutral-base hover:bg-neutral-lighter\">\n           <td *ngIf=\"hasCheckboxes\" desyFocusClickedCell [class]=\"['px-base py-sm', checkboxClasses] | makeHtmlList\"\n               tabindex=\"-1\">\n             <div class=\"c-checkboxes c-checkboxes--sm\">\n               <div>\n                 <div class=\"relative flex items-start\">\n                   <div class=\"flex items-center mx-sm\">\n                     <input type=\"checkbox\" class=\"w-6 h-6 transition duration-150 ease-in-out border-black focus:border-black focus:shadow-outline-focus-input focus:ring-4 focus:ring-offset-0 focus:ring-warning-base disabled:bg-neutral-light disabled:border-neutral-base text-primary-base\"\n                            [(ngModel)]=\"foot.checked\" (ngModelChange)=\"handleCheckboxChange(foot)\"\n                            [id]=\"getIdRowCheckbox(iFooter)\"\n                            [name]=\"getIdRowCheckbox(iFooter)\">\n                   </div>\n                   <div class=\"pt-0.5 leading-5\">\n                     <label class=\"sr-only block text-sm -mt-1\" [for]=\"getIdRowCheckbox(iFooter)\">Selecciona fila {{ iFooter }}</label>\n                   </div>\n                 </div>\n               </div>\n             </div>\n           </td>\n           <ng-container *ngFor=\"let cell of foot.cellsList; first as isFirstCell; index as columnIndex\">\n               <th *ngIf=\"firstCellIsHeader && isFirstCell; else elseTd\" scope=\"row\"\n                   [class]=\"['px-base py-xs border-neutral-base border-b-0 border-r text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                   desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                   [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                   [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                   [attr.id]=\"cell.id ? cell.id : null\"\n                   [desyAppAccessibility]=\"cell\">\n                 <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n               </th>\n               <ng-template #elseTd>\n                   <td tabindex=\"-1\" desyFocusClickedCell\n                       [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                       desyCell [row]=\"row\" [rowIndex]=\"iFooter\" [columnIndex]=\"columnIndex\"\n                       [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                       [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                       [attr.id]=\"cell.id ? cell.id : null\"\n                       [desyAppAccessibility]=\"cell\"\n                       [attr.tabindex]=\"cell.tabindex ? cell.tabindex : -1\">\n                     <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                   </td>\n               </ng-template>\n           </ng-container>\n       </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { rows: [{
                 type: Input
             }], head: [{
@@ -10940,6 +11157,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             }] } });
 
 class TableComponent extends AccessibilityComponent {
+    constructor() {
+        super(...arguments);
+        this.extractedTexts = [];
+    }
+    handleContentExtracted(extractedText) {
+        this.extractedTexts.push(extractedText);
+    }
     getCaptionClass() {
         return this.captionComponent ? this.captionComponent.classes : this.captionClasses;
     }
@@ -10961,6 +11185,7 @@ class TableComponent extends AccessibilityComponent {
         else if (this.foot) {
             footCells = this.foot;
         }
+        this.assignExtractedTextsToCells(footCells);
         return footCells;
     }
     getRows() {
@@ -10974,10 +11199,22 @@ class TableComponent extends AccessibilityComponent {
         return rowList;
     }
     getRowCells(row) {
-        return row instanceof TableRowComponent ? row.cells.toArray() : row;
+        const cells = row instanceof TableRowComponent ? row.cells.toArray() : row;
+        this.assignExtractedTextsToCells(cells);
+        return cells;
+    }
+    assignExtractedTextsToCells(cells) {
+        let textIndex = 0;
+        cells.forEach(cell => {
+            if (this.extractedTexts[textIndex]) {
+                cell.header = this.extractedTexts[textIndex];
+            }
+            const colspan = cell.colspan || 1;
+            textIndex += colspan;
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, selector: "desy-table", inputs: { rows: "rows", head: "head", foot: "foot", caption: "caption", captionClasses: "captionClasses", firstCellIsHeader: "firstCellIsHeader", classes: "classes", id: "id", wrapper: "wrapper" }, queries: [{ propertyName: "captionComponent", predicate: TableCaptionComponent }, { propertyName: "headerComponent", predicate: TableHeaderComponent }, { propertyName: "footerComponent", predicate: TableFooterComponent }, { propertyName: "rowComponentList", predicate: TableRowComponent }], usesInheritance: true, ngImport: i0, template: "<ng-template #tableContent>\n  <table [class]=\"['c-table', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n    <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n      <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n    </caption>\n    <thead *ngIf=\"head || headerComponent\">\n      <tr class=\"border-t border-b border-neutral-base\">\n        <ng-container *ngFor=\"let headerCell of getHeaderCells()\">\n          <th scope=\"col\"\n              [class]=\"['align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', headerCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(headerCell.colspan ?  headerCell.colspan : null)\"\n              [attr.rowspan]=\"(headerCell.rowspan ? headerCell.rowspan : null)\"\n              [attr.id]=\"headerCell.id ? headerCell.id : null\"\n              [desyAppAccessibility]=\"headerCell\">\n            <ng-container *desyCustomInnerContent=\"{ component: headerCell, html: headerCell.html, text: headerCell.text }\"></ng-container>\n          </th>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let row of getRows(); index as rowIndex\" class=\"border-t border-b border-neutral-base\">\n          <ng-container *ngFor=\"let cell of getRowCells(row); first as isFirst; index as cellIndex\">\n              <th *ngIf=\"firstCellIsHeader && isFirst; else elseTd\" scope=\"row\"\n                  [class]=\"['align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                  [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                  [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                  [attr.id]=\"cell.id ? cell.id : null\"\n                  [desyAppAccessibility]=\"cell\">\n                <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n              </th>\n              <ng-template #elseTd>\n                  <td [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </td>\n              </ng-template>\n          </ng-container>\n      </tr>\n    </tbody>\n    <tfoot *ngIf=\"foot || footerComponent\">\n      <tr class=\"border-t-2 border-b border-neutral-base\">\n        <ng-container *ngFor=\"let footCell of getFooterCells()\">\n          <td scope=\"col\"\n              [class]=\"['px-base py-sm', footCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(footCell.colspan ?  footCell.colspan : null)\"\n              [attr.rowspan]=\"(footCell.rowspan ? footCell.rowspan : null)\"\n              [attr.id]=\"footCell.id ? footCell.id : null\"\n              [desyAppAccessibility]=\"footCell\">\n            <ng-container *desyCustomInnerContent=\"{ component: footCell, html: footCell.html, text: footCell.text }\"></ng-container>\n          </td>\n        </ng-container>\n      </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, selector: "desy-table", inputs: { rows: "rows", head: "head", foot: "foot", caption: "caption", captionClasses: "captionClasses", firstCellIsHeader: "firstCellIsHeader", classes: "classes", id: "id", wrapper: "wrapper" }, queries: [{ propertyName: "captionComponent", predicate: TableCaptionComponent }, { propertyName: "headerComponent", predicate: TableHeaderComponent }, { propertyName: "footerComponent", predicate: TableFooterComponent }, { propertyName: "rowComponentList", predicate: TableRowComponent }], usesInheritance: true, ngImport: i0, template: "<ng-template #tableContent>\n  <table [class]=\"['c-table', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n    <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n      <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n    </caption>\n    <thead *ngIf=\"head || headerComponent\" class=\"sr-only lg:not-sr-only\">\n      <tr class=\"border-t border-b border-neutral-base\">\n        <ng-container *ngFor=\"let headerCell of getHeaderCells()\">\n          <th scope=\"col\"\n              [class]=\"['align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', headerCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(headerCell.colspan ?  headerCell.colspan : null)\"\n              [attr.rowspan]=\"(headerCell.rowspan ? headerCell.rowspan : null)\"\n              [attr.id]=\"headerCell.id ? headerCell.id : null\"\n              [desyAppAccessibility]=\"headerCell\">\n              <ng-container *desyCustomInnerContent=\"{ component: headerCell, html: headerCell.html, text: headerCell.text, parentComponent: this }\"></ng-container>\n          </th>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let row of getRows(); index as rowIndex\" class=\"block lg:table-row -mb-px lg:mb-0 text-left border-t border-b border-neutral-base\">\n          <ng-container *ngFor=\"let cell of getRowCells(row); first as isFirst; index as cellIndex\">\n              <th *ngIf=\"firstCellIsHeader && isFirst; else elseTd\" scope=\"row\"\n                  [class]=\"['block lg:table-cell before:block before:text-neutral-dark before:lg:hidden before:content-[attr(data-label)] before:text-sm align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                  [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                  [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                  [attr.id]=\"cell.id ? cell.id : null\"\n                  [attr.data-label]=\"cell.header\"\n                  [desyAppAccessibility]=\"cell\">\n                <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n              </th>\n              <ng-template #elseTd>\n                  <td [class]=\"['block lg:table-cell text-left before:block before:text-neutral-dark before:lg:hidden before:content-[attr(data-label)] before:text-sm px-base py-sm', cell.classes] | makeHtmlList\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [attr.data-label]=\"cell.header\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </td>\n              </ng-template>\n          </ng-container>\n      </tr>\n    </tbody>\n    <tfoot *ngIf=\"foot || footerComponent\">\n      <tr class=\"border-t-2 border-b border-neutral-base\">\n        <ng-container *ngFor=\"let footCell of getFooterCells()\">\n          <td scope=\"col\"\n              [class]=\"['block lg:table-cell text-left before:block before:text-neutral-dark before:lg:hidden before:content-[attr(data-label)] before:text-sm px-base py-sm', footCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(footCell.colspan ?  footCell.colspan : null)\"\n              [attr.rowspan]=\"(footCell.rowspan ? footCell.rowspan : null)\"\n              [attr.id]=\"footCell.id ? footCell.id : null\"\n              [attr.data-label]=\"footCell.header\"\n              [desyAppAccessibility]=\"footCell\">\n            <ng-container *desyCustomInnerContent=\"{ component: footCell, html: footCell.html, text: footCell.text }\"></ng-container>\n          </td>\n        </ng-container>\n      </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
 }
 __decorate([
     DesyContentChild(),
@@ -10993,7 +11230,7 @@ __decorate([
 ], TableComponent.prototype, "footerComponent", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-table', template: "<ng-template #tableContent>\n  <table [class]=\"['c-table', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n    <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n      <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n    </caption>\n    <thead *ngIf=\"head || headerComponent\">\n      <tr class=\"border-t border-b border-neutral-base\">\n        <ng-container *ngFor=\"let headerCell of getHeaderCells()\">\n          <th scope=\"col\"\n              [class]=\"['align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', headerCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(headerCell.colspan ?  headerCell.colspan : null)\"\n              [attr.rowspan]=\"(headerCell.rowspan ? headerCell.rowspan : null)\"\n              [attr.id]=\"headerCell.id ? headerCell.id : null\"\n              [desyAppAccessibility]=\"headerCell\">\n            <ng-container *desyCustomInnerContent=\"{ component: headerCell, html: headerCell.html, text: headerCell.text }\"></ng-container>\n          </th>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let row of getRows(); index as rowIndex\" class=\"border-t border-b border-neutral-base\">\n          <ng-container *ngFor=\"let cell of getRowCells(row); first as isFirst; index as cellIndex\">\n              <th *ngIf=\"firstCellIsHeader && isFirst; else elseTd\" scope=\"row\"\n                  [class]=\"['align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                  [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                  [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                  [attr.id]=\"cell.id ? cell.id : null\"\n                  [desyAppAccessibility]=\"cell\">\n                <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n              </th>\n              <ng-template #elseTd>\n                  <td [class]=\"['px-base py-sm', cell.classes] | makeHtmlList\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </td>\n              </ng-template>\n          </ng-container>\n      </tr>\n    </tbody>\n    <tfoot *ngIf=\"foot || footerComponent\">\n      <tr class=\"border-t-2 border-b border-neutral-base\">\n        <ng-container *ngFor=\"let footCell of getFooterCells()\">\n          <td scope=\"col\"\n              [class]=\"['px-base py-sm', footCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(footCell.colspan ?  footCell.colspan : null)\"\n              [attr.rowspan]=\"(footCell.rowspan ? footCell.rowspan : null)\"\n              [attr.id]=\"footCell.id ? footCell.id : null\"\n              [desyAppAccessibility]=\"footCell\">\n            <ng-container *desyCustomInnerContent=\"{ component: footCell, html: footCell.html, text: footCell.text }\"></ng-container>\n          </td>\n        </ng-container>\n      </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n" }]
+            args: [{ selector: 'desy-table', template: "<ng-template #tableContent>\n  <table [class]=\"['c-table', classes] | makeHtmlList\"\n         [attr.id]=\"id ? id : null\"\n         [desyAppAccessibility]=\"this\">\n    <caption *ngIf=\"caption || captionComponent\" [class]=\"getCaptionClass()\">\n      <ng-container *desyCustomInnerContent=\"{ component: captionComponent, text: caption ? caption : null }\"></ng-container>\n    </caption>\n    <thead *ngIf=\"head || headerComponent\" class=\"sr-only lg:not-sr-only\">\n      <tr class=\"border-t border-b border-neutral-base\">\n        <ng-container *ngFor=\"let headerCell of getHeaderCells()\">\n          <th scope=\"col\"\n              [class]=\"['align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', headerCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(headerCell.colspan ?  headerCell.colspan : null)\"\n              [attr.rowspan]=\"(headerCell.rowspan ? headerCell.rowspan : null)\"\n              [attr.id]=\"headerCell.id ? headerCell.id : null\"\n              [desyAppAccessibility]=\"headerCell\">\n              <ng-container *desyCustomInnerContent=\"{ component: headerCell, html: headerCell.html, text: headerCell.text, parentComponent: this }\"></ng-container>\n          </th>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let row of getRows(); index as rowIndex\" class=\"block lg:table-row -mb-px lg:mb-0 text-left border-t border-b border-neutral-base\">\n          <ng-container *ngFor=\"let cell of getRowCells(row); first as isFirst; index as cellIndex\">\n              <th *ngIf=\"firstCellIsHeader && isFirst; else elseTd\" scope=\"row\"\n                  [class]=\"['block lg:table-cell before:block before:text-neutral-dark before:lg:hidden before:content-[attr(data-label)] before:text-sm align-top px-base py-sm text-left font-normal text-sm text-neutral-dark', cell.classes] | makeHtmlList\"\n                  [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                  [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                  [attr.id]=\"cell.id ? cell.id : null\"\n                  [attr.data-label]=\"cell.header\"\n                  [desyAppAccessibility]=\"cell\">\n                <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n              </th>\n              <ng-template #elseTd>\n                  <td [class]=\"['block lg:table-cell text-left before:block before:text-neutral-dark before:lg:hidden before:content-[attr(data-label)] before:text-sm px-base py-sm', cell.classes] | makeHtmlList\"\n                      [attr.colspan]=\"cell.colspan ? cell.colspan  : null\"\n                      [attr.rowspan]=\"cell.rowspan ? cell.rowspan  : null\"\n                      [attr.id]=\"cell.id ? cell.id : null\"\n                      [attr.data-label]=\"cell.header\"\n                      [desyAppAccessibility]=\"cell\">\n                    <ng-container *desyCustomInnerContent=\"{ component: cell, html: cell.html, text: cell.text }\"></ng-container>\n                  </td>\n              </ng-template>\n          </ng-container>\n      </tr>\n    </tbody>\n    <tfoot *ngIf=\"foot || footerComponent\">\n      <tr class=\"border-t-2 border-b border-neutral-base\">\n        <ng-container *ngFor=\"let footCell of getFooterCells()\">\n          <td scope=\"col\"\n              [class]=\"['block lg:table-cell text-left before:block before:text-neutral-dark before:lg:hidden before:content-[attr(data-label)] before:text-sm px-base py-sm', footCell.classes] | makeHtmlList\"\n              [attr.colspan]=\"(footCell.colspan ?  footCell.colspan : null)\"\n              [attr.rowspan]=\"(footCell.rowspan ? footCell.rowspan : null)\"\n              [attr.id]=\"footCell.id ? footCell.id : null\"\n              [attr.data-label]=\"footCell.header\"\n              [desyAppAccessibility]=\"footCell\">\n            <ng-container *desyCustomInnerContent=\"{ component: footCell, html: footCell.html, text: footCell.text }\"></ng-container>\n          </td>\n        </ng-container>\n      </tr>\n    </tfoot>\n  </table>\n</ng-template>\n\n<div *ngIf=\"wrapper; else tableContent\" [class]=\"wrapper.classes\">\n  <ng-container *ngTemplateOutlet=\"tableContent\"></ng-container>\n</div>\n" }]
         }], propDecorators: { rows: [{
                 type: Input
             }], head: [{
@@ -11828,7 +12065,7 @@ class CollapsibleComponent extends AccessibilityAndContentRequiredComponent {
         this.toggleOpen();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapsibleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CollapsibleComponent, selector: "desy-collapsible", inputs: { headerText: "headerText", headerHtml: "headerHtml", id: "id", open: "open", classes: "classes" }, queries: [{ propertyName: "contentComponent", predicate: ContentComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"(classes ? classes : '-my-px py-sm border-t border-b border-neutral-base')\"\n    [desyAppAccessibility]=\"this\">\n    <button *ngIf=\"headerText && !headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        class=\"group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\" \n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">{{ headerText }}\n        <span class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        class=\"group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\" \n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\"><ng-container *ngTemplateOutlet=\"tmpHtml\"></ng-container>\n        <span class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"!headerHtml && !headerText\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        class=\"group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\" \n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">\n        <ng-content></ng-content>\n        <span class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    \n    <div *ngIf=\"open && !html && !text\" [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <ng-container *desyCustomInnerContent=\"{ component: contentComponent }\"></ng-container>\n    </div>\n    <div *ngIf=\"open && html\" [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <ng-container *ngTemplateOutlet=\"htmlTemplate\"></ng-container>\n    </div>\n    <div *ngIf=\"open && !html\" [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <p [desyInnerContent]=\"text\"></p>\n    </div>\n</div>\n<ng-template #tmpHtml>\n    <div [outerHTML]=\"headerHtml | innerHtml\"></div>  \n </ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: InnerHtmlPipe, name: "innerHtml" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CollapsibleComponent, selector: "desy-collapsible", inputs: { headerText: "headerText", headerHtml: "headerHtml", id: "id", open: "open", classes: "classes", buttonClasses: "buttonClasses", showClasses: "showClasses", hideClasses: "hideClasses", contentClasses: "contentClasses" }, queries: [{ propertyName: "contentComponent", predicate: ContentComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"(classes ? classes : '-my-px py-sm border-t border-b border-neutral-base')\"\n    [desyAppAccessibility]=\"this\">\n    <button *ngIf=\"headerText && !headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        [ngClass]=\"buttonClasses ? buttonClasses : 'group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black'\"\n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">{{ headerText }}\n        <span [ngClass]=\"open && hideClasses ? hideClasses : showClasses && !open ? showClasses: 'absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none'\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        [ngClass]=\"buttonClasses ? buttonClasses : 'group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black'\"\n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\"><ng-container *ngTemplateOutlet=\"tmpHtml\"></ng-container>\n        <span [ngClass]=\"open && hideClasses ? hideClasses : showClasses && !open ? showClasses: 'absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none'\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"!headerHtml && !headerText\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        [ngClass]=\"buttonClasses ? buttonClasses : 'group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black'\"\n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">\n        <ng-content></ng-content>\n        <span [ngClass]=\"open && hideClasses ? hideClasses : showClasses && !open ? showClasses: 'absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none'\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    \n    <div *ngIf=\"open && !html && !text\" [attr.id]=\"(id ? id : null)\" [ngClass]=\"contentClasses ? contentClasses : 'py-sm'\">\n        <ng-container *desyCustomInnerContent=\"{ component: contentComponent }\"></ng-container>\n    </div>\n    <div *ngIf=\"open && html\" [attr.id]=\"(id ? id : null)\" [ngClass]=\"contentClasses ? contentClasses : 'py-sm'\">\n        <ng-container *ngTemplateOutlet=\"htmlTemplate\"></ng-container>\n    </div>\n    <div *ngIf=\"open && !html\" [attr.id]=\"(id ? id : null)\" [ngClass]=\"contentClasses ? contentClasses : 'py-sm'\">\n        <p [desyInnerContent]=\"text\"></p>\n    </div>\n</div>\n<ng-template #tmpHtml>\n    <div [outerHTML]=\"headerHtml | innerHtml\"></div>  \n </ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "pipe", type: InnerHtmlPipe, name: "innerHtml" }] }); }
 }
 __decorate([
     DesyContentChild(),
@@ -11836,7 +12073,7 @@ __decorate([
 ], CollapsibleComponent.prototype, "contentComponent", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapsibleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-collapsible', template: "<div [class]=\"(classes ? classes : '-my-px py-sm border-t border-b border-neutral-base')\"\n    [desyAppAccessibility]=\"this\">\n    <button *ngIf=\"headerText && !headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        class=\"group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\" \n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">{{ headerText }}\n        <span class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        class=\"group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\" \n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\"><ng-container *ngTemplateOutlet=\"tmpHtml\"></ng-container>\n        <span class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"!headerHtml && !headerText\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        class=\"group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\" \n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">\n        <ng-content></ng-content>\n        <span class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    \n    <div *ngIf=\"open && !html && !text\" [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <ng-container *desyCustomInnerContent=\"{ component: contentComponent }\"></ng-container>\n    </div>\n    <div *ngIf=\"open && html\" [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <ng-container *ngTemplateOutlet=\"htmlTemplate\"></ng-container>\n    </div>\n    <div *ngIf=\"open && !html\" [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <p [desyInnerContent]=\"text\"></p>\n    </div>\n</div>\n<ng-template #tmpHtml>\n    <div [outerHTML]=\"headerHtml | innerHtml\"></div>  \n </ng-template>\n" }]
+            args: [{ selector: 'desy-collapsible', template: "<div [class]=\"(classes ? classes : '-my-px py-sm border-t border-b border-neutral-base')\"\n    [desyAppAccessibility]=\"this\">\n    <button *ngIf=\"headerText && !headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        [ngClass]=\"buttonClasses ? buttonClasses : 'group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black'\"\n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">{{ headerText }}\n        <span [ngClass]=\"open && hideClasses ? hideClasses : showClasses && !open ? showClasses: 'absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none'\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"headerHtml\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        [ngClass]=\"buttonClasses ? buttonClasses : 'group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black'\"\n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\"><ng-container *ngTemplateOutlet=\"tmpHtml\"></ng-container>\n        <span [ngClass]=\"open && hideClasses ? hideClasses : showClasses && !open ? showClasses: 'absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none'\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    <button *ngIf=\"!headerHtml && !headerText\" (click)=\"isOpen()\" [attr.id]=\"id ? (id + '-title') : null\"\n        [ngClass]=\"buttonClasses ? buttonClasses : 'group relative w-full py-sm font-semibold text-left cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black'\"\n        [attr.aria-expanded]=\"open\"\n        [attr.aria-controls]=\"id ? id : null\">\n        <ng-content></ng-content>\n        <span [ngClass]=\"open && hideClasses ? hideClasses : showClasses && !open ? showClasses: 'absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none'\" aria-hidden=\"true\">{{show}}</span>\n    </button>\n    \n    <div *ngIf=\"open && !html && !text\" [attr.id]=\"(id ? id : null)\" [ngClass]=\"contentClasses ? contentClasses : 'py-sm'\">\n        <ng-container *desyCustomInnerContent=\"{ component: contentComponent }\"></ng-container>\n    </div>\n    <div *ngIf=\"open && html\" [attr.id]=\"(id ? id : null)\" [ngClass]=\"contentClasses ? contentClasses : 'py-sm'\">\n        <ng-container *ngTemplateOutlet=\"htmlTemplate\"></ng-container>\n    </div>\n    <div *ngIf=\"open && !html\" [attr.id]=\"(id ? id : null)\" [ngClass]=\"contentClasses ? contentClasses : 'py-sm'\">\n        <p [desyInnerContent]=\"text\"></p>\n    </div>\n</div>\n<ng-template #tmpHtml>\n    <div [outerHTML]=\"headerHtml | innerHtml\"></div>  \n </ng-template>\n" }]
         }], propDecorators: { headerText: [{
                 type: Input
             }], headerHtml: [{
@@ -11847,6 +12084,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], classes: [{
                 type: Input
+            }], buttonClasses: [{
+                type: Input
+            }], showClasses: [{
+                type: Input
+            }], hideClasses: [{
+                type: Input
+            }], contentClasses: [{
+                type: Input
             }], contentComponent: [{
                 type: ContentChildren,
                 args: [ContentComponent]
@@ -14338,12 +14583,13 @@ class PaginationComponent extends AccessibilityComponent {
             const itemList = [];
             for (let i = 0; i < this.nPages; i++) {
                 const item = {
+                    value: i + 1,
                     text: i + 1,
-                    active: ((i + 1) === this.currentPage),
-                    routerLink: []
+                    selected: ((i + 1) === this.currentPage)
                 };
                 itemList.push(item);
             }
+            this.value = this.currentPage;
             this.items = itemList;
         }
     }
@@ -14361,7 +14607,8 @@ class PaginationComponent extends AccessibilityComponent {
         }
         for (let i = 0; i < this.items.length; i++) {
             const item = this.items[i];
-            item.active = ((i + 1) === this.currentPage);
+            item.selected = ((i + 1) === this.currentPage);
+            this.value = this.currentPage;
         }
     }
     previous() {
@@ -14384,16 +14631,12 @@ class PaginationComponent extends AccessibilityComponent {
             this.changePage(this.nPages);
         }
     }
-    getActiveItemText() {
-        const activeItems = this.items.filter(item => item.active);
-        return activeItems && activeItems.length > 0 ? activeItems[0].text : '';
-    }
     getListboxLabel() {
         return this.listboxLabel ? this.listboxLabel : null;
     }
     changeItemsPerPage(event) {
-        if (event && event.value) {
-            let newValue = event.value;
+        if (event) {
+            let newValue = event;
             this.itemsPerPage = newValue;
             this.checkChanges();
             this.itemsPerPageChange.emit(newValue);
@@ -14402,7 +14645,7 @@ class PaginationComponent extends AccessibilityComponent {
     }
     handleActiveItemChange(event) {
         if (event !== null && event !== undefined) {
-            this.changePage(+event.text);
+            this.changePage(event);
         }
     }
     setupItemsPerPage() {
@@ -14410,17 +14653,17 @@ class PaginationComponent extends AccessibilityComponent {
         if (this.itemsPerPageList) {
             const currentItemsPerPageItem = this.itemsPerPageList.find(i => i.value === this.itemsPerPage);
             if (currentItemsPerPageItem) {
-                currentItemsPerPageItem.active = true;
+                currentItemsPerPageItem.selected = true;
             }
-            const hasActive = this.itemsPerPageList.find(i => i.active);
+            const hasActive = this.itemsPerPageList.find(i => i.selected);
             if (!hasActive && this.itemsPerPageList.length > 0) {
-                this.itemsPerPageList[0].active = true;
+                this.itemsPerPageList[0].selected = true;
             }
             this.changeDetector.detectChanges();
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PaginationComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PaginationComponent, selector: "desy-pagination", inputs: { hasSelect: "hasSelect", idPrefix: "idPrefix", totalItems: "totalItems", hasPrevious: "hasPrevious", hasNext: "hasNext", hasFirst: "hasFirst", hasLast: "hasLast", showPrevious: "showPrevious", showNext: "showNext", showFirst: "showFirst", showLast: "showLast", previousText: "previousText", nextText: "nextText", firstText: "firstText", lastText: "lastText", hasSelectItemsPerPage: "hasSelectItemsPerPage", classes: "classes", classesContainer: "classesContainer", id: "id", currentPage: "currentPage", itemsPerPage: "itemsPerPage" }, outputs: { currentPageChange: "currentPageChange", itemsPerPageChange: "itemsPerPageChange" }, host: { properties: { "class": "this.classesContainer", "attr.id": "this.id" } }, queries: [{ propertyName: "listboxLabel", predicate: PaginationListboxLabelComponent }, { propertyName: "listboxItemsPerPage", predicate: PaginationItemPerPageComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"hasSelect\">\n  <p class=\"w-full mb-xs text-sm text-neutral-dark\">\n    Selecciona una p\u00E1gina para cargar datos\n  </p>\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <desy-button *ngIf=\"showFirst\" (clickEvent)=\"first()\" [id]=\"getIdPrefix() + '-first'\"\n                  [html]=\"firstIcon + prefix + firstText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasFirst\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n    <desy-button *ngIf=\"showPrevious\" (clickEvent)=\"previous()\" [id]=\"getIdPrefix() + '-previous'\"\n                  [html]=\"previousIcon + prefix + previousText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasPrevious\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n    <div class=\"flex flex-wrap items-center pl-sm\"\n          [ngClass]=\"{'w-full lg:w-auto': showFirst || showLast}\">\n      <p *ngIf=\"showFirst || showLast\" class=\"lg:hidden mr-xs text-sm text-neutral-dark\">P\u00E1gina actual:</p>\n          <desy-listbox *ngIf=\"items && items.length > 0\" [id]=\"id + '-listbox'\"\n            [idPrefix]=\"idPrefix\"\n            [text]=\"getActiveItemText()\"\n            [classes]=\"'c-listbox--sm c-listbox--transparent mr-xs'\"\n            [classesTooltip]=\"'max-h-52 overflow-y-auto'\"\n            [doesChangeButtonText]=\"true\"\n            [label]=\"{ text: 'Selecciona una p\u00E1gina para cargar datos', classes: 'sr-only' }\"\n            [(items)]=\"items\"\n            (activeItemChange)=\"handleActiveItemChange($event)\"></desy-listbox>\n    </div>\n    <desy-button *ngIf=\"showNext\" (clickEvent)=\"next()\" [id]=\"getIdPrefix() + '-next'\"\n                  [html]=\"prefix + nextText + getSuffix(currentPage) + nextIcon\" [disabled]=\"currentPage === nPages || !hasNext\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n    <desy-button *ngIf=\"showLast\" (clickEvent)=\"last()\" [id]=\"getIdPrefix() + '-last'\"\n                  [html]=\"prefix + lastText + getSuffix(currentPage) + lastIcon\" [disabled]=\"currentPage === nPages || !hasLast\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n  </nav>\n</ng-container>\n<ng-container *ngIf=\"!hasSelect\">\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <ul class=\"flex flex-wrap\">\n      <li *ngFor=\"let item of items; index as i\">\n        <desy-button *ngIf=\"item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"'<strong>' + prefix + (i + 1) + getSuffix(i,true) + '</strong>'\"\n                      classes=\"c-button--primary c-button--disabled mb-sm mr-sm\"\n                      [disabled]=\"true\" ariaCurrent=\"page\" tabindex=\"-1\" type=\"button\"></desy-button>\n        <desy-button *ngIf=\"!item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"prefix + (i + 1) + getSuffix(i,true)\"\n                      (clickEvent)=\"changePage(i + 1)\"\n                      classes=\"mb-sm mr-sm\" type=\"button\"></desy-button>\n      </li>\n    </ul>\n  </nav>\n</ng-container>\n  \n<div *ngIf=\"hasSelectItemsPerPage\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\">\n  <desy-listbox [classes]=\"'c-listbox--sm c-listbox--transparent'\" \n                [classesContainer]=\"'flex flex-wrap items-center gap-xs'\" \n                [id]=\"'items-listbox-' + getIdPrefix()\"\n                [doesChangeButtonText]=\"true\"\n                [items]=\"itemsPerPageList\"\n                (activeItemChange)=\"changeItemsPerPage($event)\">\n    <desy-listbox-label [classes]=\"listboxLabel && listboxLabel.classes ? listboxLabel.classes : 'inline-block align-middle mb-0'\">\n        <ng-container *ngIf=\"listboxLabel\">\n          <ng-container *desyCustomInnerContent=\"{ component: listboxLabel }\"></ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!listboxLabel\">\n          Items por p\u00E1gina\n        </ng-container>\n    </desy-listbox-label>\n  </desy-listbox>\n</div>\n\n\n<p role=\"status\" aria-live=\"polite\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\" *ngIf=\"totalItems && itemsPerPage\">\n  <span class=\"sr-only\">Posici\u00F3n de paginaci\u00F3n: </span>{{(currentPage - 1) * itemsPerPage + 1}} - {{getLastItemNumber(currentPage - 1)}} de {{totalItems}}\n</p>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: ButtonComponent, selector: "desy-button", inputs: ["id", "classes", "html", "text", "element", "name", "type", "value", "disabled", "href", "target", "preventDoubleClick", "fragment", "routerLink", "routerLinkActiveClasses"], outputs: ["clickEvent"] }, { kind: "component", type: ListboxComponent, selector: "desy-listbox", inputs: ["id", "isMultiselectable", "doesChangeButtonText", "label", "classes", "classesContainer", "classesTooltip", "idPrefix", "disabled", "items"], outputs: ["itemsChange", "activeItemChange"] }, { kind: "component", type: ListboxLabelComponent, selector: "desy-listbox-label", inputs: ["classes"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PaginationComponent, selector: "desy-pagination", inputs: { hasSelect: "hasSelect", idPrefix: "idPrefix", totalItems: "totalItems", hasPrevious: "hasPrevious", hasNext: "hasNext", hasFirst: "hasFirst", hasLast: "hasLast", showPrevious: "showPrevious", showNext: "showNext", showFirst: "showFirst", showLast: "showLast", previousText: "previousText", nextText: "nextText", firstText: "firstText", lastText: "lastText", hasSelectItemsPerPage: "hasSelectItemsPerPage", classes: "classes", classesContainer: "classesContainer", id: "id", currentPage: "currentPage", itemsPerPage: "itemsPerPage" }, outputs: { currentPageChange: "currentPageChange", itemsPerPageChange: "itemsPerPageChange" }, host: { properties: { "class": "this.classesContainer", "attr.id": "this.id" } }, queries: [{ propertyName: "listboxLabel", predicate: PaginationListboxLabelComponent }, { propertyName: "listboxItemsPerPage", predicate: PaginationItemPerPageComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"hasSelect\">\n  <p [attr.id]=\"id + '-label'\" class=\"w-full mb-xs text-sm text-neutral-dark\">\n    Selecciona para cargar datos autom\u00E1ticamente\n  </p>\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <desy-button *ngIf=\"showFirst\" (clickEvent)=\"first()\" [id]=\"getIdPrefix() + '-first'\"\n                  [html]=\"firstIcon + prefix + firstText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasFirst\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n    <desy-button *ngIf=\"showPrevious\" (clickEvent)=\"previous()\" [id]=\"getIdPrefix() + '-previous'\"\n                  [html]=\"previousIcon + prefix + previousText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasPrevious\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n    <div class=\"flex flex-wrap items-center pl-sm\"\n          [ngClass]=\"{'w-full lg:w-auto': showFirst || showLast}\">\n      <p *ngIf=\"showFirst || showLast\" class=\"lg:hidden mr-xs text-sm text-neutral-dark\">P\u00E1gina actual:</p>\n          <desy-select [classes]=\"'c-select--sm c-select--transparent'\" \n                 [formGroupClasses]=\"'-mt-sm mb-0 mr-xs'\" \n                 [id]=\"id + '-items-listbox-'\"\n                 [name]=\"id + 'items-listbox-'\"\n                 [describedBy]=\"id + '-label'\"\n                 [items]=\"items\"\n                 [ngModel]=\"value\"\n                 (ngModelChange)=\"handleActiveItemChange($event)\">\n             <desy-label [classes]=\"'sr-only'\">\n                Selecciona una p\u00E1gina\n             </desy-label>\n          </desy-select>\n    </div>\n    <desy-button *ngIf=\"showNext\" (clickEvent)=\"next()\" [id]=\"getIdPrefix() + '-next'\"\n                  [html]=\"prefix + nextText + getSuffix(currentPage) + nextIcon\" [disabled]=\"currentPage === nPages || !hasNext\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n    <desy-button *ngIf=\"showLast\" (clickEvent)=\"last()\" [id]=\"getIdPrefix() + '-last'\"\n                  [html]=\"prefix + lastText + getSuffix(currentPage) + lastIcon\" [disabled]=\"currentPage === nPages || !hasLast\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n  </nav>\n</ng-container>\n<ng-container *ngIf=\"!hasSelect\">\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <ul class=\"flex flex-wrap\">\n      <li *ngFor=\"let item of items; index as i\">\n        <desy-button *ngIf=\"item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"'<strong>' + prefix + (i + 1) + getSuffix(i,true) + '</strong>'\"\n                      classes=\"c-button--primary c-button--disabled mb-sm mr-sm\"\n                      [disabled]=\"true\" ariaCurrent=\"page\" tabindex=\"-1\"></desy-button>\n        <desy-button *ngIf=\"!item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"prefix + (i + 1) + getSuffix(i,true)\"\n                      (clickEvent)=\"changePage(i + 1)\"\n                      classes=\"mb-sm mr-sm\"></desy-button>\n      </li>\n    </ul>\n  </nav>\n</ng-container>\n  \n<div *ngIf=\"hasSelectItemsPerPage\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\">\n    <desy-select [classes]=\"'c-select--sm c-select--transparent'\" \n                 [formGroupClasses]=\"'flex flex-wrap place-items-baseline gap-xs -mt-sm mb-0 mr-xs'\" \n                 [id]=\"'items-listbox-' + getIdPrefix()\"\n                 [name]=\"'items-listbox-' + getIdPrefix()\"\n                 [describedBy]=\"id + '-label'\"\n                 [items]=\"itemsPerPageList\"\n                 [ngModel]=\"valuePerPage\"\n                 (ngModelChange)=\"changeItemsPerPage($event)\">\n      <desy-label [classes]=\"listboxLabel && listboxLabel.classes ? listboxLabel.classes : 'inline-block flex align-middle mb-[0]'\">\n        <ng-container *ngIf=\"listboxLabel\">\n          <ng-container *desyCustomInnerContent=\"{ component: listboxLabel }\"></ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!listboxLabel\">\n          Items por p\u00E1gina\n        </ng-container>\n      </desy-label>\n   </desy-select>\n</div>\n\n\n<p [attr.id]=\"idPrefix + '-status'\" role=\"status\" aria-live=\"polite\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\" *ngIf=\"totalItems && itemsPerPage\">\n  <span class=\"sr-only\">Posici\u00F3n de paginaci\u00F3n: </span>{{(currentPage - 1) * itemsPerPage + 1}} - {{getLastItemNumber(currentPage - 1)}} de {{totalItems}}\n</p>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "directive", type: AccessibilityDirective, selector: "[desyAppAccessibility]", inputs: ["desyAppAccessibility"] }, { kind: "component", type: ButtonComponent, selector: "desy-button", inputs: ["id", "classes", "html", "text", "element", "name", "type", "value", "disabled", "href", "target", "preventDoubleClick", "fragment", "routerLink", "routerLinkActiveClasses"], outputs: ["clickEvent"] }, { kind: "component", type: LabelComponent, selector: "desy-label", inputs: ["id", "classes", "html", "text", "isPageHeading", "headingLevel", "for"] }, { kind: "component", type: SelectComponent, selector: "desy-select", inputs: ["name", "items", "describedBy", "formGroupClasses", "classes"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MakeHtmlListPipe, name: "makeHtmlList" }] }); }
 }
 __decorate([
     DesyContentChild(),
@@ -14428,7 +14671,7 @@ __decorate([
 ], PaginationComponent.prototype, "listboxLabel", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'desy-pagination', template: "<ng-container *ngIf=\"hasSelect\">\n  <p class=\"w-full mb-xs text-sm text-neutral-dark\">\n    Selecciona una p\u00E1gina para cargar datos\n  </p>\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <desy-button *ngIf=\"showFirst\" (clickEvent)=\"first()\" [id]=\"getIdPrefix() + '-first'\"\n                  [html]=\"firstIcon + prefix + firstText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasFirst\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n    <desy-button *ngIf=\"showPrevious\" (clickEvent)=\"previous()\" [id]=\"getIdPrefix() + '-previous'\"\n                  [html]=\"previousIcon + prefix + previousText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasPrevious\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n    <div class=\"flex flex-wrap items-center pl-sm\"\n          [ngClass]=\"{'w-full lg:w-auto': showFirst || showLast}\">\n      <p *ngIf=\"showFirst || showLast\" class=\"lg:hidden mr-xs text-sm text-neutral-dark\">P\u00E1gina actual:</p>\n          <desy-listbox *ngIf=\"items && items.length > 0\" [id]=\"id + '-listbox'\"\n            [idPrefix]=\"idPrefix\"\n            [text]=\"getActiveItemText()\"\n            [classes]=\"'c-listbox--sm c-listbox--transparent mr-xs'\"\n            [classesTooltip]=\"'max-h-52 overflow-y-auto'\"\n            [doesChangeButtonText]=\"true\"\n            [label]=\"{ text: 'Selecciona una p\u00E1gina para cargar datos', classes: 'sr-only' }\"\n            [(items)]=\"items\"\n            (activeItemChange)=\"handleActiveItemChange($event)\"></desy-listbox>\n    </div>\n    <desy-button *ngIf=\"showNext\" (clickEvent)=\"next()\" [id]=\"getIdPrefix() + '-next'\"\n                  [html]=\"prefix + nextText + getSuffix(currentPage) + nextIcon\" [disabled]=\"currentPage === nPages || !hasNext\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n    <desy-button *ngIf=\"showLast\" (clickEvent)=\"last()\" [id]=\"getIdPrefix() + '-last'\"\n                  [html]=\"prefix + lastText + getSuffix(currentPage) + lastIcon\" [disabled]=\"currentPage === nPages || !hasLast\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\" type=\"button\"></desy-button>\n  </nav>\n</ng-container>\n<ng-container *ngIf=\"!hasSelect\">\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <ul class=\"flex flex-wrap\">\n      <li *ngFor=\"let item of items; index as i\">\n        <desy-button *ngIf=\"item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"'<strong>' + prefix + (i + 1) + getSuffix(i,true) + '</strong>'\"\n                      classes=\"c-button--primary c-button--disabled mb-sm mr-sm\"\n                      [disabled]=\"true\" ariaCurrent=\"page\" tabindex=\"-1\" type=\"button\"></desy-button>\n        <desy-button *ngIf=\"!item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"prefix + (i + 1) + getSuffix(i,true)\"\n                      (clickEvent)=\"changePage(i + 1)\"\n                      classes=\"mb-sm mr-sm\" type=\"button\"></desy-button>\n      </li>\n    </ul>\n  </nav>\n</ng-container>\n  \n<div *ngIf=\"hasSelectItemsPerPage\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\">\n  <desy-listbox [classes]=\"'c-listbox--sm c-listbox--transparent'\" \n                [classesContainer]=\"'flex flex-wrap items-center gap-xs'\" \n                [id]=\"'items-listbox-' + getIdPrefix()\"\n                [doesChangeButtonText]=\"true\"\n                [items]=\"itemsPerPageList\"\n                (activeItemChange)=\"changeItemsPerPage($event)\">\n    <desy-listbox-label [classes]=\"listboxLabel && listboxLabel.classes ? listboxLabel.classes : 'inline-block align-middle mb-0'\">\n        <ng-container *ngIf=\"listboxLabel\">\n          <ng-container *desyCustomInnerContent=\"{ component: listboxLabel }\"></ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!listboxLabel\">\n          Items por p\u00E1gina\n        </ng-container>\n    </desy-listbox-label>\n  </desy-listbox>\n</div>\n\n\n<p role=\"status\" aria-live=\"polite\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\" *ngIf=\"totalItems && itemsPerPage\">\n  <span class=\"sr-only\">Posici\u00F3n de paginaci\u00F3n: </span>{{(currentPage - 1) * itemsPerPage + 1}} - {{getLastItemNumber(currentPage - 1)}} de {{totalItems}}\n</p>\n" }]
+            args: [{ selector: 'desy-pagination', template: "<ng-container *ngIf=\"hasSelect\">\n  <p [attr.id]=\"id + '-label'\" class=\"w-full mb-xs text-sm text-neutral-dark\">\n    Selecciona para cargar datos autom\u00E1ticamente\n  </p>\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <desy-button *ngIf=\"showFirst\" (clickEvent)=\"first()\" [id]=\"getIdPrefix() + '-first'\"\n                  [html]=\"firstIcon + prefix + firstText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasFirst\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n    <desy-button *ngIf=\"showPrevious\" (clickEvent)=\"previous()\" [id]=\"getIdPrefix() + '-previous'\"\n                  [html]=\"previousIcon + prefix + previousText + getSuffix(currentPage - 2)\" [disabled]=\"currentPage === 1 || !hasPrevious\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n    <div class=\"flex flex-wrap items-center pl-sm\"\n          [ngClass]=\"{'w-full lg:w-auto': showFirst || showLast}\">\n      <p *ngIf=\"showFirst || showLast\" class=\"lg:hidden mr-xs text-sm text-neutral-dark\">P\u00E1gina actual:</p>\n          <desy-select [classes]=\"'c-select--sm c-select--transparent'\" \n                 [formGroupClasses]=\"'-mt-sm mb-0 mr-xs'\" \n                 [id]=\"id + '-items-listbox-'\"\n                 [name]=\"id + 'items-listbox-'\"\n                 [describedBy]=\"id + '-label'\"\n                 [items]=\"items\"\n                 [ngModel]=\"value\"\n                 (ngModelChange)=\"handleActiveItemChange($event)\">\n             <desy-label [classes]=\"'sr-only'\">\n                Selecciona una p\u00E1gina\n             </desy-label>\n          </desy-select>\n    </div>\n    <desy-button *ngIf=\"showNext\" (clickEvent)=\"next()\" [id]=\"getIdPrefix() + '-next'\"\n                  [html]=\"prefix + nextText + getSuffix(currentPage) + nextIcon\" [disabled]=\"currentPage === nPages || !hasNext\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n    <desy-button *ngIf=\"showLast\" (clickEvent)=\"last()\" [id]=\"getIdPrefix() + '-last'\"\n                  [html]=\"prefix + lastText + getSuffix(currentPage) + lastIcon\" [disabled]=\"currentPage === nPages || !hasLast\"\n                  classes=\"c-button--sm c-button--transparent mr-xs\"></desy-button>\n  </nav>\n</ng-container>\n<ng-container *ngIf=\"!hasSelect\">\n  <nav [class]=\"['flex flex-wrap items-center flex-1 mb-base lg:mb-0 text-sm', classes] | makeHtmlList\"\n        [desyAppAccessibility]=\"this\">\n    <ul class=\"flex flex-wrap\">\n      <li *ngFor=\"let item of items; index as i\">\n        <desy-button *ngIf=\"item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"'<strong>' + prefix + (i + 1) + getSuffix(i,true) + '</strong>'\"\n                      classes=\"c-button--primary c-button--disabled mb-sm mr-sm\"\n                      [disabled]=\"true\" ariaCurrent=\"page\" tabindex=\"-1\"></desy-button>\n        <desy-button *ngIf=\"!item.active\" [id]=\"getButtonId(i)\"\n                      [html]=\"prefix + (i + 1) + getSuffix(i,true)\"\n                      (clickEvent)=\"changePage(i + 1)\"\n                      classes=\"mb-sm mr-sm\"></desy-button>\n      </li>\n    </ul>\n  </nav>\n</ng-container>\n  \n<div *ngIf=\"hasSelectItemsPerPage\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\">\n    <desy-select [classes]=\"'c-select--sm c-select--transparent'\" \n                 [formGroupClasses]=\"'flex flex-wrap place-items-baseline gap-xs -mt-sm mb-0 mr-xs'\" \n                 [id]=\"'items-listbox-' + getIdPrefix()\"\n                 [name]=\"'items-listbox-' + getIdPrefix()\"\n                 [describedBy]=\"id + '-label'\"\n                 [items]=\"itemsPerPageList\"\n                 [ngModel]=\"valuePerPage\"\n                 (ngModelChange)=\"changeItemsPerPage($event)\">\n      <desy-label [classes]=\"listboxLabel && listboxLabel.classes ? listboxLabel.classes : 'inline-block flex align-middle mb-[0]'\">\n        <ng-container *ngIf=\"listboxLabel\">\n          <ng-container *desyCustomInnerContent=\"{ component: listboxLabel }\"></ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!listboxLabel\">\n          Items por p\u00E1gina\n        </ng-container>\n      </desy-label>\n   </desy-select>\n</div>\n\n\n<p [attr.id]=\"idPrefix + '-status'\" role=\"status\" aria-live=\"polite\" class=\"block relative -top-xs lg:ml-auto text-sm text-neutral-dark\" *ngIf=\"totalItems && itemsPerPage\">\n  <span class=\"sr-only\">Posici\u00F3n de paginaci\u00F3n: </span>{{(currentPage - 1) * itemsPerPage + 1}} - {{getLastItemNumber(currentPage - 1)}} de {{totalItems}}\n</p>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { hasSelect: [{
                 type: Input
             }], idPrefix: [{
@@ -14563,6 +14806,91 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
+class SharedExternalModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SharedExternalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SharedExternalModule, declarations: [SpinnerComponent], imports: [CommonModule], exports: [SpinnerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SharedExternalModule, imports: [CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SharedExternalModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SpinnerComponent,
+                    ],
+                    imports: [
+                        CommonModule,
+                    ],
+                    exports: [
+                        SpinnerComponent,
+                    ]
+                }]
+        }] });
+
+class DesyButtonsModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, declarations: [ButtonComponent,
+            ButtonLoaderComponent,
+            DropdownComponent,
+            ListboxComponent,
+            PillComponent,
+            ListboxItemComponent,
+            ListboxLabelComponent,
+            ToggleComponent,
+            ToggleOnStateComponent,
+            ToggleOffStateComponent], imports: [CommonModule,
+            SharedModule,
+            NgxTippyModule,
+            SharedExternalModule], exports: [ButtonComponent,
+            ButtonLoaderComponent,
+            DropdownComponent,
+            ListboxComponent,
+            PillComponent,
+            ListboxItemComponent,
+            ListboxLabelComponent,
+            ToggleComponent,
+            ToggleOnStateComponent,
+            ToggleOffStateComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, imports: [CommonModule,
+            SharedModule,
+            NgxTippyModule,
+            SharedExternalModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        ButtonComponent,
+                        ButtonLoaderComponent,
+                        DropdownComponent,
+                        ListboxComponent,
+                        PillComponent,
+                        ListboxItemComponent,
+                        ListboxLabelComponent,
+                        ToggleComponent,
+                        ToggleOnStateComponent,
+                        ToggleOffStateComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        SharedModule,
+                        NgxTippyModule,
+                        SharedExternalModule,
+                    ],
+                    exports: [
+                        ButtonComponent,
+                        ButtonLoaderComponent,
+                        DropdownComponent,
+                        ListboxComponent,
+                        PillComponent,
+                        ListboxItemComponent,
+                        ListboxLabelComponent,
+                        ToggleComponent,
+                        ToggleOnStateComponent,
+                        ToggleOffStateComponent
+                    ]
+                }]
+        }] });
+
 class DesyCommonsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyCommonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyCommonsModule, declarations: [IconComponent,
@@ -14605,6 +14933,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
+class FormatDatePipe {
+    transform(value) {
+        if (!value)
+            return '';
+        const fechas = value.split('/');
+        const fechasConvertidas = fechas.map(fecha => {
+            if (fecha.includes('-')) {
+                const [year, month, day] = fecha.split('-');
+                if (year && month && day) {
+                    return `${day}/${month}/${year}`;
+                }
+            }
+            else if (fecha.includes('/')) {
+                const [day, month, year] = fecha.split('/');
+                if (day && month && year) {
+                    return `${day}/${month}/${year}`;
+                }
+            }
+            return fecha;
+        });
+        return fechasConvertidas.join('-');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormatDatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: FormatDatePipe, name: "formatDate" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormatDatePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'formatDate'
+                }]
+        }] });
+
 class DesyFormsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyFormsModule, declarations: [TemplateDrivenWrapperComponent,
@@ -14643,11 +15003,15 @@ class DesyFormsModule {
             TreeItemComponent,
             TreeCheckboxComponent,
             TreeItemsGeneratorComponent,
-            ConditionDirective], imports: [CommonModule,
+            DatepickerComponent,
+            ConditionDirective,
+            FormatDatePipe], imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
             SharedModule,
-            DesyCommonsModule], exports: [HintComponent,
+            DesyCommonsModule,
+            DesyButtonsModule,
+            SharedExternalModule], exports: [HintComponent,
             LabelComponent,
             ErrorMessageComponent,
             FieldsetComponent,
@@ -14677,12 +15041,15 @@ class DesyFormsModule {
             TreeSubComponent,
             TreeItemComponent,
             TreeItemsGeneratorComponent,
+            DatepickerComponent,
             ConditionDirective] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyFormsModule, imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
             SharedModule,
-            DesyCommonsModule] }); }
+            DesyCommonsModule,
+            DesyButtonsModule,
+            SharedExternalModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyFormsModule, decorators: [{
             type: NgModule,
@@ -14722,275 +15089,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         TreeComponent,
                         TreeSubComponent,
                         TreeItemComponent,
-                        TreeCheckboxComponent,
-                        TreeItemsGeneratorComponent,
-                        ConditionDirective,
-                    ],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        SharedModule,
-                        DesyCommonsModule,
-                    ],
-                    exports: [
-                        HintComponent,
-                        LabelComponent,
-                        ErrorMessageComponent,
-                        FieldsetComponent,
-                        LegendComponent,
-                        TextareaComponent,
-                        CharacterCountComponent,
-                        InputComponent,
-                        SelectComponent,
-                        FileUploadComponent,
-                        InputGroupComponent,
-                        InputGroupDividerComponent,
-                        DateInputDividerComponent,
-                        InputGroupInputComponent,
-                        InputGroupSelectComponent,
-                        RadiosComponent,
-                        RadioItemComponent,
-                        CheckboxesComponent,
-                        CheckboxItemComponent,
-                        DateInputComponent,
-                        SearchBarComponent,
-                        OptionComponent,
-                        OptionGroupComponent,
-                        DateInputDayComponent,
-                        DateInputMonthComponent,
-                        DateInputYearComponent,
-                        TreeComponent,
-                        TreeSubComponent,
-                        TreeItemComponent,
-                        TreeItemsGeneratorComponent,
-                        ConditionDirective
-                    ],
-                }]
-        }] });
-
-class DesyViewsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, declarations: [AlertComponent,
-            AccordionComponent,
-            AccordionHeaderComponent,
-            AccordionHistoryComponent,
-            AccordionHistoryItemComponent,
-            AccordionItemShowButtonComponent,
-            AccordionItemHideButtonComponent,
-            AccordionItemComponent,
-            SpinnerComponent,
-            DetailsComponent,
-            CollapsibleComponent,
-            DescriptionListComponent,
-            DescriptionItemComponent,
-            TermComponent,
-            DefinitionComponent,
-            ItemComponent,
-            ItemContentBottomComponent,
-            ItemContentRightComponent,
-            ItemItemComponent,
-            MediaObjectComponent,
-            StatusComponent,
-            StatusItemComponent,
-            TabsComponent,
-            TooltipComponent,
-            TooltipContentComponent,
-            PanelComponent,
-            TabItemComponent,
-            MediaObjectFigureComponent,
-            CardComponent,
-            CardLeftComponent,
-            CardRightComponent,
-            CardSuperComponent,
-            CardSubComponent], imports: [CommonModule,
-            SharedModule,
-            DesyFormsModule,
-            DesyCommonsModule,
-            NgxTippyModule], exports: [AlertComponent,
-            AccordionComponent,
-            AccordionHeaderComponent,
-            AccordionHistoryComponent,
-            AccordionHistoryItemComponent,
-            AccordionItemShowButtonComponent,
-            AccordionItemHideButtonComponent,
-            AccordionItemComponent,
-            SpinnerComponent,
-            DetailsComponent,
-            CollapsibleComponent,
-            DescriptionListComponent,
-            DescriptionItemComponent,
-            TermComponent,
-            DefinitionComponent,
-            ItemComponent,
-            ItemContentBottomComponent,
-            ItemContentRightComponent,
-            ItemItemComponent,
-            MediaObjectComponent,
-            StatusComponent,
-            StatusItemComponent,
-            TabsComponent,
-            TooltipComponent,
-            TooltipContentComponent,
-            PanelComponent,
-            TabItemComponent,
-            MediaObjectFigureComponent,
-            CardComponent,
-            CardLeftComponent,
-            CardRightComponent,
-            CardSuperComponent,
-            CardSubComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, imports: [CommonModule,
-            SharedModule,
-            DesyFormsModule,
-            DesyCommonsModule,
-            NgxTippyModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        AlertComponent,
-                        AccordionComponent,
-                        AccordionHeaderComponent,
-                        AccordionHistoryComponent,
-                        AccordionHistoryItemComponent,
-                        AccordionItemShowButtonComponent,
-                        AccordionItemHideButtonComponent,
-                        AccordionItemComponent,
-                        SpinnerComponent,
-                        DetailsComponent,
-                        CollapsibleComponent,
-                        DescriptionListComponent,
-                        DescriptionItemComponent,
-                        TermComponent,
-                        DefinitionComponent,
-                        ItemComponent,
-                        ItemContentBottomComponent,
-                        ItemContentRightComponent,
-                        ItemItemComponent,
-                        MediaObjectComponent,
-                        StatusComponent,
-                        StatusItemComponent,
-                        TabsComponent,
-                        TooltipComponent,
-                        TooltipContentComponent,
-                        PanelComponent,
-                        TabItemComponent,
-                        MediaObjectFigureComponent,
-                        CardComponent,
-                        CardLeftComponent,
-                        CardRightComponent,
-                        CardSuperComponent,
-                        CardSubComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        SharedModule,
-                        DesyFormsModule,
-                        DesyCommonsModule,
-                        NgxTippyModule
-                    ],
-                    exports: [
-                        AlertComponent,
-                        AccordionComponent,
-                        AccordionHeaderComponent,
-                        AccordionHistoryComponent,
-                        AccordionHistoryItemComponent,
-                        AccordionItemShowButtonComponent,
-                        AccordionItemHideButtonComponent,
-                        AccordionItemComponent,
-                        SpinnerComponent,
-                        DetailsComponent,
-                        CollapsibleComponent,
-                        DescriptionListComponent,
-                        DescriptionItemComponent,
-                        TermComponent,
-                        DefinitionComponent,
-                        ItemComponent,
-                        ItemContentBottomComponent,
-                        ItemContentRightComponent,
-                        ItemItemComponent,
-                        MediaObjectComponent,
-                        StatusComponent,
-                        StatusItemComponent,
-                        TabsComponent,
-                        TooltipComponent,
-                        TooltipContentComponent,
-                        PanelComponent,
-                        TabItemComponent,
-                        MediaObjectFigureComponent,
-                        CardComponent,
-                        CardLeftComponent,
-                        CardRightComponent,
-                        CardSuperComponent,
-                        CardSubComponent,
-                    ]
-                }]
-        }] });
-
-class DesyButtonsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, declarations: [ButtonComponent,
-            ButtonLoaderComponent,
-            DropdownComponent,
-            ListboxComponent,
-            PillComponent,
-            ListboxItemComponent,
-            ListboxLabelComponent,
-            ToggleComponent,
-            ToggleOnStateComponent,
-            ToggleOffStateComponent], imports: [CommonModule,
-            SharedModule,
-            DesyViewsModule,
-            NgxTippyModule], exports: [ButtonComponent,
-            ButtonLoaderComponent,
-            DropdownComponent,
-            ListboxComponent,
-            PillComponent,
-            ListboxItemComponent,
-            ListboxLabelComponent,
-            ToggleComponent,
-            ToggleOnStateComponent,
-            ToggleOffStateComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, imports: [CommonModule,
-            SharedModule,
-            DesyViewsModule,
-            NgxTippyModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyButtonsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        ButtonComponent,
-                        ButtonLoaderComponent,
-                        DropdownComponent,
-                        ListboxComponent,
-                        PillComponent,
-                        ListboxItemComponent,
-                        ListboxLabelComponent,
-                        ToggleComponent,
-                        ToggleOnStateComponent,
-                        ToggleOffStateComponent
+                        TreeCheckboxComponent,
+                        TreeItemsGeneratorComponent,
+                        DatepickerComponent,
+                        ConditionDirective,
+                        FormatDatePipe,
                     ],
                     imports: [
                         CommonModule,
+                        FormsModule,
+                        ReactiveFormsModule,
                         SharedModule,
-                        DesyViewsModule,
-                        NgxTippyModule
+                        DesyCommonsModule,
+                        DesyButtonsModule,
+                        SharedExternalModule,
                     ],
                     exports: [
-                        ButtonComponent,
-                        ButtonLoaderComponent,
-                        DropdownComponent,
-                        ListboxComponent,
-                        PillComponent,
-                        ListboxItemComponent,
-                        ListboxLabelComponent,
-                        ToggleComponent,
-                        ToggleOnStateComponent,
-                        ToggleOffStateComponent
-                    ]
+                        HintComponent,
+                        LabelComponent,
+                        ErrorMessageComponent,
+                        FieldsetComponent,
+                        LegendComponent,
+                        TextareaComponent,
+                        CharacterCountComponent,
+                        InputComponent,
+                        SelectComponent,
+                        FileUploadComponent,
+                        InputGroupComponent,
+                        InputGroupDividerComponent,
+                        DateInputDividerComponent,
+                        InputGroupInputComponent,
+                        InputGroupSelectComponent,
+                        RadiosComponent,
+                        RadioItemComponent,
+                        CheckboxesComponent,
+                        CheckboxItemComponent,
+                        DateInputComponent,
+                        SearchBarComponent,
+                        OptionComponent,
+                        OptionGroupComponent,
+                        DateInputDayComponent,
+                        DateInputMonthComponent,
+                        DateInputYearComponent,
+                        TreeComponent,
+                        TreeSubComponent,
+                        TreeItemComponent,
+                        TreeItemsGeneratorComponent,
+                        DatepickerComponent,
+                        ConditionDirective
+                    ],
                 }]
         }] });
 
@@ -15075,6 +15222,7 @@ class DesyNavModule {
             HeaderAdvancedSubComponent,
             LinksListComponent,
             LinksListItemComponent,
+            LinksListIconRightComponent,
             LinksListItemSubComponent,
             MenuHorizontalComponent,
             MenuHorizontalItemComponent,
@@ -15097,8 +15245,6 @@ class DesyNavModule {
             MenuNavigationItemComponent,
             MenuNavigationSubitemComponent,
             HeaderCustomNavigationComponent,
-            LinksListItemComponent,
-            LinksListItemSubComponent,
             DynamicHeadingDirective], imports: [CommonModule,
             SharedModule,
             DesyCommonsModule,
@@ -15122,6 +15268,7 @@ class DesyNavModule {
             HeaderMobileTextComponent,
             LinksListComponent,
             LinksListItemComponent,
+            LinksListIconRightComponent,
             LinksListItemSubComponent,
             MenuHorizontalComponent,
             MenuHorizontalItemComponent,
@@ -15194,6 +15341,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         HeaderAdvancedSubComponent,
                         LinksListComponent,
                         LinksListItemComponent,
+                        LinksListIconRightComponent,
                         LinksListItemSubComponent,
                         MenuHorizontalComponent,
                         MenuHorizontalItemComponent,
@@ -15216,8 +15364,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         MenuNavigationItemComponent,
                         MenuNavigationSubitemComponent,
                         HeaderCustomNavigationComponent,
-                        LinksListItemComponent,
-                        LinksListItemSubComponent,
                         DynamicHeadingDirective,
                     ],
                     imports: [
@@ -15247,6 +15393,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         HeaderMobileTextComponent,
                         LinksListComponent,
                         LinksListItemComponent,
+                        LinksListIconRightComponent,
                         LinksListItemSubComponent,
                         MenuHorizontalComponent,
                         MenuHorizontalItemComponent,
@@ -15284,6 +15431,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
+class DesyPaginationModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, declarations: [PaginationComponent,
+            PaginationListboxLabelComponent,
+            PaginationItemPerPageComponent], imports: [CommonModule,
+            SharedModule,
+            DesyNavModule,
+            DesyButtonsModule,
+            DesyFormsModule,
+            FormsModule], exports: [PaginationComponent,
+            PaginationListboxLabelComponent,
+            PaginationItemPerPageComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, imports: [CommonModule,
+            SharedModule,
+            DesyNavModule,
+            DesyButtonsModule,
+            DesyFormsModule,
+            FormsModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        PaginationComponent,
+                        PaginationListboxLabelComponent,
+                        PaginationItemPerPageComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        SharedModule,
+                        DesyNavModule,
+                        DesyButtonsModule,
+                        DesyFormsModule,
+                        FormsModule
+                    ],
+                    exports: [
+                        PaginationComponent,
+                        PaginationListboxLabelComponent,
+                        PaginationItemPerPageComponent
+                    ]
+                }]
+        }] });
+
 class DesyTablesModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyTablesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyTablesModule, declarations: [TableComponent,
@@ -15377,39 +15567,158 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
-class DesyPaginationModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, declarations: [PaginationComponent,
-            PaginationListboxLabelComponent,
-            PaginationItemPerPageComponent], imports: [CommonModule,
+class DesyViewsModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, declarations: [AlertComponent,
+            AccordionComponent,
+            AccordionHeaderComponent,
+            AccordionHistoryComponent,
+            AccordionHistoryItemComponent,
+            AccordionItemShowButtonComponent,
+            AccordionItemHideButtonComponent,
+            AccordionItemComponent,
+            DetailsComponent,
+            CollapsibleComponent,
+            DescriptionListComponent,
+            DescriptionItemComponent,
+            TermComponent,
+            DefinitionComponent,
+            ItemComponent,
+            ItemContentBottomComponent,
+            ItemContentRightComponent,
+            ItemItemComponent,
+            MediaObjectComponent,
+            StatusComponent,
+            StatusItemComponent,
+            TabsComponent,
+            TooltipComponent,
+            TooltipContentComponent,
+            PanelComponent,
+            TabItemComponent,
+            MediaObjectFigureComponent,
+            CardComponent,
+            CardLeftComponent,
+            CardRightComponent,
+            CardSuperComponent,
+            CardSubComponent], imports: [CommonModule,
             SharedModule,
-            DesyNavModule,
-            DesyButtonsModule], exports: [PaginationComponent,
-            PaginationListboxLabelComponent,
-            PaginationItemPerPageComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, imports: [CommonModule,
+            DesyFormsModule,
+            DesyCommonsModule,
+            NgxTippyModule], exports: [AlertComponent,
+            AccordionComponent,
+            AccordionHeaderComponent,
+            AccordionHistoryComponent,
+            AccordionHistoryItemComponent,
+            AccordionItemShowButtonComponent,
+            AccordionItemHideButtonComponent,
+            AccordionItemComponent,
+            DetailsComponent,
+            CollapsibleComponent,
+            DescriptionListComponent,
+            DescriptionItemComponent,
+            TermComponent,
+            DefinitionComponent,
+            ItemComponent,
+            ItemContentBottomComponent,
+            ItemContentRightComponent,
+            ItemItemComponent,
+            MediaObjectComponent,
+            StatusComponent,
+            StatusItemComponent,
+            TabsComponent,
+            TooltipComponent,
+            TooltipContentComponent,
+            PanelComponent,
+            TabItemComponent,
+            MediaObjectFigureComponent,
+            CardComponent,
+            CardLeftComponent,
+            CardRightComponent,
+            CardSuperComponent,
+            CardSubComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, imports: [CommonModule,
             SharedModule,
-            DesyNavModule,
-            DesyButtonsModule] }); }
+            DesyFormsModule,
+            DesyCommonsModule,
+            NgxTippyModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyPaginationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyViewsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
-                        PaginationComponent,
-                        PaginationListboxLabelComponent,
-                        PaginationItemPerPageComponent
+                        AlertComponent,
+                        AccordionComponent,
+                        AccordionHeaderComponent,
+                        AccordionHistoryComponent,
+                        AccordionHistoryItemComponent,
+                        AccordionItemShowButtonComponent,
+                        AccordionItemHideButtonComponent,
+                        AccordionItemComponent,
+                        DetailsComponent,
+                        CollapsibleComponent,
+                        DescriptionListComponent,
+                        DescriptionItemComponent,
+                        TermComponent,
+                        DefinitionComponent,
+                        ItemComponent,
+                        ItemContentBottomComponent,
+                        ItemContentRightComponent,
+                        ItemItemComponent,
+                        MediaObjectComponent,
+                        StatusComponent,
+                        StatusItemComponent,
+                        TabsComponent,
+                        TooltipComponent,
+                        TooltipContentComponent,
+                        PanelComponent,
+                        TabItemComponent,
+                        MediaObjectFigureComponent,
+                        CardComponent,
+                        CardLeftComponent,
+                        CardRightComponent,
+                        CardSuperComponent,
+                        CardSubComponent,
                     ],
                     imports: [
                         CommonModule,
                         SharedModule,
-                        DesyNavModule,
-                        DesyButtonsModule
+                        DesyFormsModule,
+                        DesyCommonsModule,
+                        NgxTippyModule
                     ],
                     exports: [
-                        PaginationComponent,
-                        PaginationListboxLabelComponent,
-                        PaginationItemPerPageComponent
+                        AlertComponent,
+                        AccordionComponent,
+                        AccordionHeaderComponent,
+                        AccordionHistoryComponent,
+                        AccordionHistoryItemComponent,
+                        AccordionItemShowButtonComponent,
+                        AccordionItemHideButtonComponent,
+                        AccordionItemComponent,
+                        DetailsComponent,
+                        CollapsibleComponent,
+                        DescriptionListComponent,
+                        DescriptionItemComponent,
+                        TermComponent,
+                        DefinitionComponent,
+                        ItemComponent,
+                        ItemContentBottomComponent,
+                        ItemContentRightComponent,
+                        ItemItemComponent,
+                        MediaObjectComponent,
+                        StatusComponent,
+                        StatusItemComponent,
+                        TabsComponent,
+                        TooltipComponent,
+                        TooltipContentComponent,
+                        PanelComponent,
+                        TabItemComponent,
+                        MediaObjectFigureComponent,
+                        CardComponent,
+                        CardLeftComponent,
+                        CardRightComponent,
+                        CardSuperComponent,
+                        CardSubComponent,
                     ]
                 }]
         }] });
@@ -15424,7 +15733,7 @@ class DesyAngularModule {
             DesyTablesModule,
             DesyViewsModule,
             DesyPaginationModule,
-            DesyCommonsModule], exports: [DesyButtonsModule,
+            SharedExternalModule], exports: [DesyButtonsModule,
             DesyCommonsModule,
             DesyFormsModule,
             DesyModalsModule,
@@ -15432,7 +15741,7 @@ class DesyAngularModule {
             DesyTablesModule,
             DesyViewsModule,
             DesyPaginationModule,
-            DesyCommonsModule] }); }
+            SharedExternalModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyAngularModule, imports: [DesyButtonsModule,
             DesyCommonsModule,
             DesyFormsModule,
@@ -15441,7 +15750,7 @@ class DesyAngularModule {
             DesyTablesModule,
             DesyViewsModule,
             DesyPaginationModule,
-            DesyCommonsModule, DesyButtonsModule,
+            SharedExternalModule, DesyButtonsModule,
             DesyCommonsModule,
             DesyFormsModule,
             DesyModalsModule,
@@ -15449,7 +15758,7 @@ class DesyAngularModule {
             DesyTablesModule,
             DesyViewsModule,
             DesyPaginationModule,
-            DesyCommonsModule] }); }
+            SharedExternalModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DesyAngularModule, decorators: [{
             type: NgModule,
@@ -15463,7 +15772,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         DesyTablesModule,
                         DesyViewsModule,
                         DesyPaginationModule,
-                        DesyCommonsModule,
+                        SharedExternalModule,
                     ],
                     exports: [
                         DesyButtonsModule,
@@ -15474,10 +15783,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         DesyTablesModule,
                         DesyViewsModule,
                         DesyPaginationModule,
-                        DesyCommonsModule,
+                        SharedExternalModule,
                     ]
                 }]
         }] });
 
-export { AccordionComponent, AccordionHeaderComponent, AccordionHistoryComponent, AccordionHistoryItemComponent, AccordionItemComponent, AccordionItemHideButtonComponent, AccordionItemShowButtonComponent, AlertComponent, AlertService, BreadcrumbsComponent, BreadcrumbsItemComponent, ButtonComponent, ButtonLoaderComponent, CardComponent, CardLeftComponent, CardRightComponent, CardSubComponent, CardSuperComponent, CharacterCountComponent, CheckboxItemComponent, CheckboxesComponent, CollapsibleComponent, ConditionDirective, ContentComponent, DateInputComponent, DateInputDayComponent, DateInputDividerComponent, DateInputMonthComponent, DateInputYearComponent, DefinitionComponent, DescriptionComponent, DescriptionItemComponent, DescriptionListComponent, DesyAngularModule, DesyButtonsModule, DesyCommonsModule, DesyFormsModule, DesyModalsModule, DesyNavModule, DesyPaginationModule, DesyTablesModule, DesyViewsModule, DetailsComponent, DialogComponent, DialogService, DividerComponent, DropdownComponent, DynamicHeadingDirective, ErrorMessageComponent, ErrorSummaryComponent, ErrorSummaryItemComponent, FieldsetComponent, FileUploadComponent, FooterComponent, FooterMetaComponent, FooterMetaItemComponent, FooterNavigationComponent, FooterNavigationItemComponent, HeaderAdvancedComponent, HeaderAdvancedCustomNavigationComponent, HeaderAdvancedDropdownComponent, HeaderAdvancedLogoComponent, HeaderAdvancedSubComponent, HeaderAdvancedSubtitleComponent, HeaderAdvancedSuperComponent, HeaderAdvancedTitleComponent, HeaderAdvancedTitleContainerComponent, HeaderComponent, HeaderCustomNavigationComponent, HeaderDropdownComponent, HeaderMiniComponent, HeaderMobileTextComponent, HeaderNavigationComponent, HeaderNavigationItemComponent, HeaderOffcanvasButtonComponent, HeaderOffcanvasCloseButtonComponent, HeaderOffcanvasComponent, HeaderSubnavComponent, HintComponent, IconComponent, InputComponent, InputGroupComponent, InputGroupDividerComponent, InputGroupInputComponent, InputGroupSelectComponent, ItemComponent, ItemContentBottomComponent, ItemContentRightComponent, ItemItemComponent, LabelComponent, LegendComponent, LinksListComponent, LinksListItemComponent, LinksListItemSubComponent, ListboxComponent, ListboxItemComponent, ListboxLabelComponent, MediaObjectComponent, MediaObjectFigureComponent, MenuHorizontalComponent, MenuHorizontalItemComponent, MenuNavigationComponent, MenuNavigationItemComponent, MenuNavigationSubitemComponent, MenuVerticalComponent, MenuVerticalItemComponent, MenuVerticalItemSubComponent, MenuVerticalItemSubItemComponent, MenubarComponent, MenubarItemComponent, MenubarLabelComponent, MenubarSubitemComponent, MenubarSubsubitemComponent, ModalButtonLoaderPrimaryComponent, ModalButtonLoaderSecondaryComponent, ModalButtonPrimaryComponent, ModalButtonSecondaryComponent, ModalComponent, NavComponent, NavItemComponent, NotificationComponent, NotificationItemComponent, OptionComponent, OptionGroupComponent, OrderBy, PaginationComponent, PaginationItemPerPageComponent, PaginationListboxLabelComponent, PanelComponent, PillComponent, RadioItemComponent, RadiosComponent, SearchBarComponent, SelectComponent, SkipLinkComponent, SpinnerComponent, StatusComponent, StatusItemComponent, TabItemComponent, TableAdvancedComponent, TableAdvancedFooterCellComponent, TableAdvancedFooterComponent, TableAdvancedHeaderCellComponent, TableAdvancedHeaderComponent, TableAdvancedRowCellComponent, TableAdvancedRowComponent, TableAdvancedSelectComponent, TableCaptionComponent, TableCellComponent, TableComponent, TableFooterComponent, TableHeaderComponent, TableRowComponent, TabsComponent, TermComponent, TextareaComponent, TitleComponent, ToggleComponent, ToggleOffStateComponent, ToggleOnStateComponent, TooltipComponent, TooltipContentComponent, TreeComponent, TreeItemComponent, TreeItemsGeneratorComponent, TreeSubComponent, Type };
+export { AccordionComponent, AccordionHeaderComponent, AccordionHistoryComponent, AccordionHistoryItemComponent, AccordionItemComponent, AccordionItemHideButtonComponent, AccordionItemShowButtonComponent, AlertComponent, AlertService, BreadcrumbsComponent, BreadcrumbsItemComponent, ButtonComponent, ButtonLoaderComponent, CardComponent, CardLeftComponent, CardRightComponent, CardSubComponent, CardSuperComponent, CharacterCountComponent, CheckboxItemComponent, CheckboxesComponent, CollapsibleComponent, ConditionDirective, ContentComponent, DateInputComponent, DateInputDayComponent, DateInputDividerComponent, DateInputMonthComponent, DateInputYearComponent, DatepickerComponent, DefinitionComponent, DescriptionComponent, DescriptionItemComponent, DescriptionListComponent, DesyAngularModule, DesyButtonsModule, DesyCommonsModule, DesyFormsModule, DesyModalsModule, DesyNavModule, DesyPaginationModule, DesyTablesModule, DesyViewsModule, DetailsComponent, DialogComponent, DialogService, DividerComponent, DropdownComponent, DynamicHeadingDirective, ErrorMessageComponent, ErrorSummaryComponent, ErrorSummaryItemComponent, FieldsetComponent, FileUploadComponent, FooterComponent, FooterMetaComponent, FooterMetaItemComponent, FooterNavigationComponent, FooterNavigationItemComponent, HeaderAdvancedComponent, HeaderAdvancedCustomNavigationComponent, HeaderAdvancedDropdownComponent, HeaderAdvancedLogoComponent, HeaderAdvancedSubComponent, HeaderAdvancedSubtitleComponent, HeaderAdvancedSuperComponent, HeaderAdvancedTitleComponent, HeaderAdvancedTitleContainerComponent, HeaderComponent, HeaderCustomNavigationComponent, HeaderDropdownComponent, HeaderMiniComponent, HeaderMobileTextComponent, HeaderNavigationComponent, HeaderNavigationItemComponent, HeaderOffcanvasButtonComponent, HeaderOffcanvasCloseButtonComponent, HeaderOffcanvasComponent, HeaderSubnavComponent, HintComponent, IconComponent, InputComponent, InputGroupComponent, InputGroupDividerComponent, InputGroupInputComponent, InputGroupSelectComponent, ItemComponent, ItemContentBottomComponent, ItemContentRightComponent, ItemItemComponent, LabelComponent, LegendComponent, LinksListComponent, LinksListIconRightComponent, LinksListItemComponent, LinksListItemSubComponent, ListboxComponent, ListboxItemComponent, ListboxLabelComponent, MediaObjectComponent, MediaObjectFigureComponent, MenuHorizontalComponent, MenuHorizontalItemComponent, MenuNavigationComponent, MenuNavigationItemComponent, MenuNavigationSubitemComponent, MenuVerticalComponent, MenuVerticalItemComponent, MenuVerticalItemSubComponent, MenuVerticalItemSubItemComponent, MenubarComponent, MenubarItemComponent, MenubarLabelComponent, MenubarSubitemComponent, MenubarSubsubitemComponent, ModalButtonLoaderPrimaryComponent, ModalButtonLoaderSecondaryComponent, ModalButtonPrimaryComponent, ModalButtonSecondaryComponent, ModalComponent, NavComponent, NavItemComponent, NotificationComponent, NotificationItemComponent, OptionComponent, OptionGroupComponent, OrderBy, PaginationComponent, PaginationItemPerPageComponent, PaginationListboxLabelComponent, PanelComponent, PillComponent, RadioItemComponent, RadiosComponent, SearchBarComponent, SelectComponent, SharedExternalModule, SkipLinkComponent, SpinnerComponent, StatusComponent, StatusItemComponent, TabItemComponent, TableAdvancedComponent, TableAdvancedFooterCellComponent, TableAdvancedFooterComponent, TableAdvancedHeaderCellComponent, TableAdvancedHeaderComponent, TableAdvancedRowCellComponent, TableAdvancedRowComponent, TableAdvancedSelectComponent, TableCaptionComponent, TableCellComponent, TableComponent, TableFooterComponent, TableHeaderComponent, TableRowComponent, TabsComponent, TermComponent, TextareaComponent, TitleComponent, ToggleComponent, ToggleOffStateComponent, ToggleOnStateComponent, TooltipComponent, TooltipContentComponent, TreeComponent, TreeItemComponent, TreeItemsGeneratorComponent, TreeSubComponent, Type };
 //# sourceMappingURL=desy-angular.mjs.map