@inera/ids-angular 9.2.1 → 9.3.0

package/fesm2022/inera-ids-angular-components-alert.mjs

@@ -1,13 +1,13 @@
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { TemplateRef, ViewChild, Component, inject, EventEmitter, booleanAttribute, ContentChild, Output, Input } from '@angular/core';
+import { viewChild, TemplateRef, Component, inject, EventEmitter, contentChild, booleanAttribute, Output, Input } from '@angular/core';
 import { IDUseIdService } from '@inera/ids-angular/common';
 
 class IDAlertHeaderComponent {
-    template;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDAlertHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDAlertHeaderComponent, isStandalone: true, selector: "id-alert-header", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDAlertHeaderComponent, isStandalone: true, selector: "id-alert-header", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template>
       <ng-content></ng-content>
     </ng-template>`, isInline: true });
@@ -22,10 +22,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
       <ng-content></ng-content>
     </ng-template>`
                 }]
-        }], propDecorators: { template: [{
-                type: ViewChild,
-                args: [TemplateRef]
-            }] } });
+        }] });
 
 class IDAlertComponent {
     _collapsed = false;
@@ -53,12 +50,12 @@ class IDAlertComponent {
     dismissed = new EventEmitter();
     closed = new EventEmitter();
     opened = new EventEmitter();
-    header;
+    header = contentChild(IDAlertHeaderComponent);
     get hostClasses() {
         return `ids-alert ids-alert--${this.type}`;
     }
     ngAfterContentInit() {
-        if (this.header === undefined) {
+        if (this.header() === undefined) {
             this.compact = true;
         }
     }
@@ -81,7 +78,7 @@ class IDAlertComponent {
         this.dismissed.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDAlertComponent, isStandalone: true, selector: "id-alert", inputs: { dismissible: ["dismissible", "dismissible", booleanAttribute], collapsible: ["collapsible", "collapsible", booleanAttribute], compact: ["compact", "compact", booleanAttribute], ribbon: ["ribbon", "ribbon", booleanAttribute], type: "type", noRole: ["noRole", "noRole", booleanAttribute], srCloseText: "srCloseText", srIconTitle: "srIconTitle", srCollapseText: "srCollapseText", srExpandText: "srExpandText", collapsed: "collapsed" }, outputs: { collapsedChange: "collapsedChange", dismissed: "dismissed", closed: "closed", opened: "opened" }, host: { properties: { "class": "hostClasses", "class.ids-alert--collapsible": "collapsible", "class.ids-alert--dismissible": "dismissible", "class.ids-alert--ribbon": "ribbon", "class.ids-alert--compact": "compact", "class.ids-alert--collapsed": "collapsed", "attr.ids-alert--dismissible": "dismissible ? \"\" : null", "attr.role": "noRole ? null : \"alert\"" } }, queries: [{ propertyName: "header", first: true, predicate: IDAlertHeaderComponent, descendants: true }], ngImport: i0, template: "<ng-template #contentTemplate>\n  <ng-content select=\":not(id-alert-header)\"></ng-content>\n</ng-template>\n\n@if (compact || ribbon) {\n  <div class=\"ids-alert__content\">\n    <span\n      class=\"ids-alert__content-icon\"\n      aria-hidden\n    ></span>\n    <span class=\"ids-alert__content-text\">\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </span>\n  </div>\n\n  @if (dismissible) {\n    <div class=\"ids-alert__button\">\n      <button\n        class=\"ids-alert__close\"\n        (click)=\"dismissAlert()\"\n        [attr.aria-label]=\"srCloseText\"\n      >\n        <span\n          class=\"ids-alert__close-icon\"\n          aria-hidden\n        ></span>\n      </button>\n    </div>\n  }\n}\n\n@if (!compact && !ribbon) {\n  <div class=\"ids-alert__container\">\n    <div class=\"ids-alert__header\">\n      <ng-template #headerContentTemplate>\n        <div class=\"ids-alert__icon_and_text\">\n          <span\n            class=\"ids-alert__state-icon\"\n            aria-hidden\n          ></span>\n          <div class=\"ids-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\n          </div>\n        </div>\n      </ng-template>\n\n      @if (collapsible) {\n        <button\n          class=\"ids-alert__expand-button\"\n          [class.ids-alert__expand-button--expanded]=\"!collapsed\"\n          (click)=\"toggleCollapsed()\"\n          [attr.aria-expanded]=\"!collapsed\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-label]=\"collapsed ? srExpandText : srCollapseText\"\n        >\n          <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n        </button>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n      }\n    </div>\n\n    <div\n      class=\"ids-alert__content\"\n      [attr.id]=\"contentId\"\n      [attr.aria-hidden]=\"collapsible && collapsed ? 'true' : 'false'\"\n    >\n      @if (!collapsed) {\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n      }\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDAlertComponent, isStandalone: true, selector: "id-alert", inputs: { dismissible: ["dismissible", "dismissible", booleanAttribute], collapsible: ["collapsible", "collapsible", booleanAttribute], compact: ["compact", "compact", booleanAttribute], ribbon: ["ribbon", "ribbon", booleanAttribute], type: "type", noRole: ["noRole", "noRole", booleanAttribute], srCloseText: "srCloseText", srIconTitle: "srIconTitle", srCollapseText: "srCollapseText", srExpandText: "srExpandText", collapsed: "collapsed" }, outputs: { collapsedChange: "collapsedChange", dismissed: "dismissed", closed: "closed", opened: "opened" }, host: { properties: { "class": "hostClasses", "class.ids-alert--collapsible": "collapsible", "class.ids-alert--dismissible": "dismissible", "class.ids-alert--ribbon": "ribbon", "class.ids-alert--compact": "compact", "class.ids-alert--collapsed": "collapsed", "attr.ids-alert--dismissible": "dismissible ? \"\" : null", "attr.role": "noRole ? null : \"alert\"" } }, queries: [{ propertyName: "header", first: true, predicate: IDAlertHeaderComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #contentTemplate>\n  <ng-content select=\":not(id-alert-header)\"></ng-content>\n</ng-template>\n\n@if (compact || ribbon) {\n  <div class=\"ids-alert__content\">\n    <span\n      class=\"ids-alert__content-icon\"\n      aria-hidden\n    ></span>\n    <span class=\"ids-alert__content-text\">\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </span>\n  </div>\n\n  @if (dismissible) {\n    <div class=\"ids-alert__button\">\n      <button\n        class=\"ids-alert__close\"\n        (click)=\"dismissAlert()\"\n        [attr.aria-label]=\"srCloseText\"\n      ></button>\n    </div>\n  }\n}\n\n@if (!compact && !ribbon) {\n  <div class=\"ids-alert__container\">\n    <div class=\"ids-alert__header\">\n      <ng-template #headerContentTemplate>\n        <div class=\"ids-alert__icon_and_text\">\n          <span\n            class=\"ids-alert__state-icon\"\n            aria-hidden\n          ></span>\n          <div class=\"ids-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header()!.template()\"></ng-container>\n          </div>\n        </div>\n      </ng-template>\n\n      @if (collapsible) {\n        <button\n          class=\"ids-alert__expand-button\"\n          [class.ids-alert__expand-button--expanded]=\"!collapsed\"\n          (click)=\"toggleCollapsed()\"\n          [attr.aria-expanded]=\"!collapsed\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-label]=\"collapsed ? srExpandText : srCollapseText\"\n        >\n          <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n        </button>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n      }\n      @if (dismissible) {\n          <button\n            class=\"ids-alert__close\"\n            (click)=\"dismissAlert()\"\n            [attr.aria-label]=\"srCloseText\"\n          ></button>\n      }\n    </div>\n\n    <div\n      class=\"ids-alert__content\"\n      [attr.id]=\"contentId\"\n      [attr.aria-hidden]=\"collapsible && collapsed ? 'true' : 'false'\"\n    >\n      @if (!collapsed) {\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n      }\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDAlertComponent, decorators: [{
             type: Component,
@@ -94,7 +91,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         '[class.ids-alert--collapsed]': 'collapsed',
                         '[attr.ids-alert--dismissible]': 'dismissible ? "" : null',
                         '[attr.role]': 'noRole ? null : "alert"',
-                    }, imports: [CommonModule], standalone: true, template: "<ng-template #contentTemplate>\n  <ng-content select=\":not(id-alert-header)\"></ng-content>\n</ng-template>\n\n@if (compact || ribbon) {\n  <div class=\"ids-alert__content\">\n    <span\n      class=\"ids-alert__content-icon\"\n      aria-hidden\n    ></span>\n    <span class=\"ids-alert__content-text\">\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </span>\n  </div>\n\n  @if (dismissible) {\n    <div class=\"ids-alert__button\">\n      <button\n        class=\"ids-alert__close\"\n        (click)=\"dismissAlert()\"\n        [attr.aria-label]=\"srCloseText\"\n      >\n        <span\n          class=\"ids-alert__close-icon\"\n          aria-hidden\n        ></span>\n      </button>\n    </div>\n  }\n}\n\n@if (!compact && !ribbon) {\n  <div class=\"ids-alert__container\">\n    <div class=\"ids-alert__header\">\n      <ng-template #headerContentTemplate>\n        <div class=\"ids-alert__icon_and_text\">\n          <span\n            class=\"ids-alert__state-icon\"\n            aria-hidden\n          ></span>\n          <div class=\"ids-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\n          </div>\n        </div>\n      </ng-template>\n\n      @if (collapsible) {\n        <button\n          class=\"ids-alert__expand-button\"\n          [class.ids-alert__expand-button--expanded]=\"!collapsed\"\n          (click)=\"toggleCollapsed()\"\n          [attr.aria-expanded]=\"!collapsed\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-label]=\"collapsed ? srExpandText : srCollapseText\"\n        >\n          <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n        </button>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n      }\n    </div>\n\n    <div\n      class=\"ids-alert__content\"\n      [attr.id]=\"contentId\"\n      [attr.aria-hidden]=\"collapsible && collapsed ? 'true' : 'false'\"\n    >\n      @if (!collapsed) {\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n      }\n    </div>\n  </div>\n}\n" }]
+                    }, imports: [CommonModule], standalone: true, template: "<ng-template #contentTemplate>\n  <ng-content select=\":not(id-alert-header)\"></ng-content>\n</ng-template>\n\n@if (compact || ribbon) {\n  <div class=\"ids-alert__content\">\n    <span\n      class=\"ids-alert__content-icon\"\n      aria-hidden\n    ></span>\n    <span class=\"ids-alert__content-text\">\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </span>\n  </div>\n\n  @if (dismissible) {\n    <div class=\"ids-alert__button\">\n      <button\n        class=\"ids-alert__close\"\n        (click)=\"dismissAlert()\"\n        [attr.aria-label]=\"srCloseText\"\n      ></button>\n    </div>\n  }\n}\n\n@if (!compact && !ribbon) {\n  <div class=\"ids-alert__container\">\n    <div class=\"ids-alert__header\">\n      <ng-template #headerContentTemplate>\n        <div class=\"ids-alert__icon_and_text\">\n          <span\n            class=\"ids-alert__state-icon\"\n            aria-hidden\n          ></span>\n          <div class=\"ids-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header()!.template()\"></ng-container>\n          </div>\n        </div>\n      </ng-template>\n\n      @if (collapsible) {\n        <button\n          class=\"ids-alert__expand-button\"\n          [class.ids-alert__expand-button--expanded]=\"!collapsed\"\n          (click)=\"toggleCollapsed()\"\n          [attr.aria-expanded]=\"!collapsed\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-label]=\"collapsed ? srExpandText : srCollapseText\"\n        >\n          <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n        </button>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n      }\n      @if (dismissible) {\n          <button\n            class=\"ids-alert__close\"\n            (click)=\"dismissAlert()\"\n            [attr.aria-label]=\"srCloseText\"\n          ></button>\n      }\n    </div>\n\n    <div\n      class=\"ids-alert__content\"\n      [attr.id]=\"contentId\"\n      [attr.aria-hidden]=\"collapsible && collapsed ? 'true' : 'false'\"\n    >\n      @if (!collapsed) {\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n      }\n    </div>\n  </div>\n}\n" }]
         }], propDecorators: { dismissible: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -130,9 +127,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Output
             }], opened: [{
                 type: Output
-            }], header: [{
-                type: ContentChild,
-                args: [IDAlertHeaderComponent]
             }] } });
 
 /**

package/fesm2022/inera-ids-angular-components-alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-alert.mjs","sources":["../../../projects/ids-angular/components/alert/alert-header.component.ts","../../../projects/ids-angular/components/alert/alert.component.ts","../../../projects/ids-angular/components/alert/alert.component.html","../../../projects/ids-angular/components/alert/inera-ids-angular-components-alert.ts"],"sourcesContent":["import { Component, TemplateRef, ViewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-alert-header',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDAlertHeaderComponent {\n\n  @ViewChild(TemplateRef) template: TemplateRef<any>;\n\n}\n","import { CommonModule } from \"@angular/common\";\nimport { Component, ContentChild, EventEmitter, Input, Output, booleanAttribute, inject, AfterContentInit } from \"@angular/core\";\nimport { IDAlertHeaderComponent } from \"./alert-header.component\";\nimport { IDUseIdService } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-alert\",\n  templateUrl: \"./alert.component.html\",\n  host: {\n    '[class]': 'hostClasses',\n    '[class.ids-alert--collapsible]': 'collapsible',\n    '[class.ids-alert--dismissible]': 'dismissible',\n    '[class.ids-alert--ribbon]': 'ribbon',\n    '[class.ids-alert--compact]': 'compact',\n    '[class.ids-alert--collapsed]': 'collapsed',\n    '[attr.ids-alert--dismissible]': 'dismissible ? \"\" : null',\n    '[attr.role]': 'noRole ? null : \"alert\"',\n  },\n  imports: [CommonModule],\n  standalone: true,\n})\nexport class IDAlertComponent implements AfterContentInit {\n\n  private _collapsed: boolean = false;\n  private idService = inject(IDUseIdService);\n  protected contentId = this.idService.generateId('alert');\n\n  @Input({ transform: booleanAttribute }) dismissible: boolean = false;\n  @Input({ transform: booleanAttribute }) collapsible: boolean = false;\n  @Input({ transform: booleanAttribute }) compact: boolean = false;\n  @Input({ transform: booleanAttribute }) ribbon: boolean = false;\n  @Input() type: \"info\" | \"attention\" | \"success\" | \"error\" = \"info\";\n  @Input({ transform: booleanAttribute }) noRole: boolean = false;\n  @Input() srCloseText: string = \"Stäng alertmeddelande\";\n  @Input() srIconTitle: string = \"Ikon\";\n  @Input() srCollapseText: string = \"Minimera alertmeddelande\";\n  @Input() srExpandText: string = \"Expandera alertmeddelande\";\n\n\n  @Input()\n  get collapsed(): boolean {\n    return this._collapsed;\n  }\n  set collapsed(value: boolean) {\n    if (this._collapsed !== value) {\n      this._collapsed = value;\n    }\n  }\n  @Output() collapsedChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n  @Output() dismissed: EventEmitter<void> = new EventEmitter<void>();\n  @Output() closed: EventEmitter<void> = new EventEmitter<void>();\n  @Output() opened: EventEmitter<void> = new EventEmitter<void>();\n\n  @ContentChild(IDAlertHeaderComponent)\n  header: IDAlertHeaderComponent;\n\n\n  get hostClasses(): string {\n    return `ids-alert ids-alert--${this.type}`;\n  }\n\n\n  ngAfterContentInit(): void {\n    if (this.header === undefined) {\n      this.compact = true;\n    } \n  }\n\n\n  toggleCollapsed() {\n    if (!this.collapsible) return;\n    const newState = !this.collapsed;\n    this._collapsed = newState;\n    this.collapsedChange.emit(newState);\n    if(this.collapsed) {\n      this.closed.emit();\n    } else {\n      this.opened.emit();\n    }\n  }\n\n  dismissAlert() {\n    if (!this.dismissible) return;\n    this.dismissed.emit();\n  }\n}","<ng-template #contentTemplate>\n  <ng-content select=\":not(id-alert-header)\"></ng-content>\n</ng-template>\n\n@if (compact || ribbon) {\n  <div class=\"ids-alert__content\">\n    <span\n      class=\"ids-alert__content-icon\"\n      aria-hidden\n    ></span>\n    <span class=\"ids-alert__content-text\">\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </span>\n  </div>\n\n  @if (dismissible) {\n    <div class=\"ids-alert__button\">\n      <button\n        class=\"ids-alert__close\"\n        (click)=\"dismissAlert()\"\n        [attr.aria-label]=\"srCloseText\"\n      >\n        <span\n          class=\"ids-alert__close-icon\"\n          aria-hidden\n        ></span>\n      </button>\n    </div>\n  }\n}\n\n@if (!compact && !ribbon) {\n  <div class=\"ids-alert__container\">\n    <div class=\"ids-alert__header\">\n      <ng-template #headerContentTemplate>\n        <div class=\"ids-alert__icon_and_text\">\n          <span\n            class=\"ids-alert__state-icon\"\n            aria-hidden\n          ></span>\n          <div class=\"ids-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\n          </div>\n        </div>\n      </ng-template>\n\n      @if (collapsible) {\n        <button\n          class=\"ids-alert__expand-button\"\n          [class.ids-alert__expand-button--expanded]=\"!collapsed\"\n          (click)=\"toggleCollapsed()\"\n          [attr.aria-expanded]=\"!collapsed\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-label]=\"collapsed ? srExpandText : srCollapseText\"\n        >\n          <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n        </button>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n      }\n    </div>\n\n    <div\n      class=\"ids-alert__content\"\n      [attr.id]=\"contentId\"\n      [attr.aria-hidden]=\"collapsible && collapsed ? 'true' : 'false'\"\n    >\n      @if (!collapsed) {\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n      }\n    </div>\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"inera-ids-angular-components-alert.mjs","sources":["../../../projects/ids-angular/components/alert/alert-header.component.ts","../../../projects/ids-angular/components/alert/alert.component.ts","../../../projects/ids-angular/components/alert/alert.component.html","../../../projects/ids-angular/components/alert/inera-ids-angular-components-alert.ts"],"sourcesContent":["import { Component, TemplateRef, viewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-alert-header',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDAlertHeaderComponent {\n\n  template = viewChild.required(TemplateRef);\n\n}\n","import { CommonModule } from \"@angular/common\";\nimport { Component, EventEmitter, Input, Output, booleanAttribute, inject, AfterContentInit, contentChild } from '@angular/core';\nimport { IDAlertHeaderComponent } from \"./alert-header.component\";\nimport { IDUseIdService } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-alert\",\n  templateUrl: \"./alert.component.html\",\n  host: {\n    '[class]': 'hostClasses',\n    '[class.ids-alert--collapsible]': 'collapsible',\n    '[class.ids-alert--dismissible]': 'dismissible',\n    '[class.ids-alert--ribbon]': 'ribbon',\n    '[class.ids-alert--compact]': 'compact',\n    '[class.ids-alert--collapsed]': 'collapsed',\n    '[attr.ids-alert--dismissible]': 'dismissible ? \"\" : null',\n    '[attr.role]': 'noRole ? null : \"alert\"',\n  },\n  imports: [CommonModule],\n  standalone: true,\n})\nexport class IDAlertComponent implements AfterContentInit {\n\n  private _collapsed: boolean = false;\n  private idService = inject(IDUseIdService);\n  protected contentId = this.idService.generateId('alert');\n\n  @Input({ transform: booleanAttribute }) dismissible: boolean = false;\n  @Input({ transform: booleanAttribute }) collapsible: boolean = false;\n  @Input({ transform: booleanAttribute }) compact: boolean = false;\n  @Input({ transform: booleanAttribute }) ribbon: boolean = false;\n  @Input() type: \"info\" | \"attention\" | \"success\" | \"error\" = \"info\";\n  @Input({ transform: booleanAttribute }) noRole: boolean = false;\n  @Input() srCloseText: string = \"Stäng alertmeddelande\";\n  @Input() srIconTitle: string = \"Ikon\";\n  @Input() srCollapseText: string = \"Minimera alertmeddelande\";\n  @Input() srExpandText: string = \"Expandera alertmeddelande\";\n\n\n  @Input()\n  get collapsed(): boolean {\n    return this._collapsed;\n  }\n  set collapsed(value: boolean) {\n    if (this._collapsed !== value) {\n      this._collapsed = value;\n    }\n  }\n  @Output() collapsedChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n  @Output() dismissed: EventEmitter<void> = new EventEmitter<void>();\n  @Output() closed: EventEmitter<void> = new EventEmitter<void>();\n  @Output() opened: EventEmitter<void> = new EventEmitter<void>();\n\n  header = contentChild(IDAlertHeaderComponent);\n\n  get hostClasses(): string {\n    return `ids-alert ids-alert--${this.type}`;\n  }\n\n\n  ngAfterContentInit(): void {\n    if (this.header() === undefined) {\n      this.compact = true;\n    } \n  }\n\n\n  toggleCollapsed() {\n    if (!this.collapsible) return;\n    const newState = !this.collapsed;\n    this._collapsed = newState;\n    this.collapsedChange.emit(newState);\n    if(this.collapsed) {\n      this.closed.emit();\n    } else {\n      this.opened.emit();\n    }\n  }\n\n  dismissAlert() {\n    if (!this.dismissible) return;\n    this.dismissed.emit();\n  }\n}","<ng-template #contentTemplate>\n  <ng-content select=\":not(id-alert-header)\"></ng-content>\n</ng-template>\n\n@if (compact || ribbon) {\n  <div class=\"ids-alert__content\">\n    <span\n      class=\"ids-alert__content-icon\"\n      aria-hidden\n    ></span>\n    <span class=\"ids-alert__content-text\">\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    </span>\n  </div>\n\n  @if (dismissible) {\n    <div class=\"ids-alert__button\">\n      <button\n        class=\"ids-alert__close\"\n        (click)=\"dismissAlert()\"\n        [attr.aria-label]=\"srCloseText\"\n      ></button>\n    </div>\n  }\n}\n\n@if (!compact && !ribbon) {\n  <div class=\"ids-alert__container\">\n    <div class=\"ids-alert__header\">\n      <ng-template #headerContentTemplate>\n        <div class=\"ids-alert__icon_and_text\">\n          <span\n            class=\"ids-alert__state-icon\"\n            aria-hidden\n          ></span>\n          <div class=\"ids-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header()!.template()\"></ng-container>\n          </div>\n        </div>\n      </ng-template>\n\n      @if (collapsible) {\n        <button\n          class=\"ids-alert__expand-button\"\n          [class.ids-alert__expand-button--expanded]=\"!collapsed\"\n          (click)=\"toggleCollapsed()\"\n          [attr.aria-expanded]=\"!collapsed\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-label]=\"collapsed ? srExpandText : srCollapseText\"\n        >\n          <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n        </button>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"headerContentTemplate\"></ng-container>\n      }\n      @if (dismissible) {\n          <button\n            class=\"ids-alert__close\"\n            (click)=\"dismissAlert()\"\n            [attr.aria-label]=\"srCloseText\"\n          ></button>\n      }\n    </div>\n\n    <div\n      class=\"ids-alert__content\"\n      [attr.id]=\"contentId\"\n      [attr.aria-hidden]=\"collapsible && collapsed ? 'true' : 'false'\"\n    >\n      @if (!collapsed) {\n        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n      }\n    </div>\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/inera-ids-angular-components-box-link.mjs

@@ -1,12 +1,12 @@
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { TemplateRef, ViewChild, Component, ContentChild } from '@angular/core';
+import { viewChild, TemplateRef, Component, contentChild } from '@angular/core';
 
 class IDBoxLinkButtonComponent {
-    template;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDBoxLinkButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDBoxLinkButtonComponent, isStandalone: true, selector: "id-box-link-button", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDBoxLinkButtonComponent, isStandalone: true, selector: "id-box-link-button", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template>
       <ng-content></ng-content>
     </ng-template>`, isInline: true });
@@ -21,25 +21,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
     </ng-template>`,
                     standalone: true,
                 }]
-        }], propDecorators: { template: [{
-                type: ViewChild,
-                args: [TemplateRef]
-            }] } });
+        }] });
 
 class IDBoxLinkComponent {
-    button;
+    button = contentChild(IDBoxLinkButtonComponent);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDBoxLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDBoxLinkComponent, isStandalone: true, selector: "id-box-link", host: { classAttribute: "ids-box-link" }, queries: [{ propertyName: "button", first: true, predicate: IDBoxLinkButtonComponent, descendants: true }], ngImport: i0, template: "<div class=\"ids-box-link\">\n  <div class=\"ids-box-link__inner\">\n    <div class=\"ids-box-link__link\">\n      <ng-content select=\":not(id-box-link-button)\"></ng-content>\n    </div>\n    @if(button) {\n    <div class=\"ids-box-link__button\">\n      <ng-container *ngTemplateOutlet=\"button.template\"></ng-container>\n    </div>\n    }\n  </div>\n</div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDBoxLinkComponent, isStandalone: true, selector: "id-box-link", host: { classAttribute: "ids-box-link" }, queries: [{ propertyName: "button", first: true, predicate: IDBoxLinkButtonComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ids-box-link\">\n  <div class=\"ids-box-link__inner\">\n    <div class=\"ids-box-link__link\">\n      <ng-content select=\":not(id-box-link-button)\"></ng-content>\n    </div>\n    @if(button()) {\n    <div class=\"ids-box-link__button\">\n      <ng-container *ngTemplateOutlet=\"button()!.template()\"></ng-container>\n    </div>\n    }\n  </div>\n</div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDBoxLinkComponent, decorators: [{
             type: Component,
             args: [{ selector: "id-box-link", imports: [CommonModule], standalone: true, host: {
                         class: 'ids-box-link'
-                    }, template: "<div class=\"ids-box-link\">\n  <div class=\"ids-box-link__inner\">\n    <div class=\"ids-box-link__link\">\n      <ng-content select=\":not(id-box-link-button)\"></ng-content>\n    </div>\n    @if(button) {\n    <div class=\"ids-box-link__button\">\n      <ng-container *ngTemplateOutlet=\"button.template\"></ng-container>\n    </div>\n    }\n  </div>\n</div>" }]
-        }], propDecorators: { button: [{
-                type: ContentChild,
-                args: [IDBoxLinkButtonComponent]
-            }] } });
+                    }, template: "<div class=\"ids-box-link\">\n  <div class=\"ids-box-link__inner\">\n    <div class=\"ids-box-link__link\">\n      <ng-content select=\":not(id-box-link-button)\"></ng-content>\n    </div>\n    @if(button()) {\n    <div class=\"ids-box-link__button\">\n      <ng-container *ngTemplateOutlet=\"button()!.template()\"></ng-container>\n    </div>\n    }\n  </div>\n</div>" }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/inera-ids-angular-components-box-link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-box-link.mjs","sources":["../../../projects/ids-angular/components/box-link/box-link-button.component.ts","../../../projects/ids-angular/components/box-link/box-link.component.ts","../../../projects/ids-angular/components/box-link/box-link.component.html","../../../projects/ids-angular/components/box-link/inera-ids-angular-components-box-link.ts"],"sourcesContent":["import { Component, TemplateRef, ViewChild } from \"@angular/core\";\n\n@Component({\n  selector: \"id-box-link-button\",\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`,\n  standalone: true,\n})\nexport class IDBoxLinkButtonComponent {\n\n  @ViewChild(TemplateRef) template: TemplateRef<any>;\n\n}\n","import { CommonModule } from \"@angular/common\";\nimport { Component, ContentChild } from \"@angular/core\";\nimport { IDBoxLinkButtonComponent } from \"./box-link-button.component\";\n\n@Component({\n  selector: \"id-box-link\",\n  templateUrl: \"./box-link.component.html\",\n  imports: [CommonModule],\n  standalone: true,\n  host: {\n    class: 'ids-box-link'\n  }\n})\nexport class IDBoxLinkComponent {\n\n  @ContentChild(IDBoxLinkButtonComponent)\n  button: IDBoxLinkButtonComponent;\n\n}\n","<div class=\"ids-box-link\">\n  <div class=\"ids-box-link__inner\">\n    <div class=\"ids-box-link__link\">\n      <ng-content select=\":not(id-box-link-button)\"></ng-content>\n    </div>\n    @if(button) {\n    <div class=\"ids-box-link__button\">\n      <ng-container *ngTemplateOutlet=\"button.template\"></ng-container>\n    </div>\n    }\n  </div>\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAUa,wBAAwB,CAAA;AAEX,IAAA,QAAQ;wGAFrB,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAExB,WAAW,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARZ;;;AAGO,kBAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;4FAGN,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBARpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,QAAQ,EAAE;;;AAGO,kBAAA,CAAA;AACjB,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA;8BAGyB,QAAQ,EAAA,CAAA;sBAA/B,SAAS;uBAAC,WAAW;;;MCCX,kBAAkB,CAAA;AAG7B,IAAA,MAAM;wGAHK,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAEf,wBAAwB,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECfxC,2WAWM,2CDJM,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;4FAMX,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAT9B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,WAEd,CAAC,YAAY,CAAC,EAAA,UAAA,EACX,IAAI,EAAA,IAAA,EACV;AACJ,wBAAA,KAAK,EAAE;AACR,qBAAA,EAAA,QAAA,EAAA,2WAAA,EAAA;8BAKD,MAAM,EAAA,CAAA;sBADL,YAAY;uBAAC,wBAAwB;;;AEfxC;;AAEG;;;;"}
+{"version":3,"file":"inera-ids-angular-components-box-link.mjs","sources":["../../../projects/ids-angular/components/box-link/box-link-button.component.ts","../../../projects/ids-angular/components/box-link/box-link.component.ts","../../../projects/ids-angular/components/box-link/box-link.component.html","../../../projects/ids-angular/components/box-link/inera-ids-angular-components-box-link.ts"],"sourcesContent":["import { Component, TemplateRef, viewChild } from '@angular/core';\n\n@Component({\n  selector: \"id-box-link-button\",\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`,\n  standalone: true,\n})\nexport class IDBoxLinkButtonComponent {\n\n  template = viewChild.required(TemplateRef);\n\n}\n","import { CommonModule } from \"@angular/common\";\nimport { Component, contentChild } from '@angular/core';\nimport { IDBoxLinkButtonComponent } from \"./box-link-button.component\";\n\n@Component({\n  selector: \"id-box-link\",\n  templateUrl: \"./box-link.component.html\",\n  imports: [CommonModule],\n  standalone: true,\n  host: {\n    class: 'ids-box-link'\n  }\n})\nexport class IDBoxLinkComponent {\n\n    button = contentChild(IDBoxLinkButtonComponent);\n\n}\n","<div class=\"ids-box-link\">\n  <div class=\"ids-box-link__inner\">\n    <div class=\"ids-box-link__link\">\n      <ng-content select=\":not(id-box-link-button)\"></ng-content>\n    </div>\n    @if(button()) {\n    <div class=\"ids-box-link__button\">\n      <ng-container *ngTemplateOutlet=\"button()!.template()\"></ng-container>\n    </div>\n    }\n  </div>\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAUa,wBAAwB,CAAA;AAEnC,IAAA,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC;wGAF/B,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAEL,WAAW,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAR/B;;;AAGO,kBAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;4FAGN,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBARpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,QAAQ,EAAE;;;AAGO,kBAAA,CAAA;AACjB,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA;;;MCIY,kBAAkB,CAAA;AAE3B,IAAA,MAAM,GAAG,YAAY,CAAC,wBAAwB,CAAC;wGAFtC,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAEL,wBAAwB,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECflD,kXAWM,2CDJM,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;4FAMX,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAT9B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,WAEd,CAAC,YAAY,CAAC,EAAA,UAAA,EACX,IAAI,EAAA,IAAA,EACV;AACJ,wBAAA,KAAK,EAAE;AACR,qBAAA,EAAA,QAAA,EAAA,kXAAA,EAAA;;;AEXH;;AAEG;;;;"}

package/fesm2022/inera-ids-angular-components-breadcrumbs.mjs

@@ -1,15 +1,15 @@
 import * as i0 from '@angular/core';
-import { TemplateRef, ViewChild, Input, Component, inject, DestroyRef, ContentChildren } from '@angular/core';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { viewChild, TemplateRef, Input, Component, contentChildren, inject, DestroyRef } from '@angular/core';
+import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
 class IDCrumbComponent {
     current = false;
     mobile = false;
-    template;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDCrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDCrumbComponent, isStandalone: true, selector: "id-crumb", inputs: { current: "current", mobile: "mobile" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDCrumbComponent, isStandalone: true, selector: "id-crumb", inputs: { current: "current", mobile: "mobile" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template>
       <ng-content></ng-content>
     </ng-template>`, isInline: true });
@@ -28,46 +28,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Input
             }], mobile: [{
                 type: Input
-            }], template: [{
-                type: ViewChild,
-                args: [TemplateRef]
             }] } });
 
 class IDBreadcrumbsComponent {
     lead = 'Du är här:';
     srLabel = 'Du är här';
-    crumbComponents;
+    crumbComponents = contentChildren(IDCrumbComponent);
     crumbs = [];
     destroyRef = inject(DestroyRef);
+    constructor() {
+        toObservable(this.crumbComponents)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(() => { this.crumbs = [...this.crumbComponents()]; });
+    }
     getDesktopCrumbs() {
-        return this.crumbComponents.filter(crumb => !crumb.mobile);
+        return this.crumbComponents().filter(crumb => !crumb.mobile);
     }
     getMobileCrumb() {
-        return this.crumbComponents.find(crumb => crumb.mobile);
-    }
-    ngAfterContentInit() {
-        this.crumbComponents.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
-            setTimeout(() => {
-                this.crumbs = this.crumbComponents.toArray();
-            });
-        });
-        setTimeout(() => {
-            this.crumbs = this.crumbComponents.toArray();
-        }, 0);
+        return this.crumbComponents().find(crumb => crumb.mobile);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDBreadcrumbsComponent, isStandalone: true, selector: "id-breadcrumbs", inputs: { lead: "lead", srLabel: "srLabel" }, queries: [{ propertyName: "crumbComponents", predicate: IDCrumbComponent }], ngImport: i0, template: "<nav class=\"ids-breadcrumbs\" [attr.aria-label]=\"srLabel\">\n  <ol class=\"ids-breadcrumbs__desktop\" [attr.aria-label]=\"srLabel\">\n    <li class=\"ids-breadcrumbs__lead\">{{ lead }}</li>\n\n    <ng-container *ngFor=\"let crumb of getDesktopCrumbs(); let i = index\">\n      <li class=\"ids-breadcrumbs__crumb\" \n        [class.ids-breadcrumbs__crumb--current]=\"crumb.current\"\n        [attr.aria-current]=\"crumb.current ? 'page' : null\">\n        <ng-container *ngTemplateOutlet=\"crumb.template\"></ng-container>\n        @if (!crumb.current) {\n        <span class=\"ids-breadcrumbs__crumb__separator\" aria-hidden=\"true\">\n          /\n        </span>\n        }\n      </li>\n    </ng-container>\n  </ol>\n\n  @if (getMobileCrumb()) {\n  <ol class=\"ids-breadcrumbs__mobile\">\n    <li class=\"ids-breadcrumbs__mobile-links\">\n      <span class=\"ids-breadcrumbs__icon\" aria-hidden=\"true\"></span>\n      <span class=\"ids-breadcrumbs__mobile-link\">\n        <span class=\"ids-breadcrumbs__crumb  ids-breadcrumbs__crumb--mobile\">\n          <ng-container *ngTemplateOutlet=\"getMobileCrumb()?.template ?? null\"></ng-container>\n        </span>\n      </span>\n    </li>\n  </ol>\n  }\n</nav>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDBreadcrumbsComponent, isStandalone: true, selector: "id-breadcrumbs", inputs: { lead: "lead", srLabel: "srLabel" }, queries: [{ propertyName: "crumbComponents", predicate: IDCrumbComponent, isSignal: true }], ngImport: i0, template: "<nav class=\"ids-breadcrumbs\" [attr.aria-label]=\"srLabel\">\n  <ol class=\"ids-breadcrumbs__desktop\" [attr.aria-label]=\"srLabel\">\n    <li class=\"ids-breadcrumbs__lead\">{{ lead }}</li>\n\n    <ng-container *ngFor=\"let crumb of getDesktopCrumbs(); let i = index\">\n      <li class=\"ids-breadcrumbs__crumb\" \n        [class.ids-breadcrumbs__crumb--current]=\"crumb.current\"\n        [attr.aria-current]=\"crumb.current ? 'page' : null\">\n        <ng-container *ngTemplateOutlet=\"crumb.template()\"></ng-container>\n        @if (!crumb.current) {\n        <span class=\"ids-breadcrumbs__crumb__separator\" aria-hidden=\"true\">\n          /\n        </span>\n        }\n      </li>\n    </ng-container>\n  </ol>\n\n  @if (getMobileCrumb()) {\n  <ol class=\"ids-breadcrumbs__mobile\">\n    <li class=\"ids-breadcrumbs__mobile-links\">\n      <span class=\"ids-breadcrumbs__icon\" aria-hidden=\"true\"></span>\n      <span class=\"ids-breadcrumbs__mobile-link\">\n        <span class=\"ids-breadcrumbs__crumb  ids-breadcrumbs__crumb--mobile\">\n          <ng-container *ngTemplateOutlet=\"getMobileCrumb()?.template() ?? null\"></ng-container>\n        </span>\n      </span>\n    </li>\n  </ol>\n  }\n</nav>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDBreadcrumbsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'id-breadcrumbs', standalone: true, imports: [CommonModule], template: "<nav class=\"ids-breadcrumbs\" [attr.aria-label]=\"srLabel\">\n  <ol class=\"ids-breadcrumbs__desktop\" [attr.aria-label]=\"srLabel\">\n    <li class=\"ids-breadcrumbs__lead\">{{ lead }}</li>\n\n    <ng-container *ngFor=\"let crumb of getDesktopCrumbs(); let i = index\">\n      <li class=\"ids-breadcrumbs__crumb\" \n        [class.ids-breadcrumbs__crumb--current]=\"crumb.current\"\n        [attr.aria-current]=\"crumb.current ? 'page' : null\">\n        <ng-container *ngTemplateOutlet=\"crumb.template\"></ng-container>\n        @if (!crumb.current) {\n        <span class=\"ids-breadcrumbs__crumb__separator\" aria-hidden=\"true\">\n          /\n        </span>\n        }\n      </li>\n    </ng-container>\n  </ol>\n\n  @if (getMobileCrumb()) {\n  <ol class=\"ids-breadcrumbs__mobile\">\n    <li class=\"ids-breadcrumbs__mobile-links\">\n      <span class=\"ids-breadcrumbs__icon\" aria-hidden=\"true\"></span>\n      <span class=\"ids-breadcrumbs__mobile-link\">\n        <span class=\"ids-breadcrumbs__crumb  ids-breadcrumbs__crumb--mobile\">\n          <ng-container *ngTemplateOutlet=\"getMobileCrumb()?.template ?? null\"></ng-container>\n        </span>\n      </span>\n    </li>\n  </ol>\n  }\n</nav>" }]
-        }], propDecorators: { lead: [{
+            args: [{ selector: 'id-breadcrumbs', standalone: true, imports: [CommonModule], template: "<nav class=\"ids-breadcrumbs\" [attr.aria-label]=\"srLabel\">\n  <ol class=\"ids-breadcrumbs__desktop\" [attr.aria-label]=\"srLabel\">\n    <li class=\"ids-breadcrumbs__lead\">{{ lead }}</li>\n\n    <ng-container *ngFor=\"let crumb of getDesktopCrumbs(); let i = index\">\n      <li class=\"ids-breadcrumbs__crumb\" \n        [class.ids-breadcrumbs__crumb--current]=\"crumb.current\"\n        [attr.aria-current]=\"crumb.current ? 'page' : null\">\n        <ng-container *ngTemplateOutlet=\"crumb.template()\"></ng-container>\n        @if (!crumb.current) {\n        <span class=\"ids-breadcrumbs__crumb__separator\" aria-hidden=\"true\">\n          /\n        </span>\n        }\n      </li>\n    </ng-container>\n  </ol>\n\n  @if (getMobileCrumb()) {\n  <ol class=\"ids-breadcrumbs__mobile\">\n    <li class=\"ids-breadcrumbs__mobile-links\">\n      <span class=\"ids-breadcrumbs__icon\" aria-hidden=\"true\"></span>\n      <span class=\"ids-breadcrumbs__mobile-link\">\n        <span class=\"ids-breadcrumbs__crumb  ids-breadcrumbs__crumb--mobile\">\n          <ng-container *ngTemplateOutlet=\"getMobileCrumb()?.template() ?? null\"></ng-container>\n        </span>\n      </span>\n    </li>\n  </ol>\n  }\n</nav>" }]
+        }], ctorParameters: () => [], propDecorators: { lead: [{
                 type: Input
             }], srLabel: [{
                 type: Input
-            }], crumbComponents: [{
-                type: ContentChildren,
-                args: [IDCrumbComponent]
             }] } });
 
 /**

package/fesm2022/inera-ids-angular-components-breadcrumbs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-breadcrumbs.mjs","sources":["../../../projects/ids-angular/components/breadcrumbs/crumb.component.ts","../../../projects/ids-angular/components/breadcrumbs/breadcrumbs.component.ts","../../../projects/ids-angular/components/breadcrumbs/breadcrumbs.component.html","../../../projects/ids-angular/components/breadcrumbs/inera-ids-angular-components-breadcrumbs.ts"],"sourcesContent":["import { Component, Input, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core';\n\n@Component({\n  selector: 'id-crumb',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDCrumbComponent {\n  @Input() current: boolean = false;\n  @Input() mobile: boolean = false;\n\n  @ViewChild(TemplateRef) template: TemplateRef<any>;\n}\n","import { AfterContentInit, Component, ContentChildren, DestroyRef, Input, QueryList, inject } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { IDCrumbComponent } from './crumb.component';\nimport { CommonModule } from '@angular/common';\n\n@Component({\n  selector: 'id-breadcrumbs',\n  templateUrl: './breadcrumbs.component.html',\n  standalone: true,\n  imports: [CommonModule],\n})\nexport class IDBreadcrumbsComponent implements AfterContentInit {\n\n  @Input() lead = 'Du är här:';\n  @Input() srLabel = 'Du är här';\n\n  @ContentChildren(IDCrumbComponent) crumbComponents: QueryList<IDCrumbComponent>;\n\n  crumbs: IDCrumbComponent[] = [];\n\n  private destroyRef = inject(DestroyRef);\n\n  getDesktopCrumbs(): IDCrumbComponent[] | undefined {\n    return this.crumbComponents.filter(crumb => !crumb.mobile)\n  }\n\n  getMobileCrumb(): IDCrumbComponent | undefined {\n    return this.crumbComponents.find(crumb => crumb.mobile)\n  }\n\n  ngAfterContentInit(): void {\n    this.crumbComponents.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {\n      setTimeout(() => {\n        this.crumbs = this.crumbComponents.toArray();\n      });\n    });\n    setTimeout(() => {\n      this.crumbs = this.crumbComponents.toArray();\n    }, 0);\n  }\n\n}\n","<nav class=\"ids-breadcrumbs\" [attr.aria-label]=\"srLabel\">\n  <ol class=\"ids-breadcrumbs__desktop\" [attr.aria-label]=\"srLabel\">\n    <li class=\"ids-breadcrumbs__lead\">{{ lead }}</li>\n\n    <ng-container *ngFor=\"let crumb of getDesktopCrumbs(); let i = index\">\n      <li class=\"ids-breadcrumbs__crumb\" \n        [class.ids-breadcrumbs__crumb--current]=\"crumb.current\"\n        [attr.aria-current]=\"crumb.current ? 'page' : null\">\n        <ng-container *ngTemplateOutlet=\"crumb.template\"></ng-container>\n        @if (!crumb.current) {\n        <span class=\"ids-breadcrumbs__crumb__separator\" aria-hidden=\"true\">\n          /\n        </span>\n        }\n      </li>\n    </ng-container>\n  </ol>\n\n  @if (getMobileCrumb()) {\n  <ol class=\"ids-breadcrumbs__mobile\">\n    <li class=\"ids-breadcrumbs__mobile-links\">\n      <span class=\"ids-breadcrumbs__icon\" aria-hidden=\"true\"></span>\n      <span class=\"ids-breadcrumbs__mobile-link\">\n        <span class=\"ids-breadcrumbs__crumb  ids-breadcrumbs__crumb--mobile\">\n          <ng-container *ngTemplateOutlet=\"getMobileCrumb()?.template ?? null\"></ng-container>\n        </span>\n      </span>\n    </li>\n  </ol>\n  }\n</nav>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"inera-ids-angular-components-breadcrumbs.mjs","sources":["../../../projects/ids-angular/components/breadcrumbs/crumb.component.ts","../../../projects/ids-angular/components/breadcrumbs/breadcrumbs.component.ts","../../../projects/ids-angular/components/breadcrumbs/breadcrumbs.component.html","../../../projects/ids-angular/components/breadcrumbs/inera-ids-angular-components-breadcrumbs.ts"],"sourcesContent":["import { Component, Input, TemplateRef, viewChild, ViewEncapsulation } from '@angular/core';\n\n@Component({\n  selector: 'id-crumb',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDCrumbComponent {\n  @Input() current: boolean = false;\n  @Input() mobile: boolean = false;\n\n  template = viewChild.required(TemplateRef);\n}\n","import { Component, DestroyRef, Input, inject, contentChildren } from '@angular/core';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport { IDCrumbComponent } from './crumb.component';\nimport { CommonModule } from '@angular/common';\n\n@Component({\n  selector: 'id-breadcrumbs',\n  templateUrl: './breadcrumbs.component.html',\n  standalone: true,\n  imports: [CommonModule],\n})\nexport class IDBreadcrumbsComponent {\n\n  @Input() lead = 'Du är här:';\n  @Input() srLabel = 'Du är här';\n\n  crumbComponents = contentChildren(IDCrumbComponent);\n\n  crumbs: IDCrumbComponent[] = [];\n\n  private destroyRef = inject(DestroyRef);\n\n  constructor() {\n    toObservable(this.crumbComponents)\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(() => { this.crumbs = [...this.crumbComponents()]; });\n  }\n\n  getDesktopCrumbs(): IDCrumbComponent[] | undefined {\n    return this.crumbComponents().filter(crumb => !crumb.mobile)\n  }\n\n  getMobileCrumb(): IDCrumbComponent | undefined {\n    return this.crumbComponents().find(crumb => crumb.mobile)\n  }\n\n}\n","<nav class=\"ids-breadcrumbs\" [attr.aria-label]=\"srLabel\">\n  <ol class=\"ids-breadcrumbs__desktop\" [attr.aria-label]=\"srLabel\">\n    <li class=\"ids-breadcrumbs__lead\">{{ lead }}</li>\n\n    <ng-container *ngFor=\"let crumb of getDesktopCrumbs(); let i = index\">\n      <li class=\"ids-breadcrumbs__crumb\" \n        [class.ids-breadcrumbs__crumb--current]=\"crumb.current\"\n        [attr.aria-current]=\"crumb.current ? 'page' : null\">\n        <ng-container *ngTemplateOutlet=\"crumb.template()\"></ng-container>\n        @if (!crumb.current) {\n        <span class=\"ids-breadcrumbs__crumb__separator\" aria-hidden=\"true\">\n          /\n        </span>\n        }\n      </li>\n    </ng-container>\n  </ol>\n\n  @if (getMobileCrumb()) {\n  <ol class=\"ids-breadcrumbs__mobile\">\n    <li class=\"ids-breadcrumbs__mobile-links\">\n      <span class=\"ids-breadcrumbs__icon\" aria-hidden=\"true\"></span>\n      <span class=\"ids-breadcrumbs__mobile-link\">\n        <span class=\"ids-breadcrumbs__crumb  ids-breadcrumbs__crumb--mobile\">\n          <ng-container *ngTemplateOutlet=\"getMobileCrumb()?.template() ?? null\"></ng-container>\n        </span>\n      </span>\n    </li>\n  </ol>\n  }\n</nav>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/inera-ids-angular-components-carousel.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { TemplateRef, ViewChild, Input, Component, inject, DestroyRef, EventEmitter, Output, ContentChildren } from '@angular/core';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { viewChild, TemplateRef, Input, Component, contentChildren, inject, DestroyRef, EventEmitter, Output } from '@angular/core';
+import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
@@ -11,9 +11,9 @@ class IDCarouselItemComponent {
     active = true;
     next = true;
     prev = true;
-    template;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDCarouselItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDCarouselItemComponent, isStandalone: true, selector: "id-carousel-item", inputs: { headline: "headline", description: "description", step: "step", active: "active", next: "next", prev: "prev" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<ng-template>\n  <div class=\"ids-carousel-item-wrapper\" \n    [class.active]=\"active\"\n    [class.prev]=\"prev\"\n    [class.next]=\"next\"\n    [attr.aria-hidden]=\"!active ? 'true' : null\"\n    [attr.inert]=\"!active ? 'true' : null\">\n    <div class=\"ids-carousel-item\">\n      <div class=\"ids-carousel-item__image\">\n        <ng-content select=\"[idCarouselImage]\"></ng-content>\n      </div>\n      <div class=\"ids-carousel-item__content\">\n        <h2 class=\"ids-carousel-item__headline\">{{headline}}</h2>\n        <ng-content></ng-content>\n        <div class=\"ids-carousel-item__footer\">\n          <div class=\"ids-carousel-item__description\">{{description}}</div>\n          <div class=\"ids-carousel-item__step\">\n            <div class=\"ids-tag\">{{step}}</div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDCarouselItemComponent, isStandalone: true, selector: "id-carousel-item", inputs: { headline: "headline", description: "description", step: "step", active: "active", next: "next", prev: "prev" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template>\n  <div class=\"ids-carousel-item-wrapper\" \n    [class.active]=\"active\"\n    [class.prev]=\"prev\"\n    [class.next]=\"next\"\n    [attr.aria-hidden]=\"!active ? 'true' : null\"\n    [attr.inert]=\"!active ? 'true' : null\">\n    <div class=\"ids-carousel-item\">\n      <div class=\"ids-carousel-item__image\">\n        <ng-content select=\"[idCarouselImage]\"></ng-content>\n      </div>\n      <div class=\"ids-carousel-item__content\">\n        <h2 class=\"ids-carousel-item__headline\">{{headline}}</h2>\n        <ng-content></ng-content>\n        <div class=\"ids-carousel-item__footer\">\n          <div class=\"ids-carousel-item__description\">{{description}}</div>\n          <div class=\"ids-carousel-item__step\">\n            <div class=\"ids-tag\">{{step}}</div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDCarouselItemComponent, decorators: [{
             type: Component,
@@ -30,13 +30,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Input
             }], prev: [{
                 type: Input
-            }], template: [{
-                type: ViewChild,
-                args: [TemplateRef]
             }] } });
 
 class IDCarouselComponent {
-    carouselItems;
+    carouselItems = contentChildren(IDCarouselItemComponent);
     destroyRef = inject(DestroyRef);
     srNextLabel = 'Nästa slide';
     srPrevLabel = 'Föregående slide';
@@ -44,15 +41,14 @@ class IDCarouselComponent {
     activeSlide = 0;
     isAnimating = false;
     animatingTimeout;
+    constructor() {
+        toObservable(this.carouselItems)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(() => this.syncActiveSlide());
+    }
     ngOnDestroy() {
         clearTimeout(this.animatingTimeout);
     }
-    ngAfterContentInit() {
-        this.syncActiveSlide();
-        this.carouselItems.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
-            this.syncActiveSlide();
-        });
-    }
     setIsAnimating() {
         this.isAnimating = true;
         clearTimeout(this.animatingTimeout);
@@ -62,14 +58,14 @@ class IDCarouselComponent {
     }
     nextSlide() {
         if (!this.isAnimating) {
-            const lastIndex = this.carouselItems.length - 1;
+            const lastIndex = this.carouselItems().length - 1;
             this.setActiveSlide(this.activeSlide === lastIndex ? 0 : this.activeSlide + 1);
             this.setIsAnimating();
         }
     }
     prevSlide() {
         if (!this.isAnimating) {
-            const lastIndex = this.carouselItems.length - 1;
+            const lastIndex = this.carouselItems().length - 1;
             this.setActiveSlide(this.activeSlide === 0 ? lastIndex : this.activeSlide - 1);
             this.setIsAnimating();
         }
@@ -80,7 +76,7 @@ class IDCarouselComponent {
         this.slideChanged.emit(this.activeSlide);
     }
     syncActiveSlide() {
-        const items = this.carouselItems.toArray();
+        const items = this.carouselItems();
         const lastIndex = items.length - 1;
         items.forEach((item, index) => {
             item.active = index === this.activeSlide;
@@ -92,15 +88,12 @@ class IDCarouselComponent {
         return item;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDCarouselComponent, isStandalone: true, selector: "id-carousel", inputs: { srNextLabel: "srNextLabel", srPrevLabel: "srPrevLabel" }, outputs: { slideChanged: "slideChanged" }, queries: [{ propertyName: "carouselItems", predicate: IDCarouselItemComponent }], ngImport: i0, template: "<div class=\"ids-carousel\">\n  <button\n    class=\"ids-carousel__button-prev\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-next\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-prev ids-carousel__button-prev--mobile\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <button\n    class=\"ids-carousel__button-next ids-carousel__button-next--mobile\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <div class=\"ids-carousel-content js-carousel-slide\">\n    <div aria-live=\"polite\">\n      <ng-container *ngFor=\"let item of carouselItems; trackBy: trackByItem\">\n        <ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDCarouselComponent, isStandalone: true, selector: "id-carousel", inputs: { srNextLabel: "srNextLabel", srPrevLabel: "srPrevLabel" }, outputs: { slideChanged: "slideChanged" }, queries: [{ propertyName: "carouselItems", predicate: IDCarouselItemComponent, isSignal: true }], ngImport: i0, template: "<div class=\"ids-carousel\">\n  <button\n    class=\"ids-carousel__button-prev\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-next\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-prev ids-carousel__button-prev--mobile\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <button\n    class=\"ids-carousel__button-next ids-carousel__button-next--mobile\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <div class=\"ids-carousel-content js-carousel-slide\">\n    <div aria-live=\"polite\">\n      <ng-container *ngFor=\"let item of carouselItems(); trackBy: trackByItem\">\n        <ng-container *ngTemplateOutlet=\"item.template()\"></ng-container>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDCarouselComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'id-carousel', imports: [CommonModule], standalone: true, template: "<div class=\"ids-carousel\">\n  <button\n    class=\"ids-carousel__button-prev\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-next\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-prev ids-carousel__button-prev--mobile\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <button\n    class=\"ids-carousel__button-next ids-carousel__button-next--mobile\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <div class=\"ids-carousel-content js-carousel-slide\">\n    <div aria-live=\"polite\">\n      <ng-container *ngFor=\"let item of carouselItems; trackBy: trackByItem\">\n        <ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\n      </ng-container>\n    </div>\n  </div>\n</div>\n" }]
-        }], propDecorators: { carouselItems: [{
-                type: ContentChildren,
-                args: [IDCarouselItemComponent]
-            }], srNextLabel: [{
+            args: [{ selector: 'id-carousel', imports: [CommonModule], standalone: true, template: "<div class=\"ids-carousel\">\n  <button\n    class=\"ids-carousel__button-prev\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-next\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-prev ids-carousel__button-prev--mobile\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <button\n    class=\"ids-carousel__button-next ids-carousel__button-next--mobile\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <div class=\"ids-carousel-content js-carousel-slide\">\n    <div aria-live=\"polite\">\n      <ng-container *ngFor=\"let item of carouselItems(); trackBy: trackByItem\">\n        <ng-container *ngTemplateOutlet=\"item.template()\"></ng-container>\n      </ng-container>\n    </div>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [], propDecorators: { srNextLabel: [{
                 type: Input
             }], srPrevLabel: [{
                 type: Input

package/fesm2022/inera-ids-angular-components-carousel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-carousel.mjs","sources":["../../../projects/ids-angular/components/carousel/carousel-item/carousel-item.component.ts","../../../projects/ids-angular/components/carousel/carousel-item/carousel-item.component.html","../../../projects/ids-angular/components/carousel/carousel.component.ts","../../../projects/ids-angular/components/carousel/carousel.component.html","../../../projects/ids-angular/components/carousel/inera-ids-angular-components-carousel.ts"],"sourcesContent":["import { Component, Input, TemplateRef, ViewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-carousel-item',\n  templateUrl: './carousel-item.component.html',\n  standalone: true,\n})\nexport class IDCarouselItemComponent {\n  @Input() headline: string = '';\n  @Input() description: string = '';\n  @Input() step: string = '';\n  @Input() active: boolean = true;\n  @Input() next: boolean = true;\n  @Input() prev: boolean = true;\n\n  @ViewChild(TemplateRef) template: TemplateRef<any>;\n}\n","<ng-template>\n  <div class=\"ids-carousel-item-wrapper\" \n    [class.active]=\"active\"\n    [class.prev]=\"prev\"\n    [class.next]=\"next\"\n    [attr.aria-hidden]=\"!active ? 'true' : null\"\n    [attr.inert]=\"!active ? 'true' : null\">\n    <div class=\"ids-carousel-item\">\n      <div class=\"ids-carousel-item__image\">\n        <ng-content select=\"[idCarouselImage]\"></ng-content>\n      </div>\n      <div class=\"ids-carousel-item__content\">\n        <h2 class=\"ids-carousel-item__headline\">{{headline}}</h2>\n        <ng-content></ng-content>\n        <div class=\"ids-carousel-item__footer\">\n          <div class=\"ids-carousel-item__description\">{{description}}</div>\n          <div class=\"ids-carousel-item__step\">\n            <div class=\"ids-tag\">{{step}}</div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>","import {\n  AfterContentInit,\n  Component,\n  ContentChildren,\n  DestroyRef,\n  EventEmitter,\n  Input,\n  OnDestroy,\n  Output,\n  QueryList,\n  inject,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { IDCarouselItemComponent } from './carousel-item/carousel-item.component';\nimport { CommonModule } from '@angular/common';\n\n@Component({\n  selector: 'id-carousel',\n  templateUrl: './carousel.component.html',\n  imports: [CommonModule],\n  standalone: true,\n})\nexport class IDCarouselComponent implements AfterContentInit, OnDestroy {\n  @ContentChildren(IDCarouselItemComponent)\n  carouselItems!: QueryList<IDCarouselItemComponent>;\n\n  private destroyRef = inject(DestroyRef);\n  @Input() srNextLabel = 'Nästa slide';\n  @Input() srPrevLabel = 'Föregående slide';\n\n  @Output() slideChanged: EventEmitter<number> = new EventEmitter<number>();\n\n  activeSlide = 0;\n  isAnimating = false;\n  private animatingTimeout?: ReturnType<typeof setTimeout>;\n\n  ngOnDestroy() {\n    clearTimeout(this.animatingTimeout);\n  }\n\n  ngAfterContentInit() {\n    this.syncActiveSlide();\n    this.carouselItems.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {\n      this.syncActiveSlide();\n    });\n  }\n\n  setIsAnimating() {\n    this.isAnimating = true;\n    clearTimeout(this.animatingTimeout);\n    this.animatingTimeout = setTimeout(() => {\n      this.isAnimating = false;\n    }, 500);\n  }\n\n  nextSlide() {\n    if (!this.isAnimating) {\n      const lastIndex = this.carouselItems.length - 1;\n      this.setActiveSlide(this.activeSlide === lastIndex ? 0 : this.activeSlide + 1);\n      this.setIsAnimating();\n    }\n  }\n\n  prevSlide() {\n    if (!this.isAnimating) {\n      const lastIndex = this.carouselItems.length - 1;\n      this.setActiveSlide(this.activeSlide === 0 ? lastIndex : this.activeSlide - 1);\n      this.setIsAnimating();\n    }\n  }\n\n  setActiveSlide(index: number) {\n    this.activeSlide = index;\n    this.syncActiveSlide();\n    this.slideChanged.emit(this.activeSlide);\n  }\n\n  private syncActiveSlide() {\n    const items = this.carouselItems.toArray();\n    const lastIndex = items.length - 1;\n\n    items.forEach((item, index) => {\n      item.active = index === this.activeSlide;\n      item.prev = index === (this.activeSlide === 0 ? lastIndex : this.activeSlide - 1);\n      item.next = index === (this.activeSlide === lastIndex ? 0 : this.activeSlide + 1);\n    });\n  }\n\n  trackByItem(_: number, item: IDCarouselItemComponent): IDCarouselItemComponent {\n    return item;\n  }\n}\n","<div class=\"ids-carousel\">\n  <button\n    class=\"ids-carousel__button-prev\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-next\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-prev ids-carousel__button-prev--mobile\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <button\n    class=\"ids-carousel__button-next ids-carousel__button-next--mobile\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <div class=\"ids-carousel-content js-carousel-slide\">\n    <div aria-live=\"polite\">\n      <ng-container *ngFor=\"let item of carouselItems; trackBy: trackByItem\">\n        <ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\n      </ng-container>\n    </div>\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"inera-ids-angular-components-carousel.mjs","sources":["../../../projects/ids-angular/components/carousel/carousel-item/carousel-item.component.ts","../../../projects/ids-angular/components/carousel/carousel-item/carousel-item.component.html","../../../projects/ids-angular/components/carousel/carousel.component.ts","../../../projects/ids-angular/components/carousel/carousel.component.html","../../../projects/ids-angular/components/carousel/inera-ids-angular-components-carousel.ts"],"sourcesContent":["import { Component, Input, TemplateRef, viewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-carousel-item',\n  templateUrl: './carousel-item.component.html',\n  standalone: true,\n})\nexport class IDCarouselItemComponent {\n  @Input() headline: string = '';\n  @Input() description: string = '';\n  @Input() step: string = '';\n  @Input() active: boolean = true;\n  @Input() next: boolean = true;\n  @Input() prev: boolean = true;\n\n  template = viewChild.required(TemplateRef);\n}\n","<ng-template>\n  <div class=\"ids-carousel-item-wrapper\" \n    [class.active]=\"active\"\n    [class.prev]=\"prev\"\n    [class.next]=\"next\"\n    [attr.aria-hidden]=\"!active ? 'true' : null\"\n    [attr.inert]=\"!active ? 'true' : null\">\n    <div class=\"ids-carousel-item\">\n      <div class=\"ids-carousel-item__image\">\n        <ng-content select=\"[idCarouselImage]\"></ng-content>\n      </div>\n      <div class=\"ids-carousel-item__content\">\n        <h2 class=\"ids-carousel-item__headline\">{{headline}}</h2>\n        <ng-content></ng-content>\n        <div class=\"ids-carousel-item__footer\">\n          <div class=\"ids-carousel-item__description\">{{description}}</div>\n          <div class=\"ids-carousel-item__step\">\n            <div class=\"ids-tag\">{{step}}</div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>","import { Component, DestroyRef, EventEmitter, Input, OnDestroy, Output, inject, contentChildren } from '@angular/core';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport { IDCarouselItemComponent } from './carousel-item/carousel-item.component';\nimport { CommonModule } from '@angular/common';\n\n@Component({\n  selector: 'id-carousel',\n  templateUrl: './carousel.component.html',\n  imports: [CommonModule],\n  standalone: true,\n})\nexport class IDCarouselComponent implements OnDestroy {\n    carouselItems = contentChildren(IDCarouselItemComponent);\n\n  private destroyRef = inject(DestroyRef);\n  @Input() srNextLabel = 'Nästa slide';\n  @Input() srPrevLabel = 'Föregående slide';\n\n  @Output() slideChanged: EventEmitter<number> = new EventEmitter<number>();\n\n  activeSlide = 0;\n  isAnimating = false;\n  private animatingTimeout?: ReturnType<typeof setTimeout>;\n\n  constructor() {\n    toObservable(this.carouselItems)\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(() => this.syncActiveSlide());\n  }\n\n  ngOnDestroy() {\n    clearTimeout(this.animatingTimeout);\n  }\n\n  setIsAnimating() {\n    this.isAnimating = true;\n    clearTimeout(this.animatingTimeout);\n    this.animatingTimeout = setTimeout(() => {\n      this.isAnimating = false;\n    }, 500);\n  }\n\n  nextSlide() {\n    if (!this.isAnimating) {\n      const lastIndex = this.carouselItems().length - 1;\n      this.setActiveSlide(this.activeSlide === lastIndex ? 0 : this.activeSlide + 1);\n      this.setIsAnimating();\n    }\n  }\n\n  prevSlide() {\n    if (!this.isAnimating) {\n      const lastIndex = this.carouselItems().length - 1;\n      this.setActiveSlide(this.activeSlide === 0 ? lastIndex : this.activeSlide - 1);\n      this.setIsAnimating();\n    }\n  }\n\n  setActiveSlide(index: number) {\n    this.activeSlide = index;\n    this.syncActiveSlide();\n    this.slideChanged.emit(this.activeSlide);\n  }\n\n  private syncActiveSlide() {\n    const items = this.carouselItems();\n    const lastIndex = items.length - 1;\n\n    items.forEach((item, index) => {\n      item.active = index === this.activeSlide;\n      item.prev = index === (this.activeSlide === 0 ? lastIndex : this.activeSlide - 1);\n      item.next = index === (this.activeSlide === lastIndex ? 0 : this.activeSlide + 1);\n    });\n  }\n\n  trackByItem(_: number, item: IDCarouselItemComponent): IDCarouselItemComponent {\n    return item;\n  }\n}\n","<div class=\"ids-carousel\">\n  <button\n    class=\"ids-carousel__button-prev\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-next\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  ></button>\n  <button\n    class=\"ids-carousel__button-prev ids-carousel__button-prev--mobile\"\n    [attr.aria-label]=\"srPrevLabel\"\n    (click)=\"prevSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <button\n    class=\"ids-carousel__button-next ids-carousel__button-next--mobile\"\n    [attr.aria-label]=\"srNextLabel\"\n    (click)=\"nextSlide()\"\n  >\n    <div class=\"ids-carousel-btn__inner\"></div>\n  </button>\n  <div class=\"ids-carousel-content js-carousel-slide\">\n    <div aria-live=\"polite\">\n      <ng-container *ngFor=\"let item of carouselItems(); trackBy: trackByItem\">\n        <ng-container *ngTemplateOutlet=\"item.template()\"></ng-container>\n      </ng-container>\n    </div>\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/inera-ids-angular-components-control-button.mjs

@@ -0,0 +1,24 @@
+import * as i0 from '@angular/core';
+import { Directive } from '@angular/core';
+
+class IDControlButtonDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDControlButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.20", type: IDControlButtonDirective, isStandalone: true, selector: "button[idControlButton], a[idControlButton]", host: { classAttribute: "ids-control-button" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDControlButtonDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[idControlButton], a[idControlButton]',
+                    standalone: true,
+                    host: {
+                        class: 'ids-control-button',
+                    },
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { IDControlButtonDirective };
+//# sourceMappingURL=inera-ids-angular-components-control-button.mjs.map

package/fesm2022/inera-ids-angular-components-control-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"inera-ids-angular-components-control-button.mjs","sources":["../../../projects/ids-angular/components/control-button/control-button.directive.ts","../../../projects/ids-angular/components/control-button/inera-ids-angular-components-control-button.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n@Directive({\n  selector: 'button[idControlButton], a[idControlButton]',\n  standalone: true,\n  host: {\n    class: 'ids-control-button',\n  },\n})\nexport class IDControlButtonDirective {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MASa,wBAAwB,CAAA;wGAAxB,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,6CAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,oBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAxB,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,6CAA6C;AACvD,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,oBAAoB;AAC5B,qBAAA;AACF,iBAAA;;;ACRD;;AAEG;;;;"}