@inera/ids-angular 9.2.0 → 9.3.0

package/fesm2022/inera-ids-angular-components-form-select-multiple.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-select-multiple.mjs","sources":["../../../projects/ids-angular/components/form/select-multiple/select-multiple.component.ts","../../../projects/ids-angular/components/form/select-multiple/select-multiple.component.html","../../../projects/ids-angular/components/form/select-multiple/inera-ids-angular-components-form-select-multiple.ts"],"sourcesContent":["import {\n  AfterContentInit,\n  Component,\n  ContentChildren,\n  ElementRef,\n  EventEmitter,\n  Input,\n  Output,\n  QueryList,\n  booleanAttribute,\n  inject,\n  HostListener,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { IDClickOutsideDirective, IDFormBase } from '@inera/ids-angular/common';\nimport { IDCheckboxComponent } from '@inera/ids-angular/components/form/checkbox';\n\n@Component({\n  selector: 'id-select-multiple',\n  templateUrl: './select-multiple.component.html',\n  imports: [IDClickOutsideDirective],\n  standalone: true,\n})\nexport class IDSelectMultipleComponent extends IDFormBase implements AfterContentInit {\n  elementRef = inject(ElementRef);\n\n  @HostListener('document:keydown.escape', ['$event'])\n  onEsc(event: Event) {\n    if (this.isDropdownVisible) {\n      this.hideDropdown();\n      setTimeout(() => {\n        const trigger = this.elementRef.nativeElement.querySelector('.ids-select-multiple__select');\n        if (trigger) {\n          trigger.focus();\n        }\n      }, 0);\n    }\n  }\n\n  @Input() placeholder?: string;\n  @Input() maxheight?: string;\n  @Input() labelText?: string;\n  @Input() selectedLabel = 'vald';\n  @Input() multiSelectedLabel = 'valda';\n  @Input() maxHeight = '';\n  @Input({ transform: booleanAttribute }) disabled = false;\n  @Input({ transform: booleanAttribute }) ariaDisabled = false;\n\n  @Output() opened = new EventEmitter();\n  @Output() closed = new EventEmitter();\n\n  isDropdownVisible = false;\n  selectedValues = 0;\n\n  get checkboxes(): HTMLInputElement[] {\n    return this.host.nativeElement.querySelectorAll('input');\n  }\n\n  @ContentChildren(IDCheckboxComponent, { descendants: true })\n  checkboxComponents: QueryList<IDCheckboxComponent>;\n\n  get displayValue(): string {\n    if (this.selectedValues === 0) return this.placeholder || '';\n    const label = this.selectedValues > 1 ? this.multiSelectedLabel : this.selectedLabel;\n    return `${this.selectedValues} ${label}`;\n  }\n\n  host = inject(ElementRef);\n\n  toggleVisibility() {\n    this.isDropdownVisible ? this.hideDropdown() : this.showDropdown();\n  }\n\n  handleClickOutside() {\n    if (this.isDropdownVisible) {\n      this.hideDropdown();\n    }\n  }\n\n  hideDropdown() {\n    this.closed.emit();\n    this.isDropdownVisible = false;\n  }\n\n  showDropdown() {\n    this.opened.emit();\n    this.isDropdownVisible = true;\n  }\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.checkboxes.forEach((checkbox) => {\n      checkbox.addEventListener('change', this.setDisplayValues);\n    });\n\n    this.checkboxComponents.forEach((checkbox) => {\n      checkbox.invalidChange\n        .pipe(takeUntilDestroyed(this.destroyRef))\n        .subscribe((value: boolean) => {\n          this.checkShowErrorMessage();\n        });\n    });\n    this.checkShowErrorMessage();\n  }\n\n  checkShowErrorMessage() {\n    if (this.errorMessage) {\n      const isInvalidPresent = this.checkboxComponents.find((checkbox) => checkbox.invalid);\n      this.invalid = Boolean(isInvalidPresent);\n    }\n  }\n\n  setDisplayValues = () => {\n    this.selectedValues = Array.from(this.checkboxes).filter((checkbox) => checkbox.checked).length;\n  };\n}\n","<div\n  class=\"ids-select-multiple\"\n  idClickOutside\n  (idClickOutside)=\"handleClickOutside()\"\n>\n  <div class=\"ids-select-multiple-label-wrapper ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <label\n      id=\"expanded-default\"\n      class=\"ids-label\"\n      [class.ids-label--disabled]=\"disabled || ariaDisabled\"\n    >\n      {{ labelText }}\n    </label>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-select-multiple__select-wrapper\">\n    <button\n      (click)=\"toggleVisibility()\"\n      type=\"button\"\n      aria-labelledby=\"expanded-default\"\n      aria-haspopup=\"dialog\"\n      aria-controls=\"dropdown-wrapper\"\n      [attr.aria-expanded]=\"isDropdownVisible\"\n      [attr.aria-disabled]=\"disabled || ariaDisabled\"\n      [attr.aria-invalid]=\"invalid\"\n      class=\"ids-select-multiple__select\"\n      [disabled]=\"disabled\"\n    >\n      {{ displayValue }}\n    </button>\n  </div>\n  <div\n    class=\"ids-select-multiple__dropdown-wrapper\"\n    id=\"dropdown-wrapper\"\n  >\n    <div\n      class=\"ids-select-multiple__dropdown\"\n      [class.ids-select-multiple__dropdown--expanded]=\"isDropdownVisible\"\n    >\n      <div\n        class=\"ids-select-multiple__dropdown-scroll-area\"\n        [style.max-height]=\"maxHeight\"\n      >\n        <ng-content></ng-content>\n      </div>\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-form-select-multiple.mjs","sources":["../../../projects/ids-angular/components/form/select-multiple/select-multiple.component.ts","../../../projects/ids-angular/components/form/select-multiple/select-multiple.component.html","../../../projects/ids-angular/components/form/select-multiple/inera-ids-angular-components-form-select-multiple.ts"],"sourcesContent":["import { AfterContentInit, Component, ElementRef, EventEmitter, Input, Output, booleanAttribute, inject, HostListener, contentChildren } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { IDClickOutsideDirective, IDFormBase } from '@inera/ids-angular/common';\nimport { IDCheckboxComponent } from '@inera/ids-angular/components/form/checkbox';\n\n@Component({\n  selector: 'id-select-multiple',\n  templateUrl: './select-multiple.component.html',\n  imports: [IDClickOutsideDirective],\n  standalone: true,\n})\nexport class IDSelectMultipleComponent extends IDFormBase implements AfterContentInit {\n  elementRef = inject(ElementRef);\n\n  @HostListener('document:keydown.escape', ['$event'])\n  onEsc(event: Event) {\n    if (this.isDropdownVisible) {\n      this.hideDropdown();\n      setTimeout(() => {\n        const trigger = this.elementRef.nativeElement.querySelector('.ids-select-multiple__select');\n        if (trigger) {\n          trigger.focus();\n        }\n      }, 0);\n    }\n  }\n\n  @Input() placeholder?: string;\n  @Input() maxheight?: string;\n  @Input() labelText?: string;\n  @Input() selectedLabel = 'vald';\n  @Input() multiSelectedLabel = 'valda';\n  @Input() maxHeight = '';\n  @Input({ transform: booleanAttribute }) disabled = false;\n  @Input({ transform: booleanAttribute }) ariaDisabled = false;\n\n  @Output() opened = new EventEmitter();\n  @Output() closed = new EventEmitter();\n\n  isDropdownVisible = false;\n  selectedValues = 0;\n\n  get checkboxes(): HTMLInputElement[] {\n    return Array.from(this.host.nativeElement.querySelectorAll('input')) as HTMLInputElement[];\n  }\n\n    checkboxComponents = contentChildren(IDCheckboxComponent, { descendants: true });\n\n  get displayValue(): string {\n    if (this.selectedValues === 0) return this.placeholder || '';\n    const label = this.selectedValues > 1 ? this.multiSelectedLabel : this.selectedLabel;\n    return `${this.selectedValues} ${label}`;\n  }\n\n  host = inject(ElementRef);\n\n  toggleVisibility() {\n    this.isDropdownVisible ? this.hideDropdown() : this.showDropdown();\n  }\n\n  handleClickOutside() {\n    if (this.isDropdownVisible) {\n      this.hideDropdown();\n    }\n  }\n\n  hideDropdown() {\n    this.closed.emit();\n    this.isDropdownVisible = false;\n  }\n\n  showDropdown() {\n    this.opened.emit();\n    this.isDropdownVisible = true;\n  }\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.checkboxes.forEach((checkbox) => {\n      checkbox.addEventListener('change', this.setDisplayValues);\n    });\n\n    this.checkboxComponents().forEach((checkbox) => {\n      checkbox.invalidChange\n        .pipe(takeUntilDestroyed(this.destroyRef))\n        .subscribe((value: boolean) => {\n          this.checkShowErrorMessage();\n        });\n    });\n    this.checkShowErrorMessage();\n  }\n\n  checkShowErrorMessage() {\n    if (this.errorMessage) {\n      const isInvalidPresent = this.checkboxComponents().find((checkbox) => checkbox.invalid);\n      this.invalid = Boolean(isInvalidPresent);\n    }\n  }\n\n  setDisplayValues = () => {\n    this.selectedValues = this.checkboxes.filter((checkbox) => checkbox.checked).length;\n  };\n}\n","<div\n  class=\"ids-select-multiple\"\n  idClickOutside\n  (idClickOutside)=\"handleClickOutside()\"\n>\n  <div class=\"ids-select-multiple-label-wrapper ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <label\n      id=\"expanded-default\"\n      class=\"ids-label\"\n      [class.ids-label--disabled]=\"disabled\"\n    >\n      {{ labelText }}\n    </label>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-select-multiple__select-wrapper\">\n    <button\n      (click)=\"toggleVisibility()\"\n      type=\"button\"\n      aria-labelledby=\"expanded-default\"\n      aria-haspopup=\"dialog\"\n      aria-controls=\"dropdown-wrapper\"\n      [attr.aria-expanded]=\"isDropdownVisible\"\n      [attr.aria-disabled]=\"ariaDisabled\"\n      [attr.aria-invalid]=\"invalid\"\n      class=\"ids-select-multiple__select\"\n      [disabled]=\"disabled\"\n    >\n      {{ displayValue }}\n    </button>\n  </div>\n  <div\n    class=\"ids-select-multiple__dropdown-wrapper\"\n    id=\"dropdown-wrapper\"\n  >\n    <div\n      class=\"ids-select-multiple__dropdown\"\n      [class.ids-select-multiple__dropdown--expanded]=\"isDropdownVisible\"\n    >\n      <div\n        class=\"ids-select-multiple__dropdown-scroll-area\"\n        [style.max-height]=\"maxHeight\"\n      >\n        <ng-content></ng-content>\n      </div>\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-form-select.mjs

@@ -8,11 +8,11 @@ class IDSelectComponent extends IDFormBase {
         this.input.classList.add('ids-select__select');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDSelectComponent, isStandalone: true, selector: "id-select", usesInheritance: true, ngImport: i0, template: "<div class=\"ids-select\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-select__wrapper\">\n    <ng-content select=\"select\"></ng-content>\n  </div>\n</div>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDSelectComponent, isStandalone: true, selector: "id-select", usesInheritance: true, ngImport: i0, template: "<div class=\"ids-select\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-select__wrapper\">\n    <ng-content select=\"select\"></ng-content>\n  </div>\n</div>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDSelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'id-select', standalone: true, template: "<div class=\"ids-select\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-select__wrapper\">\n    <ng-content select=\"select\"></ng-content>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'id-select', standalone: true, template: "<div class=\"ids-select\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-select__wrapper\">\n    <ng-content select=\"select\"></ng-content>\n  </div>\n</div>\n" }]
         }] });
 
 /**

package/fesm2022/inera-ids-angular-components-form-select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-select.mjs","sources":["../../../projects/ids-angular/components/form/select/select.component.ts","../../../projects/ids-angular/components/form/select/select.component.html","../../../projects/ids-angular/components/form/select/inera-ids-angular-components-form-select.ts"],"sourcesContent":["import { AfterContentInit, Component } from '@angular/core';\nimport { IDFormBase } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-select',\n  templateUrl: './select.component.html',\n  standalone: true,\n})\nexport class IDSelectComponent extends IDFormBase implements AfterContentInit {\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.input.classList.add('ids-select__select');\n  }\n}\n","<div class=\"ids-select\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-select__wrapper\">\n    <ng-content select=\"select\"></ng-content>\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAQM,MAAO,iBAAkB,SAAQ,UAAU,CAAA;IAE/C,kBAAkB,GAAA;QAChB,KAAK,CAAC,kBAAkB,EAAE;QAC1B,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,oBAAoB,CAAC;IAChD;wGALW,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,4FCR9B,4aAYA,EAAA,CAAA;;4FDJa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAL7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,cAET,IAAI,EAAA,QAAA,EAAA,4aAAA,EAAA;;;AENlB;;AAEG;;;;"}
+{"version":3,"file":"inera-ids-angular-components-form-select.mjs","sources":["../../../projects/ids-angular/components/form/select/select.component.ts","../../../projects/ids-angular/components/form/select/select.component.html","../../../projects/ids-angular/components/form/select/inera-ids-angular-components-form-select.ts"],"sourcesContent":["import { AfterContentInit, Component } from '@angular/core';\nimport { IDFormBase } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-select',\n  templateUrl: './select.component.html',\n  standalone: true,\n})\nexport class IDSelectComponent extends IDFormBase implements AfterContentInit {\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.input.classList.add('ids-select__select');\n  }\n}\n","<div class=\"ids-select\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-select__wrapper\">\n    <ng-content select=\"select\"></ng-content>\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAQM,MAAO,iBAAkB,SAAQ,UAAU,CAAA;IAE/C,kBAAkB,GAAA;QAChB,KAAK,CAAC,kBAAkB,EAAE;QAC1B,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,oBAAoB,CAAC;IAChD;wGALW,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,4FCR9B,seAaA,EAAA,CAAA;;4FDLa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAL7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,cAET,IAAI,EAAA,QAAA,EAAA,seAAA,EAAA;;;AENlB;;AAEG;;;;"}

package/fesm2022/inera-ids-angular-components-form-textarea.mjs

@@ -36,7 +36,7 @@ class IDTextareaComponent extends IDFormBase {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDTextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.20", type: IDTextareaComponent, isStandalone: true, selector: "id-textarea", inputs: { block: ["block", "block", booleanAttribute], autoSize: ["autoSize", "autoSize", booleanAttribute] }, host: { properties: { "class.ids-textarea--block": "block", "class.ids-textarea--autosize": "autoSize" }, classAttribute: "ids-textarea" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n  <ng-content select=\"label\"></ng-content>\n  <span class=\"ids-label__tooltip\">\n    <ng-content select=\"id-tooltip\"></ng-content>\n    <ng-content select=\"id-popover\"></ng-content>\n  </span>\n</div>\n\n<ng-content></ng-content>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.20", type: IDTextareaComponent, isStandalone: true, selector: "id-textarea", inputs: { block: ["block", "block", booleanAttribute], autoSize: ["autoSize", "autoSize", booleanAttribute] }, host: { properties: { "class.ids-textarea--block": "block", "class.ids-textarea--autosize": "autoSize" }, classAttribute: "ids-textarea" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n  <ng-content select=\"label\"></ng-content>\n  <span class=\"ids-label__tooltip\">\n    <ng-content select=\"id-tooltip\"></ng-content>\n    <ng-content select=\"id-popover\"></ng-content>\n  </span>\n</div>\n\n<ng-content select=\"id-label-subtitle\"></ng-content>\n\n<ng-content></ng-content>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDTextareaComponent, decorators: [{
             type: Component,
@@ -44,7 +44,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         class: 'ids-textarea',
                         '[class.ids-textarea--block]': 'block',
                         '[class.ids-textarea--autosize]': 'autoSize',
-                    }, template: "<div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n  <ng-content select=\"label\"></ng-content>\n  <span class=\"ids-label__tooltip\">\n    <ng-content select=\"id-tooltip\"></ng-content>\n    <ng-content select=\"id-popover\"></ng-content>\n  </span>\n</div>\n\n<ng-content></ng-content>\n" }]
+                    }, template: "<div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n  <ng-content select=\"label\"></ng-content>\n  <span class=\"ids-label__tooltip\">\n    <ng-content select=\"id-tooltip\"></ng-content>\n    <ng-content select=\"id-popover\"></ng-content>\n  </span>\n</div>\n\n<ng-content select=\"id-label-subtitle\"></ng-content>\n\n<ng-content></ng-content>\n" }]
         }], propDecorators: { block: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]

package/fesm2022/inera-ids-angular-components-form-textarea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-textarea.mjs","sources":["../../../projects/ids-angular/components/form/textarea/textarea.component.ts","../../../projects/ids-angular/components/form/textarea/textarea.component.html","../../../projects/ids-angular/components/form/textarea/textarea-hint.component.ts","../../../projects/ids-angular/components/form/textarea/inera-ids-angular-components-form-textarea.ts"],"sourcesContent":["import { AfterContentInit, Component, ElementRef, Input, booleanAttribute, inject } from '@angular/core';\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: 'id-textarea',\n  templateUrl: \"./textarea.component.html\",\n  standalone: true,\n  host: {\n    class: 'ids-textarea',\n    '[class.ids-textarea--block]': 'block',\n    '[class.ids-textarea--autosize]': 'autoSize',\n  }\n})\nexport class IDTextareaComponent extends IDFormBase implements AfterContentInit {\n\n  @Input({ transform: booleanAttribute }) block: boolean = false;\n  @Input({ transform: booleanAttribute }) autoSize: boolean = false;\n\n  host = inject(ElementRef);\n\n  private autosizeInput?: () => void;\n  private autosizeViewport?: () => void;\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    if (this.autoSize) {\n      this.autosizeInput = this.renderer.listen(this.input, 'input', () => {\n        this.updateAutosize();\n      });\n      if (visualViewport) {\n        this.autosizeViewport = this.renderer.listen(visualViewport, 'resize', () => {\n          this.updateAutosize();\n        });\n      }\n      this.input.style.height = \"auto\";\n      setTimeout(() => {\n        this.updateAutosize();\n      },75)\n    }\n  }\n\n  ngOnDestroy() {\n    this.autosizeInput?.();\n    this.autosizeViewport?.();\n  }\n\n  updateAutosize() {\n    this.input.style.height = \"auto\";\n    if (this.input.scrollHeight > 70) {\n      this.input.style.height = this.input.scrollHeight + 24 + \"px\";\n    }\n  }\n\n}\n","<div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n  <ng-content select=\"label\"></ng-content>\n  <span class=\"ids-label__tooltip\">\n    <ng-content select=\"id-tooltip\"></ng-content>\n    <ng-content select=\"id-popover\"></ng-content>\n  </span>\n</div>\n\n<ng-content></ng-content>\n","import { Component, ElementRef, inject, OnInit, Renderer2 } from \"@angular/core\";\nimport { IDUseIdService } from '@inera/ids-angular/common';\n\n@Component({\n  selector: \"id-textarea-hint\",\n  template: \"<ng-content></ng-content>\",\n  standalone: true,\n  host: {\n    class: 'ids-input__hint'\n  }\n})\nexport class IDTextareaHintComponent implements OnInit {\n  readonly id = inject(IDUseIdService).generateId('hint');\n  private readonly el = inject(ElementRef<HTMLElement>);\n  private readonly renderer = inject(Renderer2);\n\n  ngOnInit() {\n    this.renderer.setAttribute(this.el.nativeElement, 'id', this.id);\n  }\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-form-textarea.mjs","sources":["../../../projects/ids-angular/components/form/textarea/textarea.component.ts","../../../projects/ids-angular/components/form/textarea/textarea.component.html","../../../projects/ids-angular/components/form/textarea/textarea-hint.component.ts","../../../projects/ids-angular/components/form/textarea/inera-ids-angular-components-form-textarea.ts"],"sourcesContent":["import { AfterContentInit, Component, ElementRef, Input, booleanAttribute, inject } from '@angular/core';\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: 'id-textarea',\n  templateUrl: \"./textarea.component.html\",\n  standalone: true,\n  host: {\n    class: 'ids-textarea',\n    '[class.ids-textarea--block]': 'block',\n    '[class.ids-textarea--autosize]': 'autoSize',\n  }\n})\nexport class IDTextareaComponent extends IDFormBase implements AfterContentInit {\n\n  @Input({ transform: booleanAttribute }) block: boolean = false;\n  @Input({ transform: booleanAttribute }) autoSize: boolean = false;\n\n  host = inject(ElementRef);\n\n  private autosizeInput?: () => void;\n  private autosizeViewport?: () => void;\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    if (this.autoSize) {\n      this.autosizeInput = this.renderer.listen(this.input, 'input', () => {\n        this.updateAutosize();\n      });\n      if (visualViewport) {\n        this.autosizeViewport = this.renderer.listen(visualViewport, 'resize', () => {\n          this.updateAutosize();\n        });\n      }\n      this.input.style.height = \"auto\";\n      setTimeout(() => {\n        this.updateAutosize();\n      },75)\n    }\n  }\n\n  ngOnDestroy() {\n    this.autosizeInput?.();\n    this.autosizeViewport?.();\n  }\n\n  updateAutosize() {\n    this.input.style.height = \"auto\";\n    if (this.input.scrollHeight > 70) {\n      this.input.style.height = this.input.scrollHeight + 24 + \"px\";\n    }\n  }\n\n}\n","<div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n  <ng-content select=\"label\"></ng-content>\n  <span class=\"ids-label__tooltip\">\n    <ng-content select=\"id-tooltip\"></ng-content>\n    <ng-content select=\"id-popover\"></ng-content>\n  </span>\n</div>\n\n<ng-content select=\"id-label-subtitle\"></ng-content>\n\n<ng-content></ng-content>\n","import { Component, ElementRef, inject, OnInit, Renderer2 } from \"@angular/core\";\nimport { IDUseIdService } from '@inera/ids-angular/common';\n\n@Component({\n  selector: \"id-textarea-hint\",\n  template: \"<ng-content></ng-content>\",\n  standalone: true,\n  host: {\n    class: 'ids-input__hint'\n  }\n})\nexport class IDTextareaHintComponent implements OnInit {\n  readonly id = inject(IDUseIdService).generateId('hint');\n  private readonly el = inject(ElementRef<HTMLElement>);\n  private readonly renderer = inject(Renderer2);\n\n  ngOnInit() {\n    this.renderer.setAttribute(this.el.nativeElement, 'id', this.id);\n  }\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-form-time.mjs

@@ -7,11 +7,11 @@ class IDTimeComponent extends IDFormBase {
         this.input.classList.add('ids-time__input');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDTimeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDTimeComponent, isStandalone: true, selector: "id-time", usesInheritance: true, ngImport: i0, template: "<div class=\"ids-time\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-time__input-wrapper\">\n    <ng-content select=\"input\"></ng-content>\n  </div>\n</div>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDTimeComponent, isStandalone: true, selector: "id-time", usesInheritance: true, ngImport: i0, template: "<div class=\"ids-time\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-time__input-wrapper\">\n    <ng-content select=\"input\"></ng-content>\n  </div>\n</div>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDTimeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'id-time', standalone: true, template: "<div class=\"ids-time\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-time__input-wrapper\">\n    <ng-content select=\"input\"></ng-content>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'id-time', standalone: true, template: "<div class=\"ids-time\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-time__input-wrapper\">\n    <ng-content select=\"input\"></ng-content>\n  </div>\n</div>\n" }]
         }] });
 
 /**

package/fesm2022/inera-ids-angular-components-form-time.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-time.mjs","sources":["../../../projects/ids-angular/components/form/time/time.component.ts","../../../projects/ids-angular/components/form/time/time.component.html","../../../projects/ids-angular/components/form/time/inera-ids-angular-components-form-time.ts"],"sourcesContent":["import { AfterContentChecked, Component } from '@angular/core';\nimport { IDFormBase } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-time',\n  templateUrl: './time.component.html',\n  standalone: true,\n})\nexport class IDTimeComponent extends IDFormBase implements AfterContentChecked {\n  ngAfterContentChecked(): void {\n    this.input.classList.add('ids-time__input');\n  }\n}\n","<div class=\"ids-time\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <div class=\"ids-time__input-wrapper\">\n    <ng-content select=\"input\"></ng-content>\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAQM,MAAO,eAAgB,SAAQ,UAAU,CAAA;IAC7C,qBAAqB,GAAA;QACnB,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,CAAC;IAC7C;wGAHW,eAAe,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,eAAe,0FCR5B,6aAYA,EAAA,CAAA;;4FDJa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAL3B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAS,cAEP,IAAI,EAAA,QAAA,EAAA,6aAAA,EAAA;;;AENlB;;AAEG;;;;"}
+{"version":3,"file":"inera-ids-angular-components-form-time.mjs","sources":["../../../projects/ids-angular/components/form/time/time.component.ts","../../../projects/ids-angular/components/form/time/time.component.html","../../../projects/ids-angular/components/form/time/inera-ids-angular-components-form-time.ts"],"sourcesContent":["import { AfterContentChecked, Component } from '@angular/core';\nimport { IDFormBase } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-time',\n  templateUrl: './time.component.html',\n  standalone: true,\n})\nexport class IDTimeComponent extends IDFormBase implements AfterContentChecked {\n  ngAfterContentChecked(): void {\n    this.input.classList.add('ids-time__input');\n  }\n}\n","<div class=\"ids-time\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <ng-content select=\"label\"></ng-content>\n    <span class=\"ids-label__tooltip\">\n      <ng-content select=\"id-tooltip\"></ng-content>\n      <ng-content select=\"id-popover\"></ng-content>\n    </span>\n  </div>\n  <ng-content select=\"id-label-subtitle\"></ng-content>\n  <div class=\"ids-time__input-wrapper\">\n    <ng-content select=\"input\"></ng-content>\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAQM,MAAO,eAAgB,SAAQ,UAAU,CAAA;IAC7C,qBAAqB,GAAA;QACnB,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,CAAC;IAC7C;wGAHW,eAAe,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,eAAe,0FCR5B,ueAaA,EAAA,CAAA;;4FDLa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAL3B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAS,cAEP,IAAI,EAAA,QAAA,EAAA,ueAAA,EAAA;;;AENlB;;AAEG;;;;"}

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

@@ -1,13 +1,13 @@
 import * as i0 from '@angular/core';
-import { TemplateRef, ViewChild, Component, inject, EventEmitter, booleanAttribute, Output, ContentChild, Input } from '@angular/core';
+import { viewChild, TemplateRef, Component, inject, contentChild, EventEmitter, booleanAttribute, Output, Input } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { IDUseIdService } from '@inera/ids-angular/common';
 
 class IDGlobalAlertHeaderComponent {
-    template;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDGlobalAlertHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDGlobalAlertHeaderComponent, isStandalone: true, selector: "id-global-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: IDGlobalAlertHeaderComponent, isStandalone: true, selector: "id-global-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,15 +22,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
       <ng-content></ng-content>
     </ng-template>`
                 }]
-        }], propDecorators: { template: [{
-                type: ViewChild,
-                args: [TemplateRef]
-            }] } });
+        }] });
 
 class IDGlobalAlertActionsComponent {
-    template;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDGlobalAlertActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDGlobalAlertActionsComponent, isStandalone: true, selector: "id-global-alert-actions", 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: IDGlobalAlertActionsComponent, isStandalone: true, selector: "id-global-alert-actions", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template>
       <ng-content></ng-content>
     </ng-template>`, isInline: true });
@@ -45,10 +42,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 IDGlobalAlertComponent {
     useId = inject(IDUseIdService);
@@ -65,8 +59,8 @@ class IDGlobalAlertComponent {
             this._collapsed = value;
         }
     }
-    header;
-    actions;
+    header = contentChild(IDGlobalAlertHeaderComponent);
+    actions = contentChild(IDGlobalAlertActionsComponent);
     collapsedChange = new EventEmitter();
     closed = new EventEmitter();
     opened = new EventEmitter();
@@ -92,14 +86,14 @@ class IDGlobalAlertComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDGlobalAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDGlobalAlertComponent, isStandalone: true, selector: "id-global-alert", inputs: { agent: ["agent", "agent", booleanAttribute], srExpandText: "srExpandText", srCollapseText: "srCollapseText", collapsed: "collapsed" }, outputs: { collapsedChange: "collapsedChange", closed: "closed", opened: "opened" }, host: { properties: { "attr.role": "hostRole", "class": "hostClasses" } }, queries: [{ propertyName: "header", first: true, predicate: IDGlobalAlertHeaderComponent, descendants: true }, { propertyName: "actions", first: true, predicate: IDGlobalAlertActionsComponent, descendants: true }], ngImport: i0, template: "<div class=\"ids-global-alert__inner\">\n  <div class=\"ids-global-alert__header\">\n    <button\n      class=\"ids-global-alert__button\"\n      [class.ids-global-alert__button--expanded]=\"!collapsed\"\n      [attr.aria-label]=\"this.collapsed ? this.srExpandText : this.srCollapseText\"\n      [attr.aria-controls]=\"contentId\"\n      [attr.aria-expanded]=\"!collapsed\"\n      (click)=\"toggleExpanded()\"\n    >\n      <div\n        class=\"ids-global-alert__icon-headline\"\n        [class.ids-global-alert__icon-headline--agent]=\"agent\"\n      >\n        @if (header) {\n          <div class=\"ids-global-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\n          </div>\n        }\n      </div>\n    </button>\n  </div>\n\n  <div\n    [attr.id]=\"contentId\"\n    class=\"ids-global-alert__content\"\n    [attr.aria-hidden]=\"collapsed ? 'true' : 'false'\"\n  >\n    <ng-content select=\":not(id-global-alert-header):not(id-global-alert-actions)\"></ng-content>\n  </div>\n  @if (actions) {\n    <div class=\"ids-global-alert__sub-content\">\n      <ng-container *ngTemplateOutlet=\"actions.template\"></ng-container>\n    </div>\n  }\n</div>\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: IDGlobalAlertComponent, isStandalone: true, selector: "id-global-alert", inputs: { agent: ["agent", "agent", booleanAttribute], srExpandText: "srExpandText", srCollapseText: "srCollapseText", collapsed: "collapsed" }, outputs: { collapsedChange: "collapsedChange", closed: "closed", opened: "opened" }, host: { properties: { "attr.role": "hostRole", "class": "hostClasses" } }, queries: [{ propertyName: "header", first: true, predicate: IDGlobalAlertHeaderComponent, descendants: true, isSignal: true }, { propertyName: "actions", first: true, predicate: IDGlobalAlertActionsComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ids-global-alert__inner\">\n  <div class=\"ids-global-alert__header\">\n    <button\n      class=\"ids-global-alert__button\"\n      [class.ids-global-alert__button--expanded]=\"!collapsed\"\n      [attr.aria-label]=\"this.collapsed ? this.srExpandText : this.srCollapseText\"\n      [attr.aria-controls]=\"contentId\"\n      [attr.aria-expanded]=\"!collapsed\"\n      (click)=\"toggleExpanded()\"\n    >\n      <div\n        class=\"ids-global-alert__icon-headline\"\n        [class.ids-global-alert__icon-headline--agent]=\"agent\"\n      >\n        @if (header(); as header) {\n          <div class=\"ids-global-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template()\"></ng-container>\n          </div>\n        }\n      </div>\n    </button>\n  </div>\n\n  <div\n    [attr.id]=\"contentId\"\n    class=\"ids-global-alert__content\"\n    [attr.aria-hidden]=\"collapsed ? 'true' : 'false'\"\n  >\n    <ng-content select=\":not(id-global-alert-header):not(id-global-alert-actions)\"></ng-content>\n  </div>\n  @if (actions(); as a) {\n    <div class=\"ids-global-alert__sub-content\">\n      <ng-container *ngTemplateOutlet=\"a.template()\"></ng-container>\n    </div>\n  }\n</div>\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: IDGlobalAlertComponent, decorators: [{
             type: Component,
             args: [{ selector: "id-global-alert", imports: [CommonModule], standalone: true, host: {
                         '[attr.role]': 'hostRole',
                         '[class]': 'hostClasses',
-                    }, template: "<div class=\"ids-global-alert__inner\">\n  <div class=\"ids-global-alert__header\">\n    <button\n      class=\"ids-global-alert__button\"\n      [class.ids-global-alert__button--expanded]=\"!collapsed\"\n      [attr.aria-label]=\"this.collapsed ? this.srExpandText : this.srCollapseText\"\n      [attr.aria-controls]=\"contentId\"\n      [attr.aria-expanded]=\"!collapsed\"\n      (click)=\"toggleExpanded()\"\n    >\n      <div\n        class=\"ids-global-alert__icon-headline\"\n        [class.ids-global-alert__icon-headline--agent]=\"agent\"\n      >\n        @if (header) {\n          <div class=\"ids-global-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\n          </div>\n        }\n      </div>\n    </button>\n  </div>\n\n  <div\n    [attr.id]=\"contentId\"\n    class=\"ids-global-alert__content\"\n    [attr.aria-hidden]=\"collapsed ? 'true' : 'false'\"\n  >\n    <ng-content select=\":not(id-global-alert-header):not(id-global-alert-actions)\"></ng-content>\n  </div>\n  @if (actions) {\n    <div class=\"ids-global-alert__sub-content\">\n      <ng-container *ngTemplateOutlet=\"actions.template\"></ng-container>\n    </div>\n  }\n</div>\n" }]
+                    }, template: "<div class=\"ids-global-alert__inner\">\n  <div class=\"ids-global-alert__header\">\n    <button\n      class=\"ids-global-alert__button\"\n      [class.ids-global-alert__button--expanded]=\"!collapsed\"\n      [attr.aria-label]=\"this.collapsed ? this.srExpandText : this.srCollapseText\"\n      [attr.aria-controls]=\"contentId\"\n      [attr.aria-expanded]=\"!collapsed\"\n      (click)=\"toggleExpanded()\"\n    >\n      <div\n        class=\"ids-global-alert__icon-headline\"\n        [class.ids-global-alert__icon-headline--agent]=\"agent\"\n      >\n        @if (header(); as header) {\n          <div class=\"ids-global-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template()\"></ng-container>\n          </div>\n        }\n      </div>\n    </button>\n  </div>\n\n  <div\n    [attr.id]=\"contentId\"\n    class=\"ids-global-alert__content\"\n    [attr.aria-hidden]=\"collapsed ? 'true' : 'false'\"\n  >\n    <ng-content select=\":not(id-global-alert-header):not(id-global-alert-actions)\"></ng-content>\n  </div>\n  @if (actions(); as a) {\n    <div class=\"ids-global-alert__sub-content\">\n      <ng-container *ngTemplateOutlet=\"a.template()\"></ng-container>\n    </div>\n  }\n</div>\n" }]
         }], propDecorators: { agent: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -109,12 +103,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Input
             }], collapsed: [{
                 type: Input
-            }], header: [{
-                type: ContentChild,
-                args: [IDGlobalAlertHeaderComponent]
-            }], actions: [{
-                type: ContentChild,
-                args: [IDGlobalAlertActionsComponent]
             }], collapsedChange: [{
                 type: Output
             }], closed: [{

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

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-global-alert.mjs","sources":["../../../projects/ids-angular/components/global-alert/global-alert-header.component.ts","../../../projects/ids-angular/components/global-alert/global-alert-actions.component.ts","../../../projects/ids-angular/components/global-alert/global-alert.component.ts","../../../projects/ids-angular/components/global-alert/global-alert.component.html","../../../projects/ids-angular/components/global-alert/inera-ids-angular-components-global-alert.ts"],"sourcesContent":["import { Component, TemplateRef, ViewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-global-alert-header',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDGlobalAlertHeaderComponent {\n\n  @ViewChild(TemplateRef) template: TemplateRef<any>;\n\n}\n","import { Component, TemplateRef, ViewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-global-alert-actions',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDGlobalAlertActionsComponent {\n\n  @ViewChild(TemplateRef) template: TemplateRef<any>;\n\n}\n","import { Component, ContentChild, EventEmitter, Input, Output, booleanAttribute, inject } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { IDGlobalAlertHeaderComponent } from \"./global-alert-header.component\";\nimport { IDGlobalAlertActionsComponent } from \"./global-alert-actions.component\";\nimport { IDUseIdService } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-global-alert\",\n  templateUrl: \"./global-alert.component.html\",\n  imports: [CommonModule],\n  standalone: true,\n  host: {\n    '[attr.role]': 'hostRole',\n    '[class]': 'hostClasses',\n  }\n})\nexport class IDGlobalAlertComponent {\n\n  private useId = inject(IDUseIdService);\n  protected contentId = this.useId.generateId('global-alert');\n\n  @Input({ transform: booleanAttribute }) agent: boolean = false;\n  @Input() srExpandText: string = \"Visa mer\";\n  @Input() srCollapseText: string = \"Visa mindre\";\n\n  private _collapsed: boolean = true;\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\n  @ContentChild(IDGlobalAlertHeaderComponent)\n  header: IDGlobalAlertHeaderComponent;\n\n  @ContentChild(IDGlobalAlertActionsComponent)\n  actions: IDGlobalAlertActionsComponent;\n\n  @Output() collapsedChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n  @Output() closed: EventEmitter<void> = new EventEmitter<void>();\n  @Output() opened: EventEmitter<void> = new EventEmitter<void>();\n\n  get hostRole(): string | null {\n    return !this.agent ? 'alert' : null;\n  }\n\n  get hostClasses(): string {\n    const classes = ['ids-global-alert'];\n\n    if (this.collapsed) classes.push('ids-global-alert--collapsed');\n    if (this.agent) classes.push('ids-global-alert--agent');\n\n    return classes.join(' ');\n  }\n\n  toggleExpanded(): void {\n    this._collapsed = !this.collapsed;\n    this.collapsedChange.emit(this._collapsed);\n    if(this.collapsed) {\n      this.closed.emit();\n    } else {\n      this.opened.emit();\n    }\n  }\n}","<div class=\"ids-global-alert__inner\">\n  <div class=\"ids-global-alert__header\">\n    <button\n      class=\"ids-global-alert__button\"\n      [class.ids-global-alert__button--expanded]=\"!collapsed\"\n      [attr.aria-label]=\"this.collapsed ? this.srExpandText : this.srCollapseText\"\n      [attr.aria-controls]=\"contentId\"\n      [attr.aria-expanded]=\"!collapsed\"\n      (click)=\"toggleExpanded()\"\n    >\n      <div\n        class=\"ids-global-alert__icon-headline\"\n        [class.ids-global-alert__icon-headline--agent]=\"agent\"\n      >\n        @if (header) {\n          <div class=\"ids-global-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\n          </div>\n        }\n      </div>\n    </button>\n  </div>\n\n  <div\n    [attr.id]=\"contentId\"\n    class=\"ids-global-alert__content\"\n    [attr.aria-hidden]=\"collapsed ? 'true' : 'false'\"\n  >\n    <ng-content select=\":not(id-global-alert-header):not(id-global-alert-actions)\"></ng-content>\n  </div>\n  @if (actions) {\n    <div class=\"ids-global-alert__sub-content\">\n      <ng-container *ngTemplateOutlet=\"actions.template\"></ng-container>\n    </div>\n  }\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-global-alert.mjs","sources":["../../../projects/ids-angular/components/global-alert/global-alert-header.component.ts","../../../projects/ids-angular/components/global-alert/global-alert-actions.component.ts","../../../projects/ids-angular/components/global-alert/global-alert.component.ts","../../../projects/ids-angular/components/global-alert/global-alert.component.html","../../../projects/ids-angular/components/global-alert/inera-ids-angular-components-global-alert.ts"],"sourcesContent":["import { Component, TemplateRef, viewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-global-alert-header',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDGlobalAlertHeaderComponent {\n\n  template = viewChild.required(TemplateRef);\n\n}\n","import { Component, TemplateRef, viewChild } from '@angular/core';\n\n@Component({\n  selector: 'id-global-alert-actions',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>`\n})\nexport class IDGlobalAlertActionsComponent {\n\n  template = viewChild.required(TemplateRef);\n\n}\n","import { Component, EventEmitter, Input, Output, booleanAttribute, contentChild, inject } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { IDGlobalAlertHeaderComponent } from \"./global-alert-header.component\";\nimport { IDGlobalAlertActionsComponent } from \"./global-alert-actions.component\";\nimport { IDUseIdService } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-global-alert\",\n  templateUrl: \"./global-alert.component.html\",\n  imports: [CommonModule],\n  standalone: true,\n  host: {\n    '[attr.role]': 'hostRole',\n    '[class]': 'hostClasses',\n  }\n})\nexport class IDGlobalAlertComponent {\n\n  private useId = inject(IDUseIdService);\n  protected contentId = this.useId.generateId('global-alert');\n\n  @Input({ transform: booleanAttribute }) agent: boolean = false;\n  @Input() srExpandText: string = \"Visa mer\";\n  @Input() srCollapseText: string = \"Visa mindre\";\n\n  private _collapsed: boolean = true;\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\n  header = contentChild(IDGlobalAlertHeaderComponent);\n  actions = contentChild(IDGlobalAlertActionsComponent);\n\n  @Output() collapsedChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n  @Output() closed: EventEmitter<void> = new EventEmitter<void>();\n  @Output() opened: EventEmitter<void> = new EventEmitter<void>();\n\n  get hostRole(): string | null {\n    return !this.agent ? 'alert' : null;\n  }\n\n  get hostClasses(): string {\n    const classes = ['ids-global-alert'];\n\n    if (this.collapsed) classes.push('ids-global-alert--collapsed');\n    if (this.agent) classes.push('ids-global-alert--agent');\n\n    return classes.join(' ');\n  }\n\n  toggleExpanded(): void {\n    this._collapsed = !this.collapsed;\n    this.collapsedChange.emit(this._collapsed);\n    if(this.collapsed) {\n      this.closed.emit();\n    } else {\n      this.opened.emit();\n    }\n  }\n}","<div class=\"ids-global-alert__inner\">\n  <div class=\"ids-global-alert__header\">\n    <button\n      class=\"ids-global-alert__button\"\n      [class.ids-global-alert__button--expanded]=\"!collapsed\"\n      [attr.aria-label]=\"this.collapsed ? this.srExpandText : this.srCollapseText\"\n      [attr.aria-controls]=\"contentId\"\n      [attr.aria-expanded]=\"!collapsed\"\n      (click)=\"toggleExpanded()\"\n    >\n      <div\n        class=\"ids-global-alert__icon-headline\"\n        [class.ids-global-alert__icon-headline--agent]=\"agent\"\n      >\n        @if (header(); as header) {\n          <div class=\"ids-global-alert__headline\">\n            <ng-container *ngTemplateOutlet=\"header.template()\"></ng-container>\n          </div>\n        }\n      </div>\n    </button>\n  </div>\n\n  <div\n    [attr.id]=\"contentId\"\n    class=\"ids-global-alert__content\"\n    [attr.aria-hidden]=\"collapsed ? 'true' : 'false'\"\n  >\n    <ng-content select=\":not(id-global-alert-header):not(id-global-alert-actions)\"></ng-content>\n  </div>\n  @if (actions(); as a) {\n    <div class=\"ids-global-alert__sub-content\">\n      <ng-container *ngTemplateOutlet=\"a.template()\"></ng-container>\n    </div>\n  }\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-header-1177-admin.mjs

@@ -1,6 +1,6 @@
 import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, inject, booleanAttribute, ViewChild, Output, Input, Component, TemplateRef, Directive, ContentChild, NgModule } from '@angular/core';
+import { EventEmitter, inject, viewChild, booleanAttribute, Output, Input, Component, TemplateRef, Directive, contentChild, NgModule } from '@angular/core';
 import { IDUseIdService, ID_HEADER_CONTEXT, useFocusTrap, useEscapeKey, IDClickOutsideDirective } from '@inera/ids-angular/common';
 
 class IDHeader1177AdminAvatarComponent {
@@ -14,8 +14,8 @@ class IDHeader1177AdminAvatarComponent {
     idService = inject(IDUseIdService);
     contentId = this.idService.generateId('header-1177-admin-avatar');
     header = inject(ID_HEADER_CONTEXT, { optional: true, host: true });
-    menuContent;
-    focusTrap = useFocusTrap(() => this.menuContent, { disabled: () => !this.expanded });
+    menuContent = viewChild('menuContent');
+    focusTrap = useFocusTrap(() => this.menuContent(), { disabled: () => !this.expanded });
     constructor() {
         useEscapeKey(() => this.handleCloseEvent(), () => this.expanded);
     }
@@ -46,7 +46,7 @@ class IDHeader1177AdminAvatarComponent {
         this.focusTrap.destroy();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDHeader1177AdminAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminAvatarComponent, isStandalone: true, selector: "id-header-1177-admin-avatar", inputs: { username: "username", unit: "unit", persistent: ["persistent", "persistent", booleanAttribute], expanded: ["expanded", "expanded", booleanAttribute] }, outputs: { expandedChange: "expandedChange", opened: "opened", closed: "closed" }, host: { properties: { "class.ids-header-1177-admin-avatar--unresponsive": "header?.unresponsive" }, classAttribute: "ids-header-1177-admin-avatar" }, viewQueries: [{ propertyName: "menuContent", first: true, predicate: ["menuContent"], descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminAvatarComponent, isStandalone: true, selector: "id-header-1177-admin-avatar", inputs: { username: "username", unit: "unit", persistent: ["persistent", "persistent", booleanAttribute], expanded: ["expanded", "expanded", booleanAttribute] }, outputs: { expandedChange: "expandedChange", opened: "opened", closed: "closed" }, host: { properties: { "class.ids-header-1177-admin-avatar--unresponsive": "header?.unresponsive" }, classAttribute: "ids-header-1177-admin-avatar" }, viewQueries: [{ propertyName: "menuContent", first: true, predicate: ["menuContent"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div
       class="ids-header-1177-admin-avatar__avatar"
       idClickOutside
@@ -168,16 +168,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Output
             }], closed: [{
                 type: Output
-            }], menuContent: [{
-                type: ViewChild,
-                args: ['menuContent']
             }] } });
 
 class IDHeader1177AdminNavComponent {
-    hideOnTablet = false;
-    template;
+    mobileOnly = false;
+    template = viewChild.required(TemplateRef);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDHeader1177AdminNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.20", type: IDHeader1177AdminNavComponent, isStandalone: true, selector: "id-header-1177-admin-nav", inputs: { hideOnTablet: ["hideOnTablet", "hideOnTablet", booleanAttribute] }, 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: IDHeader1177AdminNavComponent, isStandalone: true, selector: "id-header-1177-admin-nav", inputs: { mobileOnly: ["mobileOnly", "mobileOnly", booleanAttribute] }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template>
       <div class="ids-header-1177-admin-nav__inner">
         <div class="ids-header-1177-admin-nav__items">
@@ -202,12 +199,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
   `,
                     standalone: true,
                 }]
-        }], propDecorators: { hideOnTablet: [{
+        }], propDecorators: { mobileOnly: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
-            }], template: [{
-                type: ViewChild,
-                args: [TemplateRef]
             }] } });
 
 class IDHeader1177AdminBrandLinkDirective {
@@ -232,16 +226,16 @@ class IDHeader1177AdminComponent {
     unresponsive = false;
     brandHref;
     srBrandLabel = 'Logotyp';
-    avatar;
-    nav;
-    brandLink;
+    avatar = contentChild(IDHeader1177AdminAvatarComponent);
+    nav = contentChild(IDHeader1177AdminNavComponent);
+    brandLink = contentChild(IDHeader1177AdminBrandLinkDirective);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDHeader1177AdminComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminComponent, isStandalone: true, selector: "id-header-1177-admin", inputs: { brandText: "brandText", brandTextTop: "brandTextTop", brandTextBottom: "brandTextBottom", unresponsive: ["unresponsive", "unresponsive", booleanAttribute], brandHref: "brandHref", srBrandLabel: "srBrandLabel" }, providers: [
             {
                 provide: ID_HEADER_CONTEXT,
                 useExisting: IDHeader1177AdminComponent,
             },
-        ], queries: [{ propertyName: "avatar", first: true, predicate: IDHeader1177AdminAvatarComponent, descendants: true }, { propertyName: "nav", first: true, predicate: IDHeader1177AdminNavComponent, descendants: true }, { propertyName: "brandLink", first: true, predicate: IDHeader1177AdminBrandLinkDirective, descendants: true }], ngImport: i0, template: "<header class=\"ids-header-1177-admin\">\n  <ng-content select=\"id-header-1177-admin-skip-to-content\"></ng-content>\n  <div class=\"ids-header-1177-admin__main\">\n    <div class=\"ids-header-1177-admin__main-left\">\n      <div class=\"ids-header-1177-admin__logo\">\n        @if (brandLink) {\n          <ng-content select=\"[idBrand1177AdminLink]\"></ng-content>\n        } @else {\n          <a\n            [attr.href]=\"brandHref\"\n            class=\"ids-header-1177-admin__logo-link\"\n            [attr.aria-label]=\"srBrandLabel\"\n          ></a>\n        }\n      </div>\n      <div class=\"ids-header-1177-admin__brand\">\n        @if (brandTextTop) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextTop }}</div>\n        }\n        <div class=\"ids-header-1177-admin__brand-text\">{{ brandText }}</div>\n        @if (brandTextBottom) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextBottom }}</div>\n        }\n      </div>\n    </div>\n    <div class=\"ids-header-1177-admin__main-right\">\n      <ng-content select=\"id-header-1177-admin-item\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-avatar\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-menu-mobile\"></ng-content>\n    </div>\n  </div>\n  @if (nav) {\n    <nav\n      class=\"ids-header-1177-admin-nav\"\n      aria-label=\"Huvudmeny\"\n      [class.ids-header-1177-admin-nav--unresponsive]=\"unresponsive\"\n      [class.ids-header-1177-admin-nav--hide-on-tablet]=\"nav.hideOnTablet\"\n    >\n      <ng-container *ngTemplateOutlet=\"nav.template\"></ng-container>\n    </nav>\n  }\n</header>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+        ], queries: [{ propertyName: "avatar", first: true, predicate: IDHeader1177AdminAvatarComponent, descendants: true, isSignal: true }, { propertyName: "nav", first: true, predicate: IDHeader1177AdminNavComponent, descendants: true, isSignal: true }, { propertyName: "brandLink", first: true, predicate: IDHeader1177AdminBrandLinkDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<header class=\"ids-header-1177-admin\">\n  <ng-content select=\"id-header-1177-admin-skip-to-content\"></ng-content>\n  <div class=\"ids-header-1177-admin__main\">\n    <div class=\"ids-header-1177-admin__main-left\">\n      <div class=\"ids-header-1177-admin__logo\">\n        @if (brandLink()) {\n          <ng-content select=\"[idBrand1177AdminLink]\"></ng-content>\n        } @else {\n          <a\n            [attr.href]=\"brandHref\"\n            class=\"ids-header-1177-admin__logo-link\"\n            [attr.aria-label]=\"srBrandLabel\"\n          ></a>\n        }\n      </div>\n      <div class=\"ids-header-1177-admin__brand\">\n        @if (brandTextTop) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextTop }}</div>\n        }\n        <div class=\"ids-header-1177-admin__brand-text\">{{ brandText }}</div>\n        @if (brandTextBottom) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextBottom }}</div>\n        }\n      </div>\n    </div>\n    <div class=\"ids-header-1177-admin__main-right\">\n      <ng-content select=\"id-header-1177-admin-item\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-avatar\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-menu-mobile\"></ng-content>\n    </div>\n  </div>\n  @if (nav()) {\n    <nav\n      class=\"ids-header-1177-admin-nav\"\n      aria-label=\"Huvudmeny\"\n      [class.ids-header-1177-admin-nav--unresponsive]=\"unresponsive\"\n      [class.ids-header-1177-admin-nav--only-mobile]=\"nav()!.mobileOnly\"\n    >\n      <ng-container *ngTemplateOutlet=\"nav()!.template()\"></ng-container>\n    </nav>\n  }\n</header>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDHeader1177AdminComponent, decorators: [{
             type: Component,
@@ -250,7 +244,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                             provide: ID_HEADER_CONTEXT,
                             useExisting: IDHeader1177AdminComponent,
                         },
-                    ], standalone: true, imports: [NgTemplateOutlet], template: "<header class=\"ids-header-1177-admin\">\n  <ng-content select=\"id-header-1177-admin-skip-to-content\"></ng-content>\n  <div class=\"ids-header-1177-admin__main\">\n    <div class=\"ids-header-1177-admin__main-left\">\n      <div class=\"ids-header-1177-admin__logo\">\n        @if (brandLink) {\n          <ng-content select=\"[idBrand1177AdminLink]\"></ng-content>\n        } @else {\n          <a\n            [attr.href]=\"brandHref\"\n            class=\"ids-header-1177-admin__logo-link\"\n            [attr.aria-label]=\"srBrandLabel\"\n          ></a>\n        }\n      </div>\n      <div class=\"ids-header-1177-admin__brand\">\n        @if (brandTextTop) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextTop }}</div>\n        }\n        <div class=\"ids-header-1177-admin__brand-text\">{{ brandText }}</div>\n        @if (brandTextBottom) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextBottom }}</div>\n        }\n      </div>\n    </div>\n    <div class=\"ids-header-1177-admin__main-right\">\n      <ng-content select=\"id-header-1177-admin-item\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-avatar\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-menu-mobile\"></ng-content>\n    </div>\n  </div>\n  @if (nav) {\n    <nav\n      class=\"ids-header-1177-admin-nav\"\n      aria-label=\"Huvudmeny\"\n      [class.ids-header-1177-admin-nav--unresponsive]=\"unresponsive\"\n      [class.ids-header-1177-admin-nav--hide-on-tablet]=\"nav.hideOnTablet\"\n    >\n      <ng-container *ngTemplateOutlet=\"nav.template\"></ng-container>\n    </nav>\n  }\n</header>\n" }]
+                    ], standalone: true, imports: [NgTemplateOutlet], template: "<header class=\"ids-header-1177-admin\">\n  <ng-content select=\"id-header-1177-admin-skip-to-content\"></ng-content>\n  <div class=\"ids-header-1177-admin__main\">\n    <div class=\"ids-header-1177-admin__main-left\">\n      <div class=\"ids-header-1177-admin__logo\">\n        @if (brandLink()) {\n          <ng-content select=\"[idBrand1177AdminLink]\"></ng-content>\n        } @else {\n          <a\n            [attr.href]=\"brandHref\"\n            class=\"ids-header-1177-admin__logo-link\"\n            [attr.aria-label]=\"srBrandLabel\"\n          ></a>\n        }\n      </div>\n      <div class=\"ids-header-1177-admin__brand\">\n        @if (brandTextTop) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextTop }}</div>\n        }\n        <div class=\"ids-header-1177-admin__brand-text\">{{ brandText }}</div>\n        @if (brandTextBottom) {\n          <div class=\"ids-header-1177-admin__brand-text---supplement\">{{ brandTextBottom }}</div>\n        }\n      </div>\n    </div>\n    <div class=\"ids-header-1177-admin__main-right\">\n      <ng-content select=\"id-header-1177-admin-item\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-avatar\"></ng-content>\n      <ng-content select=\"id-header-1177-admin-menu-mobile\"></ng-content>\n    </div>\n  </div>\n  @if (nav()) {\n    <nav\n      class=\"ids-header-1177-admin-nav\"\n      aria-label=\"Huvudmeny\"\n      [class.ids-header-1177-admin-nav--unresponsive]=\"unresponsive\"\n      [class.ids-header-1177-admin-nav--only-mobile]=\"nav()!.mobileOnly\"\n    >\n      <ng-container *ngTemplateOutlet=\"nav()!.template()\"></ng-container>\n    </nav>\n  }\n</header>\n" }]
         }], propDecorators: { brandText: [{
                 type: Input
             }], brandTextTop: [{
@@ -264,15 +258,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Input
             }], srBrandLabel: [{
                 type: Input
-            }], avatar: [{
-                type: ContentChild,
-                args: [IDHeader1177AdminAvatarComponent]
-            }], nav: [{
-                type: ContentChild,
-                args: [IDHeader1177AdminNavComponent]
-            }], brandLink: [{
-                type: ContentChild,
-                args: [IDHeader1177AdminBrandLinkDirective]
             }] } });
 
 class IDHeader1177AdminSkipToContent {
@@ -400,8 +385,8 @@ class IDHeader1177AdminAvatarMobileComponent {
     idService = inject(IDUseIdService);
     contentId = this.idService.generateId('header-1177-admin-avatar');
     header = inject(ID_HEADER_CONTEXT, { optional: true, host: true });
-    menuContent;
-    focusTrap = useFocusTrap(() => this.menuContent, { disabled: () => !this.expanded });
+    menuContent = viewChild('menuContent');
+    focusTrap = useFocusTrap(() => this.menuContent(), { disabled: () => !this.expanded });
     constructor() {
         useEscapeKey(() => this.handleCloseEvent(), () => this.expanded);
     }
@@ -432,7 +417,7 @@ class IDHeader1177AdminAvatarMobileComponent {
         this.focusTrap.destroy();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDHeader1177AdminAvatarMobileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminAvatarMobileComponent, isStandalone: true, selector: "id-header-1177-admin-avatar-mobile", inputs: { username: "username", unit: "unit", expanded: ["expanded", "expanded", booleanAttribute], persistent: ["persistent", "persistent", booleanAttribute] }, outputs: { expandedChange: "expandedChange", opened: "opened", closed: "closed" }, host: { classAttribute: "ids-header-1177-admin-avatar-mobile" }, viewQueries: [{ propertyName: "menuContent", first: true, predicate: ["menuContent"], descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminAvatarMobileComponent, isStandalone: true, selector: "id-header-1177-admin-avatar-mobile", inputs: { username: "username", unit: "unit", expanded: ["expanded", "expanded", booleanAttribute], persistent: ["persistent", "persistent", booleanAttribute] }, outputs: { expandedChange: "expandedChange", opened: "opened", closed: "closed" }, host: { classAttribute: "ids-header-1177-admin-avatar-mobile" }, viewQueries: [{ propertyName: "menuContent", first: true, predicate: ["menuContent"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div #menuContent class="ids-header-1177-admin-avatar-mobile__menu-wrapper"
     idClickOutside
     (idClickOutside)="handleCloseEvent()">
@@ -517,9 +502,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Output
             }], closed: [{
                 type: Output
-            }], menuContent: [{
-                type: ViewChild,
-                args: ['menuContent']
             }] } });
 
 class IDHeader1177AdminNavItemComponent {
@@ -529,10 +511,10 @@ class IDHeader1177AdminNavItemComponent {
     activeChange = new EventEmitter();
     expanded = false;
     expandedChange = new EventEmitter();
-    col1 = null;
-    col2 = null;
-    col3 = null;
-    col4 = null;
+    col1 = contentChild('col1');
+    col2 = contentChild('col2');
+    col3 = contentChild('col3');
+    col4 = contentChild('col4');
     idService = inject(IDUseIdService);
     contentId = this.idService.generateId('header-1177-admin-nav-item');
     header = inject(ID_HEADER_CONTEXT, { optional: true, host: true });
@@ -558,7 +540,7 @@ class IDHeader1177AdminNavItemComponent {
         this.activeChange.emit(false);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDHeader1177AdminNavItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminNavItemComponent, isStandalone: true, selector: "id-header-1177-admin-nav-item", inputs: { label: "label", notifications: "notifications", active: ["active", "active", booleanAttribute], expanded: ["expanded", "expanded", booleanAttribute] }, outputs: { activeChange: "activeChange", expandedChange: "expandedChange" }, host: { properties: { "class.ids-header-1177-admin-nav-item--unresponsive": "header?.unresponsive", "class.ids-header-1177-admin-nav-item--active": "active || expanded", "attr.aria-current": "active", "class.ids-header-1177-admin-nav-item--expanded": "expanded" }, classAttribute: "ids-header-1177-admin-nav-item" }, queries: [{ propertyName: "col1", first: true, predicate: ["col1"], descendants: true }, { propertyName: "col2", first: true, predicate: ["col2"], descendants: true }, { propertyName: "col3", first: true, predicate: ["col3"], descendants: true }, { propertyName: "col4", first: true, predicate: ["col4"], descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDHeader1177AdminNavItemComponent, isStandalone: true, selector: "id-header-1177-admin-nav-item", inputs: { label: "label", notifications: "notifications", active: ["active", "active", booleanAttribute], expanded: ["expanded", "expanded", booleanAttribute] }, outputs: { activeChange: "activeChange", expandedChange: "expandedChange" }, host: { properties: { "class.ids-header-1177-admin-nav-item--unresponsive": "header?.unresponsive", "class.ids-header-1177-admin-nav-item--active": "active || expanded", "attr.aria-current": "active", "class.ids-header-1177-admin-nav-item--expanded": "expanded" }, classAttribute: "ids-header-1177-admin-nav-item" }, queries: [{ propertyName: "col1", first: true, predicate: ["col1"], descendants: true, isSignal: true }, { propertyName: "col2", first: true, predicate: ["col2"], descendants: true, isSignal: true }, { propertyName: "col3", first: true, predicate: ["col3"], descendants: true, isSignal: true }, { propertyName: "col4", first: true, predicate: ["col4"], descendants: true, isSignal: true }], ngImport: i0, template: `
   <div
     idClickOutside
     (idClickOutside)="closeItem()">
@@ -580,16 +562,16 @@ class IDHeader1177AdminNavItemComponent {
       [class.ids-header-1177-admin-nav-item__menu--expanded]="expanded">
       <div class="ids-header-1177-admin-nav-item__menu-content">
         <div class="ids-header-1177-admin-nav-item__menu-col-1">
-          <ng-container *ngTemplateOutlet="col1"></ng-container>
+          <ng-container *ngTemplateOutlet="col1() ?? null"></ng-container>
         </div>
         <div class="ids-header-1177-admin-nav-item__menu-col-2">
-          <ng-container *ngTemplateOutlet="col2"></ng-container>
+          <ng-container *ngTemplateOutlet="col2() ?? null"></ng-container>
         </div>
         <div class="ids-header-1177-admin-nav-item__menu-col-3">
-          <ng-container *ngTemplateOutlet="col3"></ng-container>
+          <ng-container *ngTemplateOutlet="col3() ?? null"></ng-container>
         </div>
         <div class="ids-header-1177-admin-nav-item__menu-col-4">
-          <ng-container *ngTemplateOutlet="col4"></ng-container>
+          <ng-container *ngTemplateOutlet="col4() ?? null"></ng-container>
         </div>
       </div>
     </div>
@@ -621,16 +603,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
       [class.ids-header-1177-admin-nav-item__menu--expanded]="expanded">
       <div class="ids-header-1177-admin-nav-item__menu-content">
         <div class="ids-header-1177-admin-nav-item__menu-col-1">
-          <ng-container *ngTemplateOutlet="col1"></ng-container>
+          <ng-container *ngTemplateOutlet="col1() ?? null"></ng-container>
         </div>
         <div class="ids-header-1177-admin-nav-item__menu-col-2">
-          <ng-container *ngTemplateOutlet="col2"></ng-container>
+          <ng-container *ngTemplateOutlet="col2() ?? null"></ng-container>
         </div>
         <div class="ids-header-1177-admin-nav-item__menu-col-3">
-          <ng-container *ngTemplateOutlet="col3"></ng-container>
+          <ng-container *ngTemplateOutlet="col3() ?? null"></ng-container>
         </div>
         <div class="ids-header-1177-admin-nav-item__menu-col-4">
-          <ng-container *ngTemplateOutlet="col4"></ng-container>
+          <ng-container *ngTemplateOutlet="col4() ?? null"></ng-container>
         </div>
       </div>
     </div>
@@ -659,18 +641,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 args: [{ transform: booleanAttribute }]
             }], expandedChange: [{
                 type: Output
-            }], col1: [{
-                type: ContentChild,
-                args: ['col1']
-            }], col2: [{
-                type: ContentChild,
-                args: ['col2']
-            }], col3: [{
-                type: ContentChild,
-                args: ['col3']
-            }], col4: [{
-                type: ContentChild,
-                args: ['col4']
             }] } });
 
 class IDHeader1177AdminNavItemMenuLinkComponent {