desy-angular 7.0.1 → 7.1.0

package/esm2020/lib/desy-views/components/accordion-history/accordion-history.component.mjs

@@ -7,9 +7,9 @@ import * as i2 from "../../../shared/directives/custom-inner-content.directive";
 import * as i3 from "../../../shared/pipes/make-html-list.pipe";
 export class AccordionHistoryComponent extends AccordionComponent {
 }
-AccordionHistoryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AccordionHistoryComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-AccordionHistoryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: AccordionHistoryComponent, selector: "desy-accordion-history", queries: [{ propertyName: "itemComponentList", predicate: AccordionHistoryItemComponent }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"classes\"\n     [attr.role]=\"role\"\n     [attr.aria-describedby]=\"ariaDescribedBy\"\n     [attr.aria-errormessage]=\"ariaErrorMessage\"\n     [attr.aria-label]=\"ariaLabel\"\n     [attr.aria-labelledby]=\"ariaLabelledBy\"\n     [attr.aria-hidden]=\"ariaHidden\"\n     [attr.aria-disabled]=\"ariaDisabled\"\n     [attr.aria-controls]=\"ariaControls\"\n     [attr.aria-current]=\"ariaCurrent\"\n     [attr.aria-live]=\"ariaLive\"\n     [attr.aria-expanded]=\"ariaExpanded\"\n     [attr.aria-haspopup]=\"ariaHasPopup\"\n     [attr.tabindex]=\"tabindex\">\n  <div class=\"flex justify-between\">\n    <ng-container [ngSwitch]=\"headingLevel\">\n      <h1 *ngSwitchCase=\"1\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h1>\n      <h2 *ngSwitchCase=\"2\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h2>\n      <h3 *ngSwitchCase=\"3\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h3>\n      <h4 *ngSwitchCase=\"4\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h4>\n      <h5 *ngSwitchCase=\"5\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h5>\n      <h2 *ngSwitchDefault  [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h2>\n    </ng-container>\n\n    <button *ngIf=\"showControl\" (click)=\"changeAll()\"\n            class=\"ml-auto py-base text-sm text-neutral-dark underline focus:text-black focus:bg-warning-base focus:outline-none focus:shadow-outline-focus\">\n      {{showAll ? 'Mostrar' : 'Ocultar'}} todo\n    </button>\n  </div>\n  <div class=\"Accordion pl-lg\">\n      <ng-template #itemHeaderContent let-item=\"item\" let-id=\"id\" let-index=\"index\">\n        <button #itemSelector [id]=\"id + '-title'\" (click)=\"toggleItem(item)\"\n                [class]=\"['Accordion-trigger 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', item.disabled ? 'cursor-not-allowed' : ''] | makeHtmlList\"\n                [attr.aria-controls]=\"id\" [attr.aria-expanded]=\"item.open\" [disabled]=\"item.disabled\">\n            <ng-container *desyCustomInnerContent=\"{ component: getItemHeader(item), html: item.headerHtml, text: item.headerText }\"></ng-container>\n            <span *ngIf=\"!item.disabled\" class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\">\n              <span *ngIf=\"!item.open\" [class]=\"['Accordion-show', item.showButton?.classes] | makeHtmlList\">\n                <ng-container *desyCustomInnerContent=\"{ component: item.showButton, text: 'Mostrar' }\"></ng-container>\n              </span>\n              <span *ngIf=\"allowToggle && item.open\" [class]=\"['Accordion-show', item.hideButton?.classes] | makeHtmlList\">\n                <ng-container *desyCustomInnerContent=\"{ component: item.hideButton, text: 'Ocultar' }\"></ng-container>\n              </span>\n            </span>\n        </button>\n      </ng-template>\n\n      <div *ngFor=\"let item of getItems(); index as i; first as isFirst; last as isLast\" \n           class=\"relative -my-px px-xs py-sm border-t border-b border-neutral-base\"\n           (keydown.home)=\"focusFirstItem($event)\"\n           (keydown.end)=\"focusLastItem($event)\"\n           (keydown.arrowup)=\"focusPreviousItem($event, i)\"\n           (keydown.arrowdown)=\"focusNextItem($event, i)\"\n           (click)=\"selectItem(i)\">\n        <ng-container [ngSwitch]=\"headingLevel\">\n            <h2 *ngSwitchCase=\"1\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h2>\n            <h3 *ngSwitchCase=\"2\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h3>\n            <h4 *ngSwitchCase=\"3\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h4>\n            <h5 *ngSwitchCase=\"4\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h5>\n            <h6 *ngSwitchCase=\"5\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h6>\n            <h3 *ngSwitchDefault><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h3>\n        </ng-container>\n        <p class=\"sr-only\" aria-hidden=\"true\">Haz click en el bot\u00F3n anterior para mostrar u ocultar</p>\n        <ng-container *ngIf=\"!isFirst\">\n          <ng-container [ngSwitch]=\"item.status\">\n            <div *ngSwitchCase=\"'current'\" class=\"absolute -top-px -left-5 h-6 border-2 border-primary-base\"></div>\n            <div *ngSwitchCase=\"'pending'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'muted'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-base\"></div>\n            <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-base\"></div>\n            <div *ngSwitchDefault class=\"absolute -top-px -left-5 h-6 border-2 border-primary-base\"></div>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!isLast\">\n          <ng-container [ngSwitch]=\"item.status\">\n            <div *ngSwitchCase=\"'current'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'pending'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'muted'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-base\"></div>\n            <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchDefault class=\"absolute top-6 bottom-0 -left-5 border-2 border-primary-base\"></div>\n          </ng-container>\n        </ng-container>\n        <ng-container [ngSwitch]=\"item.status\">\n          <div *ngSwitchCase=\"'current'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-white ring-2 ring-primary-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: actual</p></div>\n          <div *ngSwitchCase=\"'pending'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-white border-2 border-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pendiente</p></div>\n          <div *ngSwitchCase=\"'muted'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-neutral-base border-2 border-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pasado</p></div>\n          <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-neutral-base ring-2 ring-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: actual</p></div>\n          <div *ngSwitchDefault class=\"absolute top-5 -left-6 w-3 h-3 bg-primary-base border-2 border-primary-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pasado</p></div>\n        </ng-container>\n\n        <div *ngIf=\"item.open\" [class]=\"['Accordion-panel relative', item.classes] | makeHtmlList\"\n             [attr.id]=\"getItemId(item, i)\"\n             [attr.role]=\"(item.role ? role : 'accordion')\"\n             [attr.aria-selected]=\"currentItem === i ? 'true' : 'false'\"\n             [attr.aria-describedby]=\"item.ariaDescribedBy\"\n             [attr.aria-errormessage]=\"item.ariaErrorMessage\"\n             [attr.aria-label]=\"item.ariaLabel\"\n             [attr.aria-labelledby]=\"item.ariaLabelledBy\"\n             [attr.aria-hidden]=\"item.ariaHidden\"\n             [attr.aria-controls]=\"'accordion-' + getItemId(item, i)\"\n             [attr.aria-current]=\"item.ariaCurrent\"\n             [attr.aria-live]=\"item.ariaLive\"\n             [attr.aria-expanded]=\"item.ariaExpanded\"\n             [attr.aria-haspopup]=\"item.ariaHasPopup\">\n          <ng-container *ngIf=\"!isLast\">\n            <ng-container [ngSwitch]=\"item.status\">\n              <div *ngSwitchCase=\"'current'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchCase=\"'pending'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchCase=\"'muted'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-base\"></div>\n              <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchDefault class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-primary-base\"></div>\n            </ng-container>\n          </ng-container>\n          <ng-container *desyCustomInnerContent=\"{ component: getItemContent(item), html: item.html, text: item.text }\"></ng-container>\n        </div>\n      </div>\n  </div>\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: 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.CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "pipe", type: i3.MakeHtmlListPipe, name: "makeHtmlList" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AccordionHistoryComponent, decorators: [{
+AccordionHistoryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccordionHistoryComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+AccordionHistoryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AccordionHistoryComponent, selector: "desy-accordion-history", queries: [{ propertyName: "itemComponentList", predicate: AccordionHistoryItemComponent }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"classes\"\n     [attr.role]=\"role\"\n     [attr.aria-describedby]=\"ariaDescribedBy\"\n     [attr.aria-errormessage]=\"ariaErrorMessage\"\n     [attr.aria-label]=\"ariaLabel\"\n     [attr.aria-labelledby]=\"ariaLabelledBy\"\n     [attr.aria-hidden]=\"ariaHidden\"\n     [attr.aria-disabled]=\"ariaDisabled\"\n     [attr.aria-controls]=\"ariaControls\"\n     [attr.aria-current]=\"ariaCurrent\"\n     [attr.aria-live]=\"ariaLive\"\n     [attr.aria-expanded]=\"ariaExpanded\"\n     [attr.aria-haspopup]=\"ariaHasPopup\"\n     [attr.tabindex]=\"tabindex\">\n  <div class=\"flex justify-between\">\n    <ng-container [ngSwitch]=\"headingLevel\">\n      <h1 *ngSwitchCase=\"1\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h1>\n      <h2 *ngSwitchCase=\"2\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h2>\n      <h3 *ngSwitchCase=\"3\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h3>\n      <h4 *ngSwitchCase=\"4\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h4>\n      <h5 *ngSwitchCase=\"5\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h5>\n      <h2 *ngSwitchDefault  [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h2>\n    </ng-container>\n\n    <button *ngIf=\"showControl\" (click)=\"changeAll()\"\n            class=\"ml-auto py-base text-sm text-neutral-dark underline focus:text-black focus:bg-warning-base focus:outline-none focus:shadow-outline-focus\">\n      {{showAll ? 'Mostrar' : 'Ocultar'}} todo\n    </button>\n  </div>\n  <div class=\"Accordion pl-lg\">\n      <ng-template #itemHeaderContent let-item=\"item\" let-id=\"id\" let-index=\"index\">\n        <button #itemSelector [id]=\"id + '-title'\" (click)=\"toggleItem(item)\"\n                [class]=\"['Accordion-trigger 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', item.disabled ? 'cursor-not-allowed' : ''] | makeHtmlList\"\n                [attr.aria-controls]=\"id\" [attr.aria-expanded]=\"item.open\" [disabled]=\"item.disabled\">\n            <ng-container *desyCustomInnerContent=\"{ component: getItemHeader(item), html: item.headerHtml, text: item.headerText }\"></ng-container>\n            <span *ngIf=\"!item.disabled\" class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\">\n              <span *ngIf=\"!item.open\" [class]=\"['Accordion-show', item.showButton?.classes] | makeHtmlList\">\n                <ng-container *desyCustomInnerContent=\"{ component: item.showButton, text: 'Mostrar' }\"></ng-container>\n              </span>\n              <span *ngIf=\"allowToggle && item.open\" [class]=\"['Accordion-show', item.hideButton?.classes] | makeHtmlList\">\n                <ng-container *desyCustomInnerContent=\"{ component: item.hideButton, text: 'Ocultar' }\"></ng-container>\n              </span>\n            </span>\n        </button>\n      </ng-template>\n\n      <div *ngFor=\"let item of getItems(); index as i; first as isFirst; last as isLast\" \n           class=\"relative -my-px px-xs py-sm border-t border-b border-neutral-base\"\n           (keydown.home)=\"focusFirstItem($event)\"\n           (keydown.end)=\"focusLastItem($event)\"\n           (keydown.arrowup)=\"focusPreviousItem($event, i)\"\n           (keydown.arrowdown)=\"focusNextItem($event, i)\"\n           (click)=\"selectItem(i)\">\n        <ng-container [ngSwitch]=\"headingLevel\">\n            <h2 *ngSwitchCase=\"1\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h2>\n            <h3 *ngSwitchCase=\"2\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h3>\n            <h4 *ngSwitchCase=\"3\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h4>\n            <h5 *ngSwitchCase=\"4\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h5>\n            <h6 *ngSwitchCase=\"5\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h6>\n            <h3 *ngSwitchDefault><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h3>\n        </ng-container>\n        <p class=\"sr-only\" aria-hidden=\"true\">Haz click en el bot\u00F3n anterior para mostrar u ocultar</p>\n        <ng-container *ngIf=\"!isFirst\">\n          <ng-container [ngSwitch]=\"item.status\">\n            <div *ngSwitchCase=\"'current'\" class=\"absolute -top-px -left-5 h-6 border-2 border-primary-base\"></div>\n            <div *ngSwitchCase=\"'pending'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'muted'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-base\"></div>\n            <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-base\"></div>\n            <div *ngSwitchDefault class=\"absolute -top-px -left-5 h-6 border-2 border-primary-base\"></div>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!isLast\">\n          <ng-container [ngSwitch]=\"item.status\">\n            <div *ngSwitchCase=\"'current'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'pending'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'muted'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-base\"></div>\n            <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchDefault class=\"absolute top-6 bottom-0 -left-5 border-2 border-primary-base\"></div>\n          </ng-container>\n        </ng-container>\n        <ng-container [ngSwitch]=\"item.status\">\n          <div *ngSwitchCase=\"'current'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-white ring-2 ring-primary-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: actual</p></div>\n          <div *ngSwitchCase=\"'pending'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-white border-2 border-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pendiente</p></div>\n          <div *ngSwitchCase=\"'muted'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-neutral-base border-2 border-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pasado</p></div>\n          <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-neutral-base ring-2 ring-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: actual</p></div>\n          <div *ngSwitchDefault class=\"absolute top-5 -left-6 w-3 h-3 bg-primary-base border-2 border-primary-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pasado</p></div>\n        </ng-container>\n\n        <div *ngIf=\"item.open\" [class]=\"['Accordion-panel relative', item.classes] | makeHtmlList\"\n             [attr.id]=\"getItemId(item, i)\"\n             [attr.role]=\"(item.role ? role : 'accordion')\"\n             [attr.aria-selected]=\"currentItem === i ? 'true' : 'false'\"\n             [attr.aria-describedby]=\"item.ariaDescribedBy\"\n             [attr.aria-errormessage]=\"item.ariaErrorMessage\"\n             [attr.aria-label]=\"item.ariaLabel\"\n             [attr.aria-labelledby]=\"item.ariaLabelledBy\"\n             [attr.aria-hidden]=\"item.ariaHidden\"\n             [attr.aria-controls]=\"'accordion-' + getItemId(item, i)\"\n             [attr.aria-current]=\"item.ariaCurrent\"\n             [attr.aria-live]=\"item.ariaLive\"\n             [attr.aria-expanded]=\"item.ariaExpanded\"\n             [attr.aria-haspopup]=\"item.ariaHasPopup\">\n          <ng-container *ngIf=\"!isLast\">\n            <ng-container [ngSwitch]=\"item.status\">\n              <div *ngSwitchCase=\"'current'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchCase=\"'pending'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchCase=\"'muted'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-base\"></div>\n              <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchDefault class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-primary-base\"></div>\n            </ng-container>\n          </ng-container>\n          <ng-container *desyCustomInnerContent=\"{ component: getItemContent(item), html: item.html, text: item.text }\"></ng-container>\n        </div>\n      </div>\n  </div>\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: 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.CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }, { kind: "pipe", type: i3.MakeHtmlListPipe, name: "makeHtmlList" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccordionHistoryComponent, decorators: [{
             type: Component,
             args: [{ selector: 'desy-accordion-history', template: "<div [class]=\"classes\"\n     [attr.role]=\"role\"\n     [attr.aria-describedby]=\"ariaDescribedBy\"\n     [attr.aria-errormessage]=\"ariaErrorMessage\"\n     [attr.aria-label]=\"ariaLabel\"\n     [attr.aria-labelledby]=\"ariaLabelledBy\"\n     [attr.aria-hidden]=\"ariaHidden\"\n     [attr.aria-disabled]=\"ariaDisabled\"\n     [attr.aria-controls]=\"ariaControls\"\n     [attr.aria-current]=\"ariaCurrent\"\n     [attr.aria-live]=\"ariaLive\"\n     [attr.aria-expanded]=\"ariaExpanded\"\n     [attr.aria-haspopup]=\"ariaHasPopup\"\n     [attr.tabindex]=\"tabindex\">\n  <div class=\"flex justify-between\">\n    <ng-container [ngSwitch]=\"headingLevel\">\n      <h1 *ngSwitchCase=\"1\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h1>\n      <h2 *ngSwitchCase=\"2\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h2>\n      <h3 *ngSwitchCase=\"3\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h3>\n      <h4 *ngSwitchCase=\"4\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h4>\n      <h5 *ngSwitchCase=\"5\" [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h5>\n      <h2 *ngSwitchDefault  [class]=\"headingComponent?.classes || 'c-h2 mb-base'\"><ng-container *desyCustomInnerContent=\"{ component: headingComponent }\"></ng-container></h2>\n    </ng-container>\n\n    <button *ngIf=\"showControl\" (click)=\"changeAll()\"\n            class=\"ml-auto py-base text-sm text-neutral-dark underline focus:text-black focus:bg-warning-base focus:outline-none focus:shadow-outline-focus\">\n      {{showAll ? 'Mostrar' : 'Ocultar'}} todo\n    </button>\n  </div>\n  <div class=\"Accordion pl-lg\">\n      <ng-template #itemHeaderContent let-item=\"item\" let-id=\"id\" let-index=\"index\">\n        <button #itemSelector [id]=\"id + '-title'\" (click)=\"toggleItem(item)\"\n                [class]=\"['Accordion-trigger 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', item.disabled ? 'cursor-not-allowed' : ''] | makeHtmlList\"\n                [attr.aria-controls]=\"id\" [attr.aria-expanded]=\"item.open\" [disabled]=\"item.disabled\">\n            <ng-container *desyCustomInnerContent=\"{ component: getItemHeader(item), html: item.headerHtml, text: item.headerText }\"></ng-container>\n            <span *ngIf=\"!item.disabled\" class=\"absolute inset-y-0 right-0 py-sm font-normal text-sm text-neutral-dark underline group-focus:text-black pointer-events-none\">\n              <span *ngIf=\"!item.open\" [class]=\"['Accordion-show', item.showButton?.classes] | makeHtmlList\">\n                <ng-container *desyCustomInnerContent=\"{ component: item.showButton, text: 'Mostrar' }\"></ng-container>\n              </span>\n              <span *ngIf=\"allowToggle && item.open\" [class]=\"['Accordion-show', item.hideButton?.classes] | makeHtmlList\">\n                <ng-container *desyCustomInnerContent=\"{ component: item.hideButton, text: 'Ocultar' }\"></ng-container>\n              </span>\n            </span>\n        </button>\n      </ng-template>\n\n      <div *ngFor=\"let item of getItems(); index as i; first as isFirst; last as isLast\" \n           class=\"relative -my-px px-xs py-sm border-t border-b border-neutral-base\"\n           (keydown.home)=\"focusFirstItem($event)\"\n           (keydown.end)=\"focusLastItem($event)\"\n           (keydown.arrowup)=\"focusPreviousItem($event, i)\"\n           (keydown.arrowdown)=\"focusNextItem($event, i)\"\n           (click)=\"selectItem(i)\">\n        <ng-container [ngSwitch]=\"headingLevel\">\n            <h2 *ngSwitchCase=\"1\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h2>\n            <h3 *ngSwitchCase=\"2\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h3>\n            <h4 *ngSwitchCase=\"3\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h4>\n            <h5 *ngSwitchCase=\"4\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h5>\n            <h6 *ngSwitchCase=\"5\"><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h6>\n            <h3 *ngSwitchDefault><ng-container *ngTemplateOutlet=\"itemHeaderContent; context: {item: item, id: getItemId(item, i), index: i}\"></ng-container></h3>\n        </ng-container>\n        <p class=\"sr-only\" aria-hidden=\"true\">Haz click en el bot\u00F3n anterior para mostrar u ocultar</p>\n        <ng-container *ngIf=\"!isFirst\">\n          <ng-container [ngSwitch]=\"item.status\">\n            <div *ngSwitchCase=\"'current'\" class=\"absolute -top-px -left-5 h-6 border-2 border-primary-base\"></div>\n            <div *ngSwitchCase=\"'pending'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'muted'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-base\"></div>\n            <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute -top-px -left-5 h-6 border-2 border-neutral-base\"></div>\n            <div *ngSwitchDefault class=\"absolute -top-px -left-5 h-6 border-2 border-primary-base\"></div>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!isLast\">\n          <ng-container [ngSwitch]=\"item.status\">\n            <div *ngSwitchCase=\"'current'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'pending'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchCase=\"'muted'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-base\"></div>\n            <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-6 bottom-0 -left-5 border-2 border-neutral-light\"></div>\n            <div *ngSwitchDefault class=\"absolute top-6 bottom-0 -left-5 border-2 border-primary-base\"></div>\n          </ng-container>\n        </ng-container>\n        <ng-container [ngSwitch]=\"item.status\">\n          <div *ngSwitchCase=\"'current'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-white ring-2 ring-primary-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: actual</p></div>\n          <div *ngSwitchCase=\"'pending'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-white border-2 border-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pendiente</p></div>\n          <div *ngSwitchCase=\"'muted'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-neutral-base border-2 border-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pasado</p></div>\n          <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-5 -left-6 w-3 h-3 bg-neutral-base ring-2 ring-neutral-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: actual</p></div>\n          <div *ngSwitchDefault class=\"absolute top-5 -left-6 w-3 h-3 bg-primary-base border-2 border-primary-base rounded-full\" role=\"img\"><p class=\"sr-only\">Estado: pasado</p></div>\n        </ng-container>\n\n        <div *ngIf=\"item.open\" [class]=\"['Accordion-panel relative', item.classes] | makeHtmlList\"\n             [attr.id]=\"getItemId(item, i)\"\n             [attr.role]=\"(item.role ? role : 'accordion')\"\n             [attr.aria-selected]=\"currentItem === i ? 'true' : 'false'\"\n             [attr.aria-describedby]=\"item.ariaDescribedBy\"\n             [attr.aria-errormessage]=\"item.ariaErrorMessage\"\n             [attr.aria-label]=\"item.ariaLabel\"\n             [attr.aria-labelledby]=\"item.ariaLabelledBy\"\n             [attr.aria-hidden]=\"item.ariaHidden\"\n             [attr.aria-controls]=\"'accordion-' + getItemId(item, i)\"\n             [attr.aria-current]=\"item.ariaCurrent\"\n             [attr.aria-live]=\"item.ariaLive\"\n             [attr.aria-expanded]=\"item.ariaExpanded\"\n             [attr.aria-haspopup]=\"item.ariaHasPopup\">\n          <ng-container *ngIf=\"!isLast\">\n            <ng-container [ngSwitch]=\"item.status\">\n              <div *ngSwitchCase=\"'current'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchCase=\"'pending'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchCase=\"'muted'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-base\"></div>\n              <div *ngSwitchCase=\"'currentmuted'\" class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-neutral-light\"></div>\n              <div *ngSwitchDefault class=\"absolute top-4 bottom-0 -left-6 -my-sm border-2 border-primary-base\"></div>\n            </ng-container>\n          </ng-container>\n          <ng-container *desyCustomInnerContent=\"{ component: getItemContent(item), html: item.html, text: item.text }\"></ng-container>\n        </div>\n      </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { itemComponentList: [{

package/esm2020/lib/desy-views/components/accordion-history/accordion-item-hide-button/accordion-item-hide-button.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class AccordionItemHideButtonComponent extends ContentBaseComponent {
 }
-AccordionItemHideButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AccordionItemHideButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-AccordionItemHideButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: AccordionItemHideButtonComponent, selector: "desy-accordion-item-hide-button", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AccordionItemHideButtonComponent, decorators: [{
+AccordionItemHideButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccordionItemHideButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+AccordionItemHideButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AccordionItemHideButtonComponent, selector: "desy-accordion-item-hide-button", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccordionItemHideButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-accordion-item-hide-button',

package/esm2020/lib/desy-views/components/accordion-history/accordion-item-show-button/accordion-item-show-button.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class AccordionItemShowButtonComponent extends ContentBaseComponent {
 }
-AccordionItemShowButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AccordionItemShowButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-AccordionItemShowButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: AccordionItemShowButtonComponent, selector: "desy-accordion-item-show-button", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AccordionItemShowButtonComponent, decorators: [{
+AccordionItemShowButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccordionItemShowButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+AccordionItemShowButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AccordionItemShowButtonComponent, selector: "desy-accordion-item-show-button", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccordionItemShowButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-accordion-item-show-button',

package/esm2020/lib/desy-views/components/alert/alert.component.mjs

@@ -54,9 +54,9 @@ export class AlertComponent extends AccessibilityComponent {
         }
     }
 }
-AlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AlertComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
-AlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: AlertComponent, selector: "desy-alert", inputs: { id: "id", classes: "classes", caller: "caller", focusFirst: "focusFirst", active: "active" }, outputs: { activeChange: "activeChange" }, viewQueries: [{ propertyName: "alertWrapper", first: true, predicate: ["alertWrapper"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: "<div #alertWrapper\n     [id]=\"id\" [class]=\"classes ? classes : null\"\n     [attr.role]=\"role ? role : null\"\n     [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n     [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n     [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n     [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n     [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n     [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n     [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n     [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n     [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n     [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n     [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n     [attr.aria-modal]=\"ariaModal ? ariaModal : null\">\n  <ng-container *ngIf=\"active\">\n    <ng-template #container></ng-template>\n    <ng-container *ngTemplateOutlet=\"caller; context:callerContext\"></ng-container>\n  </ng-container>\n</div>\n\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: AlertComponent, decorators: [{
+AlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+AlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AlertComponent, selector: "desy-alert", inputs: { id: "id", classes: "classes", caller: "caller", focusFirst: "focusFirst", active: "active" }, outputs: { activeChange: "activeChange" }, viewQueries: [{ propertyName: "alertWrapper", first: true, predicate: ["alertWrapper"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: "<div #alertWrapper\n     [id]=\"id\" [class]=\"classes ? classes : null\"\n     [attr.role]=\"role ? role : null\"\n     [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n     [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n     [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n     [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n     [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n     [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n     [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n     [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n     [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n     [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n     [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n     [attr.aria-modal]=\"ariaModal ? ariaModal : null\">\n  <ng-container *ngIf=\"active\">\n    <ng-template #container></ng-template>\n    <ng-container *ngTemplateOutlet=\"caller; context:callerContext\"></ng-container>\n  </ng-container>\n</div>\n\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertComponent, decorators: [{
             type: Component,
             args: [{ selector: 'desy-alert', template: "<div #alertWrapper\n     [id]=\"id\" [class]=\"classes ? classes : null\"\n     [attr.role]=\"role ? role : null\"\n     [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n     [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n     [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n     [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n     [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n     [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n     [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n     [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n     [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n     [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n     [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n     [attr.aria-modal]=\"ariaModal ? ariaModal : null\">\n  <ng-container *ngIf=\"active\">\n    <ng-template #container></ng-template>\n    <ng-container *ngTemplateOutlet=\"caller; context:callerContext\"></ng-container>\n  </ng-container>\n</div>\n\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { alertWrapper: [{

package/esm2020/lib/desy-views/components/collapsible/collapsible.component.mjs

@@ -28,8 +28,8 @@ export class CollapsibleComponent extends AccessibilityAndContentRequiredCompone
         this.toggleOpen();
     }
 }
-CollapsibleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: CollapsibleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-CollapsibleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: CollapsibleComponent, selector: "desy-collapsible", inputs: { headerText: "headerText", headerHtml: "headerHtml", id: "id", open: "open", classes: "classes" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"(classes ? classes : '-my-px py-sm border-t border-b border-neutral-base')\"\n    [attr.role]=\"role ? role : null\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n    [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n    [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n    [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n    [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n    [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n    [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n    [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n    [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n    [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n    [attr.tabindex]=\"tabindex ? tabindex : null\">\n    <h3>        \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\" 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\" 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\" aria-hidden=\"true\">{{show}}</span>\n        </button>\n    </h3>\n    <div *ngIf=\"open && html\"  @displayCollapsible [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <ng-container *ngTemplateOutlet=\"htmlTemplate\"></ng-container>\n    </div>\n    <div *ngIf=\"open && !html\" @displayCollapsible [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: i2.InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "pipe", type: i3.InnerHtmlPipe, name: "innerHtml" }], animations: [
+CollapsibleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CollapsibleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+CollapsibleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CollapsibleComponent, selector: "desy-collapsible", inputs: { headerText: "headerText", headerHtml: "headerHtml", id: "id", open: "open", classes: "classes" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"(classes ? classes : '-my-px py-sm border-t border-b border-neutral-base')\"\n    [attr.role]=\"role ? role : null\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n    [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n    [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n    [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n    [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n    [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n    [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n    [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n    [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n    [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n    [attr.tabindex]=\"tabindex ? tabindex : null\">\n    <h3>        \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\" 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\" 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\" aria-hidden=\"true\">{{show}}</span>\n        </button>\n    </h3>\n    <div *ngIf=\"open && html\"  @displayCollapsible [attr.id]=\"(id ? id : null)\" class=\"py-sm\">\n        <ng-container *ngTemplateOutlet=\"htmlTemplate\"></ng-container>\n    </div>\n    <div *ngIf=\"open && !html\" @displayCollapsible [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: i2.InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }, { kind: "pipe", type: i3.InnerHtmlPipe, name: "innerHtml" }], animations: [
         trigger('displayCollapsible', [
             state('void', style({
                 opacity: '0.0',
@@ -47,7 +47,7 @@ CollapsibleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
             ])
         ])
     ] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: CollapsibleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CollapsibleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'desy-collapsible', animations: [
                         trigger('displayCollapsible', [

package/esm2020/lib/desy-views/components/description-list/definition/definition.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class DefinitionComponent extends ContentBaseComponent {
 }
-DefinitionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DefinitionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DefinitionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DefinitionComponent, selector: "desy-definition", inputs: { classes: "classes", id: "id" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DefinitionComponent, decorators: [{
+DefinitionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DefinitionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+DefinitionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DefinitionComponent, selector: "desy-definition", inputs: { classes: "classes", id: "id" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DefinitionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-definition',

package/esm2020/lib/desy-views/components/description-list/description-item/description-item.component.mjs

@@ -6,15 +6,15 @@ import { DesyContentChild } from '../../../../shared/decorators/desy-content-chi
 import * as i0 from "@angular/core";
 export class DescriptionItemComponent {
 }
-DescriptionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DescriptionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DescriptionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DescriptionItemComponent, selector: "desy-description-item", inputs: { classes: "classes", id: "id" }, queries: [{ propertyName: "term", predicate: TermComponent }, { propertyName: "definition", predicate: DefinitionComponent }], ngImport: i0, template: '', isInline: true });
+DescriptionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DescriptionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+DescriptionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DescriptionItemComponent, selector: "desy-description-item", inputs: { classes: "classes", id: "id" }, queries: [{ propertyName: "term", predicate: TermComponent }, { propertyName: "definition", predicate: DefinitionComponent }], ngImport: i0, template: '', isInline: true });
 __decorate([
     DesyContentChild()
 ], DescriptionItemComponent.prototype, "term", void 0);
 __decorate([
     DesyContentChild()
 ], DescriptionItemComponent.prototype, "definition", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DescriptionItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DescriptionItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-description-item',

package/esm2020/lib/desy-views/components/description-list/description-list.component.mjs

@@ -10,9 +10,9 @@ export class DescriptionListComponent extends AccessibilityComponent {
         return items;
     }
 }
-DescriptionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DescriptionListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DescriptionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DescriptionListComponent, selector: "desy-description-list", inputs: { items: "items", classes: "classes", id: "id" }, queries: [{ propertyName: "itemComponents", predicate: DescriptionItemComponent }], usesInheritance: true, ngImport: i0, template: "<dl [class]=\"classes\"\n    [attr.id]=\"id ? id : null\"\n    [attr.role]=\"role\"\n    [attr.aria-describedby]=\"ariaDescribedBy\"\n    [attr.aria-errormessage]=\"ariaErrorMessage\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-hidden]=\"ariaHidden\"\n    [attr.aria-disabled]=\"ariaDisabled\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.aria-current]=\"ariaCurrent\"\n    [attr.aria-live]=\"ariaLive\"\n    [attr.aria-expanded]=\"ariaExpanded\"\n    [attr.aria-haspopup]=\"ariaHasPopup\"\n    [attr.tabindex]=\"tabindex\">\n    <div *ngFor=\"let item of getItems()\"\n        [class]=\"item.classes\"\n        [attr.id]=\"item.id ? item.id : null\"\n        [attr.role]=\"item.role\"\n        [attr.aria-describedby]=\"item.ariaDescribedBy\"\n        [attr.aria-errormessage]=\"item.ariaErrorMessage\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-labelledby]=\"item.ariaLabelledBy\"\n        [attr.aria-hidden]=\"item.ariaHidden\"\n        [attr.aria-disabled]=\"item.ariaDisabled\"\n        [attr.aria-controls]=\"item.ariaControls\"\n        [attr.aria-current]=\"item.ariaCurrent\"\n        [attr.aria-live]=\"item.ariaLive\"\n        [attr.aria-expanded]=\"item.ariaExpanded\"\n        [attr.aria-haspopup]=\"item.ariaHasPopup\"\n        [attr.tabindex]=\"item.tabindex\">\n        <dt [class]=\"(item.term.classes ?  item.term.classes : 'text-sm text-neutral-dark')\"\n            [attr.id]=\"item.term.id ? item.term.id : null\"\n            [attr.role]=\"item.term.role\"\n            [attr.aria-describedby]=\"item.term.ariaDescribedBy\"\n            [attr.aria-errormessage]=\"item.term.ariaErrorMessage\"\n            [attr.aria-label]=\"item.term.ariaLabel\"\n            [attr.aria-labelledby]=\"item.term.ariaLabelledBy\"\n            [attr.aria-hidden]=\"item.term.ariaHidden\"\n            [attr.aria-disabled]=\"item.term.ariaDisabled\"\n            [attr.aria-controls]=\"item.term.ariaControls\"\n            [attr.aria-current]=\"item.term.ariaCurrent\"\n            [attr.aria-live]=\"item.term.ariaLive\"\n            [attr.aria-expanded]=\"item.term.ariaExpanded\"\n            [attr.aria-haspopup]=\"item.term.ariaHasPopup\"\n            [attr.tabindex]=\"item.tabindex\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.term, html: item.term.html, text: item.term.text}\"></ng-container>\n        </dt>\n        <dd [class]=\"(item.definition.classes ?  item.definition.classes : 'text-base text-black')\"\n            [attr.id]=\"item.definition.id ? item.definition.id : null\"\n            [attr.role]=\"item.definition.role\"\n            [attr.aria-describedby]=\"item.definition.ariaDescribedBy\"\n            [attr.aria-errormessage]=\"item.definition.ariaErrorMessage\"\n            [attr.aria-label]=\"item.definition.ariaLabel\"\n            [attr.aria-labelledby]=\"item.definition.ariaLabelledBy\"\n            [attr.aria-hidden]=\"item.definition.ariaHidden\"\n            [attr.aria-disabled]=\"item.definition.ariaDisabled\"\n            [attr.aria-controls]=\"item.definition.ariaControls\"\n            [attr.aria-current]=\"item.definition.ariaCurrent\"\n            [attr.aria-live]=\"item.definition.ariaLive\"\n            [attr.aria-expanded]=\"item.definition.ariaExpanded\"\n            [attr.aria-haspopup]=\"item.definition.ariaHasPopup\"\n            [attr.tabindex]=\"item.tabindex\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.definition, html: item.definition.html, text: item.definition.text}\"></ng-container>\n        </dd>\n    </div>\n</dl>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DescriptionListComponent, decorators: [{
+DescriptionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DescriptionListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+DescriptionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DescriptionListComponent, selector: "desy-description-list", inputs: { items: "items", classes: "classes", id: "id" }, queries: [{ propertyName: "itemComponents", predicate: DescriptionItemComponent }], usesInheritance: true, ngImport: i0, template: "<dl [class]=\"classes\"\n    [attr.id]=\"id ? id : null\"\n    [attr.role]=\"role\"\n    [attr.aria-describedby]=\"ariaDescribedBy\"\n    [attr.aria-errormessage]=\"ariaErrorMessage\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-hidden]=\"ariaHidden\"\n    [attr.aria-disabled]=\"ariaDisabled\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.aria-current]=\"ariaCurrent\"\n    [attr.aria-live]=\"ariaLive\"\n    [attr.aria-expanded]=\"ariaExpanded\"\n    [attr.aria-haspopup]=\"ariaHasPopup\"\n    [attr.tabindex]=\"tabindex\">\n    <div *ngFor=\"let item of getItems()\"\n        [class]=\"item.classes\"\n        [attr.id]=\"item.id ? item.id : null\"\n        [attr.role]=\"item.role\"\n        [attr.aria-describedby]=\"item.ariaDescribedBy\"\n        [attr.aria-errormessage]=\"item.ariaErrorMessage\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-labelledby]=\"item.ariaLabelledBy\"\n        [attr.aria-hidden]=\"item.ariaHidden\"\n        [attr.aria-disabled]=\"item.ariaDisabled\"\n        [attr.aria-controls]=\"item.ariaControls\"\n        [attr.aria-current]=\"item.ariaCurrent\"\n        [attr.aria-live]=\"item.ariaLive\"\n        [attr.aria-expanded]=\"item.ariaExpanded\"\n        [attr.aria-haspopup]=\"item.ariaHasPopup\"\n        [attr.tabindex]=\"item.tabindex\">\n        <dt [class]=\"(item.term.classes ?  item.term.classes : 'text-sm text-neutral-dark')\"\n            [attr.id]=\"item.term.id ? item.term.id : null\"\n            [attr.role]=\"item.term.role\"\n            [attr.aria-describedby]=\"item.term.ariaDescribedBy\"\n            [attr.aria-errormessage]=\"item.term.ariaErrorMessage\"\n            [attr.aria-label]=\"item.term.ariaLabel\"\n            [attr.aria-labelledby]=\"item.term.ariaLabelledBy\"\n            [attr.aria-hidden]=\"item.term.ariaHidden\"\n            [attr.aria-disabled]=\"item.term.ariaDisabled\"\n            [attr.aria-controls]=\"item.term.ariaControls\"\n            [attr.aria-current]=\"item.term.ariaCurrent\"\n            [attr.aria-live]=\"item.term.ariaLive\"\n            [attr.aria-expanded]=\"item.term.ariaExpanded\"\n            [attr.aria-haspopup]=\"item.term.ariaHasPopup\"\n            [attr.tabindex]=\"item.tabindex\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.term, html: item.term.html, text: item.term.text}\"></ng-container>\n        </dt>\n        <dd [class]=\"(item.definition.classes ?  item.definition.classes : 'text-base text-black')\"\n            [attr.id]=\"item.definition.id ? item.definition.id : null\"\n            [attr.role]=\"item.definition.role\"\n            [attr.aria-describedby]=\"item.definition.ariaDescribedBy\"\n            [attr.aria-errormessage]=\"item.definition.ariaErrorMessage\"\n            [attr.aria-label]=\"item.definition.ariaLabel\"\n            [attr.aria-labelledby]=\"item.definition.ariaLabelledBy\"\n            [attr.aria-hidden]=\"item.definition.ariaHidden\"\n            [attr.aria-disabled]=\"item.definition.ariaDisabled\"\n            [attr.aria-controls]=\"item.definition.ariaControls\"\n            [attr.aria-current]=\"item.definition.ariaCurrent\"\n            [attr.aria-live]=\"item.definition.ariaLive\"\n            [attr.aria-expanded]=\"item.definition.ariaExpanded\"\n            [attr.aria-haspopup]=\"item.definition.ariaHasPopup\"\n            [attr.tabindex]=\"item.tabindex\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.definition, html: item.definition.html, text: item.definition.text}\"></ng-container>\n        </dd>\n    </div>\n</dl>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.CustomInnerContentDirective, selector: "[desyCustomInnerContent]", inputs: ["desyCustomInnerContent"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DescriptionListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'desy-description-list', template: "<dl [class]=\"classes\"\n    [attr.id]=\"id ? id : null\"\n    [attr.role]=\"role\"\n    [attr.aria-describedby]=\"ariaDescribedBy\"\n    [attr.aria-errormessage]=\"ariaErrorMessage\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-hidden]=\"ariaHidden\"\n    [attr.aria-disabled]=\"ariaDisabled\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.aria-current]=\"ariaCurrent\"\n    [attr.aria-live]=\"ariaLive\"\n    [attr.aria-expanded]=\"ariaExpanded\"\n    [attr.aria-haspopup]=\"ariaHasPopup\"\n    [attr.tabindex]=\"tabindex\">\n    <div *ngFor=\"let item of getItems()\"\n        [class]=\"item.classes\"\n        [attr.id]=\"item.id ? item.id : null\"\n        [attr.role]=\"item.role\"\n        [attr.aria-describedby]=\"item.ariaDescribedBy\"\n        [attr.aria-errormessage]=\"item.ariaErrorMessage\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-labelledby]=\"item.ariaLabelledBy\"\n        [attr.aria-hidden]=\"item.ariaHidden\"\n        [attr.aria-disabled]=\"item.ariaDisabled\"\n        [attr.aria-controls]=\"item.ariaControls\"\n        [attr.aria-current]=\"item.ariaCurrent\"\n        [attr.aria-live]=\"item.ariaLive\"\n        [attr.aria-expanded]=\"item.ariaExpanded\"\n        [attr.aria-haspopup]=\"item.ariaHasPopup\"\n        [attr.tabindex]=\"item.tabindex\">\n        <dt [class]=\"(item.term.classes ?  item.term.classes : 'text-sm text-neutral-dark')\"\n            [attr.id]=\"item.term.id ? item.term.id : null\"\n            [attr.role]=\"item.term.role\"\n            [attr.aria-describedby]=\"item.term.ariaDescribedBy\"\n            [attr.aria-errormessage]=\"item.term.ariaErrorMessage\"\n            [attr.aria-label]=\"item.term.ariaLabel\"\n            [attr.aria-labelledby]=\"item.term.ariaLabelledBy\"\n            [attr.aria-hidden]=\"item.term.ariaHidden\"\n            [attr.aria-disabled]=\"item.term.ariaDisabled\"\n            [attr.aria-controls]=\"item.term.ariaControls\"\n            [attr.aria-current]=\"item.term.ariaCurrent\"\n            [attr.aria-live]=\"item.term.ariaLive\"\n            [attr.aria-expanded]=\"item.term.ariaExpanded\"\n            [attr.aria-haspopup]=\"item.term.ariaHasPopup\"\n            [attr.tabindex]=\"item.tabindex\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.term, html: item.term.html, text: item.term.text}\"></ng-container>\n        </dt>\n        <dd [class]=\"(item.definition.classes ?  item.definition.classes : 'text-base text-black')\"\n            [attr.id]=\"item.definition.id ? item.definition.id : null\"\n            [attr.role]=\"item.definition.role\"\n            [attr.aria-describedby]=\"item.definition.ariaDescribedBy\"\n            [attr.aria-errormessage]=\"item.definition.ariaErrorMessage\"\n            [attr.aria-label]=\"item.definition.ariaLabel\"\n            [attr.aria-labelledby]=\"item.definition.ariaLabelledBy\"\n            [attr.aria-hidden]=\"item.definition.ariaHidden\"\n            [attr.aria-disabled]=\"item.definition.ariaDisabled\"\n            [attr.aria-controls]=\"item.definition.ariaControls\"\n            [attr.aria-current]=\"item.definition.ariaCurrent\"\n            [attr.aria-live]=\"item.definition.ariaLive\"\n            [attr.aria-expanded]=\"item.definition.ariaExpanded\"\n            [attr.aria-haspopup]=\"item.definition.ariaHasPopup\"\n            [attr.tabindex]=\"item.tabindex\">\n          <ng-container *desyCustomInnerContent=\"{ component: item.definition, html: item.definition.html, text: item.definition.text}\"></ng-container>\n        </dd>\n    </div>\n</dl>\n" }]
         }], propDecorators: { items: [{

package/esm2020/lib/desy-views/components/description-list/term/term.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class TermComponent extends ContentBaseComponent {
 }
-TermComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: TermComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TermComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: TermComponent, selector: "desy-term", inputs: { classes: "classes", id: "id" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: TermComponent, decorators: [{
+TermComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TermComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+TermComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TermComponent, selector: "desy-term", inputs: { classes: "classes", id: "id" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TermComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-term',

package/esm2020/lib/desy-views/components/details/details.component.mjs

@@ -8,9 +8,9 @@ export class DetailsComponent extends AccessibilityComponent {
         this.isHtml = Boolean(this.summaryHtml);
     }
 }
-DetailsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DetailsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DetailsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DetailsComponent, selector: "desy-details", inputs: { summaryText: "summaryText", summaryHtml: "summaryHtml", summaryClasses: "summaryClasses", containerClasses: "containerClasses", id: "id", open: "open", classes: "classes" }, usesInheritance: true, ngImport: i0, template: "<details \n    [attr.id]=\"id ? id : null\"\n    [class]=\"classes\"\n    [attr.open]=\"open ? open : null\"\n    [attr.role]=\"role ? role : null\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n    [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n    [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n    [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n    [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n    [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n    [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n    [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n    [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n    [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n    [attr.tabindex]=\"tabindex ? tabindex : null\">\n    <summary class=\"py-sm cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\">\n        <span [desyInnerContent]=\"summaryHtml ? summaryHtml : summaryText\" [isHtml]=\"isHtml\"\n              [class]=\"summaryClasses ? summaryClasses : 'c-link'\"></span>\n    </summary>\n    <div class=\"py-sm\">\n      <div [ngClass]=\"containerClasses\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n</details>  \n\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DetailsComponent, decorators: [{
+DetailsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DetailsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+DetailsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DetailsComponent, selector: "desy-details", inputs: { summaryText: "summaryText", summaryHtml: "summaryHtml", summaryClasses: "summaryClasses", containerClasses: "containerClasses", id: "id", open: "open", classes: "classes" }, usesInheritance: true, ngImport: i0, template: "<details \n    [attr.id]=\"id ? id : null\"\n    [class]=\"classes\"\n    [attr.open]=\"open ? open : null\"\n    [attr.role]=\"role ? role : null\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n    [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n    [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n    [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n    [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n    [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n    [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n    [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n    [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n    [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n    [attr.tabindex]=\"tabindex ? tabindex : null\">\n    <summary class=\"py-sm cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\">\n        <span [desyInnerContent]=\"summaryHtml ? summaryHtml : summaryText\" [isHtml]=\"isHtml\"\n              [class]=\"summaryClasses ? summaryClasses : 'c-link'\"></span>\n    </summary>\n    <div class=\"py-sm\">\n      <div [ngClass]=\"containerClasses\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n</details>  \n\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.InnerContentDirective, selector: "[desyInnerContent]", inputs: ["desyInnerContent", "isHtml", "deleteContentIfEmpty"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DetailsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'desy-details', template: "<details \n    [attr.id]=\"id ? id : null\"\n    [class]=\"classes\"\n    [attr.open]=\"open ? open : null\"\n    [attr.role]=\"role ? role : null\"\n    [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n    [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\n    [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\n    [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\n    [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\n    [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\n    [attr.aria-live]=\"ariaLive ? ariaLive : null\"\n    [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\n    [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\n    [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\n    [attr.tabindex]=\"tabindex ? tabindex : null\">\n    <summary class=\"py-sm cursor-pointer focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black\">\n        <span [desyInnerContent]=\"summaryHtml ? summaryHtml : summaryText\" [isHtml]=\"isHtml\"\n              [class]=\"summaryClasses ? summaryClasses : 'c-link'\"></span>\n    </summary>\n    <div class=\"py-sm\">\n      <div [ngClass]=\"containerClasses\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n</details>  \n\n" }]
         }], propDecorators: { summaryText: [{

package/esm2020/lib/desy-views/components/item/item-content-bottom/item-content-bottom.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class ItemContentBottomComponent extends ContentBaseComponent {
 }
-ItemContentBottomComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ItemContentBottomComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ItemContentBottomComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ItemContentBottomComponent, selector: "desy-item-content-bottom", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ItemContentBottomComponent, decorators: [{
+ItemContentBottomComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ItemContentBottomComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+ItemContentBottomComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ItemContentBottomComponent, selector: "desy-item-content-bottom", inputs: { classes: "classes" }, usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ItemContentBottomComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-item-content-bottom',

package/esm2020/lib/desy-views/components/item/item-content-right/item-content-right.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class ItemContentRightComponent extends ContentBaseComponent {
 }
-ItemContentRightComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ItemContentRightComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ItemContentRightComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ItemContentRightComponent, selector: "desy-item-content-right", usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ItemContentRightComponent, decorators: [{
+ItemContentRightComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ItemContentRightComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+ItemContentRightComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ItemContentRightComponent, selector: "desy-item-content-right", usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ItemContentRightComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-item-content-right',

package/esm2020/lib/desy-views/components/item/item-item/item-item.component.mjs

@@ -3,9 +3,9 @@ import { ContentBaseComponent } from '../../../../shared/components';
 import * as i0 from "@angular/core";
 export class ItemItemComponent extends ContentBaseComponent {
 }
-ItemItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ItemItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ItemItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ItemItemComponent, selector: "desy-item-item", usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ItemItemComponent, decorators: [{
+ItemItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ItemItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+ItemItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ItemItemComponent, selector: "desy-item-item", usesInheritance: true, ngImport: i0, template: '<ng-template #contentTemplate><ng-content></ng-content></ng-template>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ItemItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'desy-item-item',