@inera/ids-angular 9.2.0 → 9.3.0

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, Component, ElementRef, booleanAttribute, Input, ContentChild, HostBinding } from '@angular/core';
+import { inject, Component, HostBinding, Input, ElementRef, contentChild, booleanAttribute } from '@angular/core';
 import { IDUseIdService, IDFormBase } from '@inera/ids-angular/common';
 
 class IDInputHintComponent {
@@ -37,10 +37,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 }]
         }] });
 
+class IDInputIconComponent {
+    name;
+    get class() {
+        return ['ids-input__icon', 'ids-icon-' + this.name].join(" ");
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDInputIconComponent, isStandalone: true, selector: "id-input-icon", inputs: { name: "name" }, host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>", isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputIconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "id-input-icon",
+                    template: "<ng-content></ng-content>",
+                    standalone: true,
+                }]
+        }], propDecorators: { name: [{
+                type: Input
+            }], class: [{
+                type: HostBinding
+            }] } });
+
+class IDInputClearButtonComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputClearButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDInputClearButtonComponent, isStandalone: true, selector: "id-input-clear-button", host: { classAttribute: "ids-input__clear-button" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputClearButtonComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'id-input-clear-button',
+                    template: '<ng-content></ng-content>',
+                    standalone: true,
+                    host: {
+                        class: 'ids-input__clear-button',
+                    },
+                }]
+        }] });
+
 class IDInputComponent extends IDFormBase {
     elementRef = inject(ElementRef);
-    hintComponent;
-    unitComponent;
+    hintComponent = contentChild(IDInputHintComponent);
+    iconComponent = contentChild(IDInputIconComponent);
+    clearButtonComponent = contentChild(IDInputClearButtonComponent);
+    unitComponent = contentChild(IDInputUnitComponent);
     showSearchLabel = false;
     search = false;
     externalClasses = [];
@@ -53,6 +92,18 @@ class IDInputComponent extends IDFormBase {
         const classes = new Set([...this.externalClasses, hostClass]);
         if (this.search) {
             classes.add(`${hostClass}--search`);
+            if (!this.showSearchLabel) {
+                this.label?.classList.add('ids-label--sr-only');
+            }
+        }
+        if (!!this.iconComponent) {
+            classes.add(`${hostClass}--icon`);
+        }
+        if (!!this.clearButtonComponent) {
+            classes.add(`${hostClass}--clear-button`);
+        }
+        if (!!this.unitComponent) {
+            classes.add(`${hostClass}--unit`);
         }
         return Array.from(classes).join(' ');
     }
@@ -61,20 +112,14 @@ class IDInputComponent extends IDFormBase {
         this.renderer.addClass(this.input, 'ids-input__input');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.20", type: IDInputComponent, isStandalone: true, selector: "id-input", inputs: { showSearchLabel: ["showSearchLabel", "showSearchLabel", booleanAttribute], search: ["search", "search", booleanAttribute] }, host: { properties: { "class": "hostClasses" } }, queries: [{ propertyName: "hintComponent", first: true, predicate: IDInputHintComponent, descendants: true }, { propertyName: "unitComponent", first: true, predicate: IDInputUnitComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ids-input__wrapper\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <span [class.ids-hidden]=\"search && !showSearchLabel\">\n      <ng-content select=\"label\"></ng-content>\n    </span>\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-input__unit-wrapper\">\n    <div class=\"ids-input__input-wrapper\">\n      <span [class.ids-input__search-icon]=\"search\"></span>\n      <ng-content></ng-content>\n    </div>\n    <ng-content select=\"id-input-unit\"></ng-content>\n  </div>\n\n  <ng-content select=\"id-input-hint\"></ng-content>\n\n  <ng-content select=\"id-error-message\"></ng-content>\n</div>\n\n<ng-content select=\"button\"></ng-content>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDInputComponent, isStandalone: true, selector: "id-input", inputs: { showSearchLabel: ["showSearchLabel", "showSearchLabel", booleanAttribute], search: ["search", "search", booleanAttribute] }, host: { properties: { "class": "hostClasses" } }, queries: [{ propertyName: "hintComponent", first: true, predicate: IDInputHintComponent, descendants: true, isSignal: true }, { propertyName: "iconComponent", first: true, predicate: IDInputIconComponent, descendants: true, isSignal: true }, { propertyName: "clearButtonComponent", first: true, predicate: IDInputClearButtonComponent, descendants: true, isSignal: true }, { propertyName: "unitComponent", first: true, predicate: IDInputUnitComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ids-input__wrapper\">\n  <div\n    class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\"\n    [class.ids-label-wrapper--sr-only]=\"search && !showSearchLabel\"\n  >\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\n  <div class=\"ids-input__input-wrapper\">\n    <span [class.ids-input__search-icon]=\"search\"></span>\n    <ng-content></ng-content>\n    <ng-content select=\"id-input-icon\"></ng-content>\n    <ng-content select=\"id-input-clear-button\"></ng-content>\n    <ng-content select=\"id-input-unit\"></ng-content>\n  </div>\n\n  <ng-content select=\"id-input-hint\"></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</div>\n\n<ng-content select=\"button\"></ng-content>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'id-input', standalone: true, host: {
                         '[class]': 'hostClasses',
-                    }, template: "<div class=\"ids-input__wrapper\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <span [class.ids-hidden]=\"search && !showSearchLabel\">\n      <ng-content select=\"label\"></ng-content>\n    </span>\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-input__unit-wrapper\">\n    <div class=\"ids-input__input-wrapper\">\n      <span [class.ids-input__search-icon]=\"search\"></span>\n      <ng-content></ng-content>\n    </div>\n    <ng-content select=\"id-input-unit\"></ng-content>\n  </div>\n\n  <ng-content select=\"id-input-hint\"></ng-content>\n\n  <ng-content select=\"id-error-message\"></ng-content>\n</div>\n\n<ng-content select=\"button\"></ng-content>\n" }]
-        }], propDecorators: { hintComponent: [{
-                type: ContentChild,
-                args: [IDInputHintComponent]
-            }], unitComponent: [{
-                type: ContentChild,
-                args: [IDInputUnitComponent]
-            }], showSearchLabel: [{
+                    }, template: "<div class=\"ids-input__wrapper\">\n  <div\n    class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\"\n    [class.ids-label-wrapper--sr-only]=\"search && !showSearchLabel\"\n  >\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\n  <div class=\"ids-input__input-wrapper\">\n    <span [class.ids-input__search-icon]=\"search\"></span>\n    <ng-content></ng-content>\n    <ng-content select=\"id-input-icon\"></ng-content>\n    <ng-content select=\"id-input-clear-button\"></ng-content>\n    <ng-content select=\"id-input-unit\"></ng-content>\n  </div>\n\n  <ng-content select=\"id-input-hint\"></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</div>\n\n<ng-content select=\"button\"></ng-content>\n" }]
+        }], propDecorators: { showSearchLabel: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
             }], search: [{
@@ -82,30 +127,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 args: [{ transform: booleanAttribute }]
             }] } });
 
-class IDInputIconComponent {
-    name;
-    get class() {
-        return ['ids-input__icon', 'ids-icon-' + this.name].join(" ");
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDInputIconComponent, isStandalone: true, selector: "id-input-icon", inputs: { name: "name" }, host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>", isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDInputIconComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: "id-input-icon",
-                    template: "<ng-content></ng-content>",
-                    standalone: true,
-                }]
-        }], propDecorators: { name: [{
-                type: Input
-            }], class: [{
-                type: HostBinding
-            }] } });
-
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { IDInputComponent, IDInputHintComponent, IDInputIconComponent, IDInputUnitComponent };
+export { IDInputClearButtonComponent, IDInputComponent, IDInputHintComponent, IDInputIconComponent, IDInputUnitComponent };
 //# sourceMappingURL=inera-ids-angular-components-form-input.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-input.mjs","sources":["../../../projects/ids-angular/components/form/input/input-hint.component.ts","../../../projects/ids-angular/components/form/input/input-unit.component.ts","../../../projects/ids-angular/components/form/input/input.component.ts","../../../projects/ids-angular/components/form/input/input.component.html","../../../projects/ids-angular/components/form/input/input-icon.component.ts","../../../projects/ids-angular/components/form/input/inera-ids-angular-components-form-input.ts"],"sourcesContent":["import { Component, ElementRef, inject, OnInit } from '@angular/core';\nimport { IDUseIdService } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-input-hint',\n  template: '<ng-content></ng-content>',\n  standalone: true,\n  host: {\n    class: 'ids-input__hint',\n    '[id]': 'id',\n  },\n})\nexport class IDInputHintComponent {\n  readonly id = inject(IDUseIdService).generateId('hint');\n}\n","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'id-input-unit',\n  template: '<ng-content></ng-content>',\n  standalone: true,\n  host: {\n    class: 'ids-input__unit',\n    'aria-hidden': 'true',\n  },\n})\nexport class IDInputUnitComponent {}\n","import {\n  AfterContentInit,\n  Component,\n  ContentChild,\n  ElementRef,\n  Input,\n  OnInit,\n  booleanAttribute,\n  inject,\n} from '@angular/core';\nimport { IDFormBase } from '@inera/ids-angular/common';\nimport { IDInputHintComponent } from './input-hint.component';\nimport { IDInputUnitComponent } from './input-unit.component';\n\n@Component({\n  selector: 'id-input',\n  templateUrl: './input.component.html',\n  standalone: true,\n  host: {\n    '[class]': 'hostClasses',\n  },\n})\nexport class IDInputComponent extends IDFormBase implements OnInit, AfterContentInit {\n  private elementRef = inject(ElementRef);\n\n  @ContentChild(IDInputHintComponent)\n  hintComponent: IDInputHintComponent | undefined;\n\n  @ContentChild(IDInputUnitComponent)\n  unitComponent: IDInputUnitComponent | undefined;\n\n  @Input({ transform: booleanAttribute }) showSearchLabel: boolean = false;\n\n  @Input({ transform: booleanAttribute }) search: boolean = false;\n\n  private externalClasses: string[] = [];\n\n  ngOnInit(): void {\n    const hostEl = this.elementRef.nativeElement as HTMLElement;\n    this.externalClasses = (hostEl.getAttribute('class') ?? '').split(/\\s+/).filter(Boolean);\n  }\n\n  get hostClasses(): string {\n    const hostClass = 'ids-input';\n    const classes = new Set([...this.externalClasses, hostClass]);\n    if (this.search) {\n      classes.add(`${hostClass}--search`);\n    }\n    return Array.from(classes).join(' ');\n  }\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.renderer.addClass(this.input, 'ids-input__input');\n  }\n}\n","<div class=\"ids-input__wrapper\">\n  <div class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\">\n    <span [class.ids-hidden]=\"search && !showSearchLabel\">\n      <ng-content select=\"label\"></ng-content>\n    </span>\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-input__unit-wrapper\">\n    <div class=\"ids-input__input-wrapper\">\n      <span [class.ids-input__search-icon]=\"search\"></span>\n      <ng-content></ng-content>\n    </div>\n    <ng-content select=\"id-input-unit\"></ng-content>\n  </div>\n\n  <ng-content select=\"id-input-hint\"></ng-content>\n\n  <ng-content select=\"id-error-message\"></ng-content>\n</div>\n\n<ng-content select=\"button\"></ng-content>\n","import { Component, HostBinding, Input } from \"@angular/core\";\n\n@Component({\n  selector: \"id-input-icon\",\n  template: \"<ng-content></ng-content>\",\n  standalone: true,\n})\nexport class IDInputIconComponent {\n\n  @Input() name?: string;\n\n  @HostBinding()\n  get class () {\n    return ['ids-input__icon', 'ids-icon-' + this.name].join(\" \");\n  }\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-input.mjs","sources":["../../../projects/ids-angular/components/form/input/input-hint.component.ts","../../../projects/ids-angular/components/form/input/input-unit.component.ts","../../../projects/ids-angular/components/form/input/input-icon.component.ts","../../../projects/ids-angular/components/form/input/input-clear-button.component.ts","../../../projects/ids-angular/components/form/input/input.component.ts","../../../projects/ids-angular/components/form/input/input.component.html","../../../projects/ids-angular/components/form/input/inera-ids-angular-components-form-input.ts"],"sourcesContent":["import { Component, ElementRef, inject, OnInit } from '@angular/core';\nimport { IDUseIdService } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-input-hint',\n  template: '<ng-content></ng-content>',\n  standalone: true,\n  host: {\n    class: 'ids-input__hint',\n    '[id]': 'id',\n  },\n})\nexport class IDInputHintComponent {\n  readonly id = inject(IDUseIdService).generateId('hint');\n}\n","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'id-input-unit',\n  template: '<ng-content></ng-content>',\n  standalone: true,\n  host: {\n    class: 'ids-input__unit',\n    'aria-hidden': 'true',\n  },\n})\nexport class IDInputUnitComponent {}\n","import { Component, HostBinding, Input } from \"@angular/core\";\n\n@Component({\n  selector: \"id-input-icon\",\n  template: \"<ng-content></ng-content>\",\n  standalone: true,\n})\nexport class IDInputIconComponent {\n\n  @Input() name?: string;\n\n  @HostBinding()\n  get class () {\n    return ['ids-input__icon', 'ids-icon-' + this.name].join(\" \");\n  }\n\n}\n","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'id-input-clear-button',\n  template: '<ng-content></ng-content>',\n  standalone: true,\n  host: {\n    class: 'ids-input__clear-button',\n  },\n})\nexport class IDInputClearButtonComponent {}\n","import {\n  AfterContentInit,\n  Component,\n  ElementRef,\n  Input,\n  OnInit,\n  booleanAttribute,\n  inject,\n  contentChild,\n} from '@angular/core';\nimport { IDFormBase } from '@inera/ids-angular/common';\nimport { IDInputHintComponent } from './input-hint.component';\nimport { IDInputUnitComponent } from './input-unit.component';\nimport { IDInputIconComponent } from './input-icon.component';\nimport { IDInputClearButtonComponent } from './input-clear-button.component';\n\n@Component({\n  selector: 'id-input',\n  templateUrl: './input.component.html',\n  standalone: true,\n  host: {\n    '[class]': 'hostClasses',\n  },\n})\nexport class IDInputComponent extends IDFormBase implements OnInit, AfterContentInit {\n  private elementRef = inject(ElementRef);\n\n  hintComponent = contentChild(IDInputHintComponent);\n\n  iconComponent = contentChild(IDInputIconComponent);\n\n  clearButtonComponent = contentChild(IDInputClearButtonComponent);\n\n  unitComponent = contentChild(IDInputUnitComponent);\n\n  @Input({ transform: booleanAttribute }) showSearchLabel: boolean = false;\n\n  @Input({ transform: booleanAttribute }) search: boolean = false;\n\n  private externalClasses: string[] = [];\n\n  ngOnInit(): void {\n    const hostEl = this.elementRef.nativeElement as HTMLElement;\n    this.externalClasses = (hostEl.getAttribute('class') ?? '').split(/\\s+/).filter(Boolean);\n  }\n\n  get hostClasses(): string {\n    const hostClass = 'ids-input';\n    const classes = new Set([...this.externalClasses, hostClass]);\n    if (this.search) {\n      classes.add(`${hostClass}--search`);\n      if (!this.showSearchLabel) {\n        this.label?.classList.add('ids-label--sr-only');\n      }\n    }\n    if (!!this.iconComponent) {\n      classes.add(`${hostClass}--icon`);\n    }\n    if (!!this.clearButtonComponent) {\n      classes.add(`${hostClass}--clear-button`);\n    }\n    if (!!this.unitComponent) {\n      classes.add(`${hostClass}--unit`);\n    }\n    return Array.from(classes).join(' ');\n  }\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.renderer.addClass(this.input, 'ids-input__input');\n  }\n}\n","<div class=\"ids-input__wrapper\">\n  <div\n    class=\"ids-label-wrapper ids-label-wrapper--margin-bottom\"\n    [class.ids-label-wrapper--sr-only]=\"search && !showSearchLabel\"\n  >\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\n  <div class=\"ids-input__input-wrapper\">\n    <span [class.ids-input__search-icon]=\"search\"></span>\n    <ng-content></ng-content>\n    <ng-content select=\"id-input-icon\"></ng-content>\n    <ng-content select=\"id-input-clear-button\"></ng-content>\n    <ng-content select=\"id-input-unit\"></ng-content>\n  </div>\n\n  <ng-content select=\"id-input-hint\"></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</div>\n\n<ng-content select=\"button\"></ng-content>\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-label-subtitle.mjs

@@ -0,0 +1,25 @@
+import * as i0 from '@angular/core';
+import { Component } from '@angular/core';
+
+class IDLabelSubtitleComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDLabelSubtitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDLabelSubtitleComponent, isStandalone: true, selector: "id-label-subtitle", host: { classAttribute: "ids-subtitle" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDLabelSubtitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'id-label-subtitle',
+                    template: '<ng-content></ng-content>',
+                    standalone: true,
+                    host: {
+                        class: 'ids-subtitle',
+                    },
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { IDLabelSubtitleComponent };
+//# sourceMappingURL=inera-ids-angular-components-form-label-subtitle.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"inera-ids-angular-components-form-label-subtitle.mjs","sources":["../../../projects/ids-angular/components/form/label-subtitle/label-subtitle.component.ts","../../../projects/ids-angular/components/form/label-subtitle/inera-ids-angular-components-form-label-subtitle.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  selector: 'id-label-subtitle',\n  template: '<ng-content></ng-content>',\n  standalone: true,\n  host: {\n    class: 'ids-subtitle',\n  },\n})\nexport class IDLabelSubtitleComponent  {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAUa,wBAAwB,CAAA;wGAAxB,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,wBAAwB,uHANzB,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;4FAM1B,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBARpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,QAAQ,EAAE,2BAA2B;AACrC,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,cAAc;AACtB,qBAAA;AACF,iBAAA;;;ACTD;;AAEG;;;;"}

package/fesm2022/inera-ids-angular-components-form-radio-button.mjs

@@ -1,14 +1,14 @@
 import * as i0 from '@angular/core';
-import { Input, ContentChildren, Component } from '@angular/core';
+import { contentChildren, Input, Component } from '@angular/core';
 import { IDFormBase } from '@inera/ids-angular/common';
 import { IDRadioComponent } from '@inera/ids-angular/components/form/radio';
 
 class IDRadioButtonGroupComponent extends IDFormBase {
-    radios;
+    radios = contentChildren(IDRadioComponent);
     name;
     legend;
     ngAfterContentInit() {
-        this.radios.forEach((radio) => {
+        this.radios().forEach((radio) => {
             radio.invalidChange.subscribe((value) => {
                 this.checkShowErrorMessage();
             });
@@ -26,20 +26,17 @@ class IDRadioButtonGroupComponent extends IDFormBase {
     }
     checkShowErrorMessage() {
         if (this.errorMessage) {
-            const isInvalidPresent = this.radios.find((radio) => radio.invalid);
+            const isInvalidPresent = this.radios().find((radio) => radio.invalid);
             this.errorMessage.show = Boolean(isInvalidPresent);
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRadioButtonGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDRadioButtonGroupComponent, isStandalone: true, selector: "id-radio-button-group", inputs: { name: "name", legend: "legend" }, queries: [{ propertyName: "radios", predicate: IDRadioComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ids-form-group__fieldset ids-form-group__fieldset--compact\">\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n</div>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDRadioButtonGroupComponent, isStandalone: true, selector: "id-radio-button-group", inputs: { name: "name", legend: "legend" }, queries: [{ propertyName: "radios", predicate: IDRadioComponent, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ids-form-group__fieldset ids-form-group__fieldset--compact\">\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n</div>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRadioButtonGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: "id-radio-button-group", standalone: true, template: "<div class=\"ids-form-group__fieldset ids-form-group__fieldset--compact\">\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n</div>\n" }]
-        }], propDecorators: { radios: [{
-                type: ContentChildren,
-                args: [IDRadioComponent]
-            }], name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], legend: [{
                 type: Input

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

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-radio-button.mjs","sources":["../../../projects/ids-angular/components/form/radio-button/radio-button-group.component.ts","../../../projects/ids-angular/components/form/radio-button/radio-button-group.component.html","../../../projects/ids-angular/components/form/radio-button/radio-button.component.ts","../../../projects/ids-angular/components/form/radio-button/radio-button.component.html","../../../projects/ids-angular/components/form/radio-button/inera-ids-angular-components-form-radio-button.ts"],"sourcesContent":["import { Component, ContentChildren, Input, QueryList } from \"@angular/core\";\nimport { IDFormBase } from \"@inera/ids-angular/common\";\nimport { IDRadioComponent } from \"@inera/ids-angular/components/form/radio\";\n\n@Component({\n  selector: \"id-radio-button-group\",\n  templateUrl: \"./radio-button-group.component.html\",\n  standalone: true\n})\nexport class IDRadioButtonGroupComponent extends IDFormBase {\n\n  @ContentChildren(IDRadioComponent)\n  radios: QueryList<IDRadioComponent>;\n\n  @Input() name?: string;\n  @Input() legend?: string;\n\n  ngAfterContentInit(): void {\n    this.radios.forEach((radio) => {\n      radio.invalidChange.subscribe((value: boolean) => {\n        this.checkShowErrorMessage();\n      });\n    });\n    this.checkShowErrorMessage();\n    this.setupNames();\n  }\n\n  setupNames() {\n    if(this.name) {\n      const inputs = this.host.nativeElement.querySelectorAll('input')\n      inputs?.forEach((input: HTMLInputElement) => {\n        this.renderer.setAttribute(input, 'name', this.name!);\n      })\n    }\n  }\n\n  checkShowErrorMessage() {\n    if(this.errorMessage) {\n      const isInvalidPresent = this.radios.find((radio) => radio.invalid);\n      this.errorMessage.show = Boolean(isInvalidPresent);\n    }\n  }\n}\n","<div class=\"ids-form-group__fieldset ids-form-group__fieldset--compact\">\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n</div>\n","import { AfterContentInit, Component, Input } from \"@angular/core\";\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-radio-button\",\n  templateUrl: \"./radio-button.component.html\",\n  standalone: true\n})\nexport class IDRadioButtonComponent extends IDFormBase implements AfterContentInit {\n\n  @Input() icon?: string;\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.input.classList.add('ids-radio-button__input');\n    this.label.classList.add('ids-radio-button__label');\n    if(this.icon) {\n      this.label.classList.add(`ids-icon-${this.icon}`);\n    }\n  }\n}\n","<div class=\"ids-radio-button\">\n  <ng-content></ng-content>\n</div>","/**\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-radio-button.mjs","sources":["../../../projects/ids-angular/components/form/radio-button/radio-button-group.component.ts","../../../projects/ids-angular/components/form/radio-button/radio-button-group.component.html","../../../projects/ids-angular/components/form/radio-button/radio-button.component.ts","../../../projects/ids-angular/components/form/radio-button/radio-button.component.html","../../../projects/ids-angular/components/form/radio-button/inera-ids-angular-components-form-radio-button.ts"],"sourcesContent":["import { Component, Input, contentChildren } from '@angular/core';\nimport { IDFormBase } from \"@inera/ids-angular/common\";\nimport { IDRadioComponent } from \"@inera/ids-angular/components/form/radio\";\n\n@Component({\n  selector: \"id-radio-button-group\",\n  templateUrl: \"./radio-button-group.component.html\",\n  standalone: true\n})\nexport class IDRadioButtonGroupComponent extends IDFormBase {\n\n    radios = contentChildren(IDRadioComponent);\n\n  @Input() name?: string;\n  @Input() legend?: string;\n\n  ngAfterContentInit(): void {\n    this.radios().forEach((radio) => {\n      radio.invalidChange.subscribe((value: boolean) => {\n        this.checkShowErrorMessage();\n      });\n    });\n    this.checkShowErrorMessage();\n    this.setupNames();\n  }\n\n  setupNames() {\n    if(this.name) {\n      const inputs = this.host.nativeElement.querySelectorAll('input')\n      inputs?.forEach((input: HTMLInputElement) => {\n        this.renderer.setAttribute(input, 'name', this.name!);\n      })\n    }\n  }\n\n  checkShowErrorMessage() {\n    if(this.errorMessage) {\n      const isInvalidPresent = this.radios().find((radio) => radio.invalid);\n      this.errorMessage.show = Boolean(isInvalidPresent);\n    }\n  }\n}\n","<div class=\"ids-form-group__fieldset ids-form-group__fieldset--compact\">\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n</div>\n","import { AfterContentInit, Component, Input } from \"@angular/core\";\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-radio-button\",\n  templateUrl: \"./radio-button.component.html\",\n  standalone: true\n})\nexport class IDRadioButtonComponent extends IDFormBase implements AfterContentInit {\n\n  @Input() icon?: string;\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.input.classList.add('ids-radio-button__input');\n    this.label.classList.add('ids-radio-button__label');\n    if(this.icon) {\n      this.label.classList.add(`ids-icon-${this.icon}`);\n    }\n  }\n}\n","<div class=\"ids-radio-button\">\n  <ng-content></ng-content>\n</div>","/**\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-radio.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, inject, Renderer2, ElementRef, Input, ContentChild, ContentChildren } from '@angular/core';
+import { Component, contentChildren, contentChild, inject, Renderer2, ElementRef, Input } from '@angular/core';
 import { IDErrorMessageComponent } from '@inera/ids-angular/components/form/error-message';
 import { IDFormBase } from '@inera/ids-angular/common';
 
@@ -18,23 +18,23 @@ class IDRadioComponent extends IDFormBase {
         this.checkedEvent?.();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDRadioComponent, isStandalone: true, selector: "id-radio", usesInheritance: true, ngImport: i0, template: "<div class=\"ids-radio\">\n  <ng-content></ng-content>\n  <span class=\"ids-label-wrapper\">\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  </span>\n</div>\n\n<ng-content select=\"id-error-message\"></ng-content>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: IDRadioComponent, isStandalone: true, selector: "id-radio", usesInheritance: true, ngImport: i0, template: "<div class=\"ids-radio\">\n  <ng-content></ng-content>\n  <span class=\"ids-label-wrapper\">\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    <ng-content select=\"id-label-subtitle\"></ng-content>\n  </span>\n</div>\n\n<ng-content select=\"id-error-message\"></ng-content>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRadioComponent, decorators: [{
             type: Component,
-            args: [{ selector: "id-radio", standalone: true, template: "<div class=\"ids-radio\">\n  <ng-content></ng-content>\n  <span class=\"ids-label-wrapper\">\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  </span>\n</div>\n\n<ng-content select=\"id-error-message\"></ng-content>\n" }]
+            args: [{ selector: "id-radio", standalone: true, template: "<div class=\"ids-radio\">\n  <ng-content></ng-content>\n  <span class=\"ids-label-wrapper\">\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    <ng-content select=\"id-label-subtitle\"></ng-content>\n  </span>\n</div>\n\n<ng-content select=\"id-error-message\"></ng-content>\n" }]
         }] });
 
 class IDRadioGroupComponent {
-    radios;
-    errorMessage;
+    radios = contentChildren(IDRadioComponent);
+    errorMessage = contentChild(IDErrorMessageComponent);
     name;
     legend;
     compact = false;
     renderer = inject(Renderer2);
     host = inject(ElementRef);
     ngAfterContentInit() {
-        this.radios.forEach((radio) => {
+        this.radios().forEach((radio) => {
             radio.invalidChange.subscribe((value) => {
                 this.checkShowErrorMessage();
             });
@@ -51,24 +51,18 @@ class IDRadioGroupComponent {
         }
     }
     checkShowErrorMessage() {
-        if (this.errorMessage) {
-            const isInvalidPresent = this.radios.find((radio) => radio.invalid);
-            this.errorMessage.show = Boolean(isInvalidPresent);
+        if (this.errorMessage()) {
+            const isInvalidPresent = this.radios().find((radio) => radio.invalid);
+            this.errorMessage().show = Boolean(isInvalidPresent);
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDRadioGroupComponent, isStandalone: true, selector: "id-radio-group", inputs: { name: "name", legend: "legend", compact: "compact" }, queries: [{ propertyName: "errorMessage", first: true, predicate: IDErrorMessageComponent, descendants: true }, { propertyName: "radios", predicate: IDRadioComponent }], ngImport: i0, template: "<fieldset\n  class=\"ids-form-group__fieldset\"\n  [class.ids-form-group__fieldset--compact]=\"compact\"\n>\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</fieldset>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDRadioGroupComponent, isStandalone: true, selector: "id-radio-group", inputs: { name: "name", legend: "legend", compact: "compact" }, queries: [{ propertyName: "radios", predicate: IDRadioComponent, isSignal: true }, { propertyName: "errorMessage", first: true, predicate: IDErrorMessageComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<fieldset\n  class=\"ids-form-group__fieldset\"\n  [class.ids-form-group__fieldset--compact]=\"compact\"\n>\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</fieldset>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRadioGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'id-radio-group', standalone: true, template: "<fieldset\n  class=\"ids-form-group__fieldset\"\n  [class.ids-form-group__fieldset--compact]=\"compact\"\n>\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</fieldset>\n" }]
-        }], propDecorators: { radios: [{
-                type: ContentChildren,
-                args: [IDRadioComponent]
-            }], errorMessage: [{
-                type: ContentChild,
-                args: [IDErrorMessageComponent]
-            }], name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], legend: [{
                 type: Input

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

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-radio.mjs","sources":["../../../projects/ids-angular/components/form/radio/radio.component.ts","../../../projects/ids-angular/components/form/radio/radio.component.html","../../../projects/ids-angular/components/form/radio/radio-group.component.ts","../../../projects/ids-angular/components/form/radio/radio-group.component.html","../../../projects/ids-angular/components/form/radio/inera-ids-angular-components-form-radio.ts"],"sourcesContent":["import { Component } from \"@angular/core\";\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-radio\",\n  templateUrl: \"./radio.component.html\",\n  standalone: true\n})\nexport class IDRadioComponent extends IDFormBase {\n\n  private checkedEvent?: () => void;\n  \n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    if(!this.ngControl) {\n      this.checkedEvent = this.renderer.listen(this.input, 'changed', () => {\n        super._updateErrorState();\n      });\n    }\n    this.renderer.addClass(this.label, 'ids-label--clickable');\n  }\n\n  ngOnDestroy() {\n    this.checkedEvent?.();\n  }\n\n\n}\n","<div class=\"ids-radio\">\n  <ng-content></ng-content>\n  <span class=\"ids-label-wrapper\">\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  </span>\n</div>\n\n<ng-content select=\"id-error-message\"></ng-content>\n","import { AfterContentInit, Component, ContentChild, ContentChildren, ElementRef, inject, Input, QueryList, Renderer2 } from '@angular/core';\nimport { IDErrorMessageComponent } from \"@inera/ids-angular/components/form/error-message\";\nimport { IDRadioComponent } from './radio.component';\n\n@Component({\n  selector: 'id-radio-group',\n  templateUrl: './radio-group.component.html',\n  standalone: true\n})\nexport class IDRadioGroupComponent implements AfterContentInit {\n\n  @ContentChildren(IDRadioComponent)\n  radios: QueryList<IDRadioComponent>;\n  \n  @ContentChild(IDErrorMessageComponent)\n  errorMessage: IDErrorMessageComponent;\n\n  @Input() name?: string;\n  @Input() legend?: string;\n  @Input() compact: boolean = false;\n\n  renderer = inject(Renderer2)\n  host = inject(ElementRef)\n\n  ngAfterContentInit(): void {\n    this.radios.forEach((radio) => {\n      radio.invalidChange.subscribe((value: boolean) => {\n        this.checkShowErrorMessage();\n      });\n    });\n    this.checkShowErrorMessage();\n    this.setupNames();\n  }\n\n  setupNames() {\n    if(this.name) {\n      const inputs = this.host.nativeElement.querySelectorAll('input')\n      inputs?.forEach((input: HTMLInputElement) => {\n        this.renderer.setAttribute(input, 'name', this.name!);\n      })\n    }\n  }\n\n  checkShowErrorMessage() {\n    if (this.errorMessage) {\n      const isInvalidPresent = this.radios.find((radio) => radio.invalid);\n      this.errorMessage.show = Boolean(isInvalidPresent);\n    }\n  }\n}\n","<fieldset\n  class=\"ids-form-group__fieldset\"\n  [class.ids-form-group__fieldset--compact]=\"compact\"\n>\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</fieldset>\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-radio.mjs","sources":["../../../projects/ids-angular/components/form/radio/radio.component.ts","../../../projects/ids-angular/components/form/radio/radio.component.html","../../../projects/ids-angular/components/form/radio/radio-group.component.ts","../../../projects/ids-angular/components/form/radio/radio-group.component.html","../../../projects/ids-angular/components/form/radio/inera-ids-angular-components-form-radio.ts"],"sourcesContent":["import { Component } from \"@angular/core\";\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: \"id-radio\",\n  templateUrl: \"./radio.component.html\",\n  standalone: true\n})\nexport class IDRadioComponent extends IDFormBase {\n\n  private checkedEvent?: () => void;\n  \n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    if(!this.ngControl) {\n      this.checkedEvent = this.renderer.listen(this.input, 'changed', () => {\n        super._updateErrorState();\n      });\n    }\n    this.renderer.addClass(this.label, 'ids-label--clickable');\n  }\n\n  ngOnDestroy() {\n    this.checkedEvent?.();\n  }\n\n\n}\n","<div class=\"ids-radio\">\n  <ng-content></ng-content>\n  <span class=\"ids-label-wrapper\">\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    <ng-content select=\"id-label-subtitle\"></ng-content>\n  </span>\n</div>\n\n<ng-content select=\"id-error-message\"></ng-content>\n","import { AfterContentInit, Component, ElementRef, inject, Input, Renderer2, contentChild, contentChildren } from '@angular/core';\nimport { IDErrorMessageComponent } from \"@inera/ids-angular/components/form/error-message\";\nimport { IDRadioComponent } from './radio.component';\n\n@Component({\n  selector: 'id-radio-group',\n  templateUrl: './radio-group.component.html',\n  standalone: true\n})\nexport class IDRadioGroupComponent implements AfterContentInit {\n\n    radios = contentChildren(IDRadioComponent);\n  \n    errorMessage = contentChild(IDErrorMessageComponent);\n\n  @Input() name?: string;\n  @Input() legend?: string;\n  @Input() compact: boolean = false;\n\n  renderer = inject(Renderer2)\n  host = inject(ElementRef)\n\n  ngAfterContentInit(): void {\n    this.radios().forEach((radio) => {\n      radio.invalidChange.subscribe((value: boolean) => {\n        this.checkShowErrorMessage();\n      });\n    });\n    this.checkShowErrorMessage();\n    this.setupNames();\n  }\n\n  setupNames() {\n    if(this.name) {\n      const inputs = this.host.nativeElement.querySelectorAll('input')\n      inputs?.forEach((input: HTMLInputElement) => {\n        this.renderer.setAttribute(input, 'name', this.name!);\n      })\n    }\n  }\n\n  checkShowErrorMessage() {\n    if (this.errorMessage()) {\n      const isInvalidPresent = this.radios().find((radio) => radio.invalid);\n      this.errorMessage()!.show = Boolean(isInvalidPresent);\n    }\n  }\n}\n","<fieldset\n  class=\"ids-form-group__fieldset\"\n  [class.ids-form-group__fieldset--compact]=\"compact\"\n>\n  @if (legend) {\n    <div class=\"ids-label-wrapper\">\n      <legend>\n        {{ legend }}\n        <span class=\"ids-legend__tooltip\">\n          <ng-content select=\"id-tooltip\"></ng-content>\n          <ng-content select=\"id-popover\"></ng-content>\n        </span>\n      </legend>\n    </div>\n  }\n  <ng-content></ng-content>\n  <ng-content select=\"id-error-message\"></ng-content>\n</fieldset>\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-range.mjs

@@ -60,13 +60,13 @@ class IDRangeComponent extends IDFormBase {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDRangeComponent, isStandalone: true, selector: "id-range", inputs: { showTicks: ["showTicks", "showTicks", booleanAttribute], interval: "interval" }, host: { classAttribute: "ids-range" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ids-range\">\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></ng-content>\n  @if (this.showTicks) {\n    <div\n      class=\"ids-range-ticks\"\n      [class.ids-range-ticks--disabled]=\"input.disabled\"\n    >\n      @for (tick of ticks; track tick) {\n        <span class=\"ids-range-tick\">{{ tick }}</span>\n      }\n    </div>\n  }\n</div>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: IDRangeComponent, isStandalone: true, selector: "id-range", inputs: { showTicks: ["showTicks", "showTicks", booleanAttribute], interval: "interval" }, host: { classAttribute: "ids-range" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ids-range\">\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  <ng-content></ng-content>\n  @if (this.showTicks) {\n    <div\n      class=\"ids-range-ticks\"\n      [class.ids-range-ticks--disabled]=\"input.disabled\"\n    >\n      @for (tick of ticks; track tick) {\n        <span class=\"ids-range-tick\">{{ tick }}</span>\n      }\n    </div>\n  }\n</div>\n" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDRangeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'id-range', standalone: true, host: {
                         class: 'ids-range',
-                    }, template: "<div class=\"ids-range\">\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></ng-content>\n  @if (this.showTicks) {\n    <div\n      class=\"ids-range-ticks\"\n      [class.ids-range-ticks--disabled]=\"input.disabled\"\n    >\n      @for (tick of ticks; track tick) {\n        <span class=\"ids-range-tick\">{{ tick }}</span>\n      }\n    </div>\n  }\n</div>\n" }]
+                    }, template: "<div class=\"ids-range\">\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  <ng-content></ng-content>\n  @if (this.showTicks) {\n    <div\n      class=\"ids-range-ticks\"\n      [class.ids-range-ticks--disabled]=\"input.disabled\"\n    >\n      @for (tick of ticks; track tick) {\n        <span class=\"ids-range-tick\">{{ tick }}</span>\n      }\n    </div>\n  }\n</div>\n" }]
         }], propDecorators: { showTicks: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]

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

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-form-range.mjs","sources":["../../../projects/ids-angular/components/form/range/range.component.ts","../../../projects/ids-angular/components/form/range/range.component.html","../../../projects/ids-angular/components/form/range/inera-ids-angular-components-form-range.ts"],"sourcesContent":["import { AfterContentInit, Component, Input, booleanAttribute } from '@angular/core';\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: 'id-range',\n  templateUrl: './range.component.html',\n  standalone: true,\n  host: {\n    class: 'ids-range',\n  }\n})\nexport class IDRangeComponent extends IDFormBase implements AfterContentInit {\n\n  @Input({ transform: booleanAttribute }) showTicks: boolean = false;\n  @Input() interval: number = 0;\n\n  get min() {\n    return Number(this.input.min);\n  }\n\n  get max() {\n    return Number(this.input.max);\n  }\n\n  get step() {\n    return Number(this.input.step);\n  }\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.input.addEventListener('input', this.handleInputChange);\n    this.handleInputChange();\n    this.listenToInputAttrChanges();\n  }\n\n  listenToInputAttrChanges() {\n    const observer = new MutationObserver(() => {\n      this.setupValues();\n      this.handleInputChange();\n    });\n    observer.observe(this.input, {\n      attributes: true,\n      attributeFilter: [\"min\", \"max\", \"disabled\"]\n    });\n  }\n\n  get ticks() {\n    const ticks = []\n    if (this.step > 0) {\n      if (this.interval > 0) {\n        for (let val = this.min; val <= this.max; val += this.interval) {\n          ticks.push(val);\n        }\n      } else {\n        for (let val = this.min; val <= this.max; val += this.step) {\n          ticks.push(val);\n        }\n      }\n    }\n    return ticks;\n  }\n\n   handleInputChange = () => {\n    if (this.input) {\n      const val = +this.input.value;\n      this.input.style.backgroundSize = ((val - this.min) * 100) / (this.max - this.min) + \"% 100%\";\n      this.input.setAttribute(\"aria-valuenow\", this.input.value);\n    }\n  };\n\n  setupValues():void {\n    if (this.input) {\n      this.input.setAttribute(\"aria-valuemin\", \"\" + this.min);\n      this.input.setAttribute(\"aria-valuemax\", \"\" + this.max);\n    }\n  }\n    \n\n}\n","<div class=\"ids-range\">\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></ng-content>\n  @if (this.showTicks) {\n    <div\n      class=\"ids-range-ticks\"\n      [class.ids-range-ticks--disabled]=\"input.disabled\"\n    >\n      @for (tick of ticks; track tick) {\n        <span class=\"ids-range-tick\">{{ tick }}</span>\n      }\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-form-range.mjs","sources":["../../../projects/ids-angular/components/form/range/range.component.ts","../../../projects/ids-angular/components/form/range/range.component.html","../../../projects/ids-angular/components/form/range/inera-ids-angular-components-form-range.ts"],"sourcesContent":["import { AfterContentInit, Component, Input, booleanAttribute } from '@angular/core';\nimport { IDFormBase } from \"@inera/ids-angular/common\";\n\n@Component({\n  selector: 'id-range',\n  templateUrl: './range.component.html',\n  standalone: true,\n  host: {\n    class: 'ids-range',\n  }\n})\nexport class IDRangeComponent extends IDFormBase implements AfterContentInit {\n\n  @Input({ transform: booleanAttribute }) showTicks: boolean = false;\n  @Input() interval: number = 0;\n\n  get min() {\n    return Number(this.input.min);\n  }\n\n  get max() {\n    return Number(this.input.max);\n  }\n\n  get step() {\n    return Number(this.input.step);\n  }\n\n  ngAfterContentInit(): void {\n    super.ngAfterContentInit();\n    this.input.addEventListener('input', this.handleInputChange);\n    this.handleInputChange();\n    this.listenToInputAttrChanges();\n  }\n\n  listenToInputAttrChanges() {\n    const observer = new MutationObserver(() => {\n      this.setupValues();\n      this.handleInputChange();\n    });\n    observer.observe(this.input, {\n      attributes: true,\n      attributeFilter: [\"min\", \"max\", \"disabled\"]\n    });\n  }\n\n  get ticks() {\n    const ticks = []\n    if (this.step > 0) {\n      if (this.interval > 0) {\n        for (let val = this.min; val <= this.max; val += this.interval) {\n          ticks.push(val);\n        }\n      } else {\n        for (let val = this.min; val <= this.max; val += this.step) {\n          ticks.push(val);\n        }\n      }\n    }\n    return ticks;\n  }\n\n   handleInputChange = () => {\n    if (this.input) {\n      const val = +this.input.value;\n      this.input.style.backgroundSize = ((val - this.min) * 100) / (this.max - this.min) + \"% 100%\";\n      this.input.setAttribute(\"aria-valuenow\", this.input.value);\n    }\n  };\n\n  setupValues():void {\n    if (this.input) {\n      this.input.setAttribute(\"aria-valuemin\", \"\" + this.min);\n      this.input.setAttribute(\"aria-valuemax\", \"\" + this.max);\n    }\n  }\n    \n\n}\n","<div class=\"ids-range\">\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  <ng-content></ng-content>\n  @if (this.showTicks) {\n    <div\n      class=\"ids-range-ticks\"\n      [class.ids-range-ticks--disabled]=\"input.disabled\"\n    >\n      @for (tick of ticks; track tick) {\n        <span class=\"ids-range-tick\">{{ tick }}</span>\n      }\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAWM,MAAO,gBAAiB,SAAQ,UAAU,CAAA;IAEN,SAAS,GAAY,KAAK;IACzD,QAAQ,GAAW,CAAC;AAE7B,IAAA,IAAI,GAAG,GAAA;QACL,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;IAC/B;AAEA,IAAA,IAAI,GAAG,GAAA;QACL,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;IAC/B;AAEA,IAAA,IAAI,IAAI,GAAA;QACN,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;IAChC;IAEA,kBAAkB,GAAA;QAChB,KAAK,CAAC,kBAAkB,EAAE;QAC1B,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC;QAC5D,IAAI,CAAC,iBAAiB,EAAE;QACxB,IAAI,CAAC,wBAAwB,EAAE;IACjC;IAEA,wBAAwB,GAAA;AACtB,QAAA,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,MAAK;YACzC,IAAI,CAAC,WAAW,EAAE;YAClB,IAAI,CAAC,iBAAiB,EAAE;AAC1B,QAAA,CAAC,CAAC;AACF,QAAA,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,EAAE;AAC3B,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,UAAU;AAC3C,SAAA,CAAC;IACJ;AAEA,IAAA,IAAI,KAAK,GAAA;QACP,MAAM,KAAK,GAAG,EAAE;AAChB,QAAA,IAAI,IAAI,CAAC,IAAI,GAAG,CAAC,EAAE;AACjB,YAAA,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;AACrB,gBAAA,KAAK,IAAI,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,QAAQ,EAAE;AAC9D,oBAAA,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;gBACjB;YACF;iBAAO;AACL,gBAAA,KAAK,IAAI,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE;AAC1D,oBAAA,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;gBACjB;YACF;QACF;AACA,QAAA,OAAO,KAAK;IACd;IAEC,iBAAiB,GAAG,MAAK;AACxB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,MAAM,GAAG,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK;AAC7B,YAAA,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,cAAc,GAAG,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,IAAI,GAAG,KAAK,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,QAAQ;AAC7F,YAAA,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;QAC5D;AACF,IAAA,CAAC;IAED,WAAW,GAAA;AACT,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC;AACvD,YAAA,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC;QACzD;IACF;wGAhEW,gBAAgB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAEP,gBAAgB,CAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,WAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECbtC,sqBAqBA,EAAA,CAAA;;4FDVa,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;+BACE,UAAU,EAAA,UAAA,EAER,IAAI,EAAA,IAAA,EACV;AACJ,wBAAA,KAAK,EAAE,WAAW;AACnB,qBAAA,EAAA,QAAA,EAAA,sqBAAA,EAAA;8BAIuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAC7B,QAAQ,EAAA,CAAA;sBAAhB;;;AEdH;;AAEG;;;;"}

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, EventEmitter, booleanAttribute, ContentChildren, Output, Input, HostListener, Component } from '@angular/core';
+import { inject, ElementRef, EventEmitter, contentChildren, booleanAttribute, Output, Input, HostListener, Component } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { IDFormBase, IDClickOutsideDirective } from '@inera/ids-angular/common';
 import { IDCheckboxComponent } from '@inera/ids-angular/components/form/checkbox';
@@ -30,9 +30,9 @@ class IDSelectMultipleComponent extends IDFormBase {
     isDropdownVisible = false;
     selectedValues = 0;
     get checkboxes() {
-        return this.host.nativeElement.querySelectorAll('input');
+        return Array.from(this.host.nativeElement.querySelectorAll('input'));
     }
-    checkboxComponents;
+    checkboxComponents = contentChildren(IDCheckboxComponent, { descendants: true });
     get displayValue() {
         if (this.selectedValues === 0)
             return this.placeholder || '';
@@ -61,7 +61,7 @@ class IDSelectMultipleComponent extends IDFormBase {
         this.checkboxes.forEach((checkbox) => {
             checkbox.addEventListener('change', this.setDisplayValues);
         });
-        this.checkboxComponents.forEach((checkbox) => {
+        this.checkboxComponents().forEach((checkbox) => {
             checkbox.invalidChange
                 .pipe(takeUntilDestroyed(this.destroyRef))
                 .subscribe((value) => {
@@ -72,19 +72,19 @@ class IDSelectMultipleComponent extends IDFormBase {
     }
     checkShowErrorMessage() {
         if (this.errorMessage) {
-            const isInvalidPresent = this.checkboxComponents.find((checkbox) => checkbox.invalid);
+            const isInvalidPresent = this.checkboxComponents().find((checkbox) => checkbox.invalid);
             this.invalid = Boolean(isInvalidPresent);
         }
     }
     setDisplayValues = () => {
-        this.selectedValues = Array.from(this.checkboxes).filter((checkbox) => checkbox.checked).length;
+        this.selectedValues = this.checkboxes.filter((checkbox) => checkbox.checked).length;
     };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDSelectMultipleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.20", type: IDSelectMultipleComponent, isStandalone: true, selector: "id-select-multiple", inputs: { placeholder: "placeholder", maxheight: "maxheight", labelText: "labelText", selectedLabel: "selectedLabel", multiSelectedLabel: "multiSelectedLabel", maxHeight: "maxHeight", disabled: ["disabled", "disabled", booleanAttribute], ariaDisabled: ["ariaDisabled", "ariaDisabled", booleanAttribute] }, outputs: { opened: "opened", closed: "closed" }, host: { listeners: { "document:keydown.escape": "onEsc($event)" } }, queries: [{ propertyName: "checkboxComponents", predicate: IDCheckboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<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", dependencies: [{ kind: "directive", type: IDClickOutsideDirective, selector: "[idClickOutside]", outputs: ["idClickOutside"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.20", type: IDSelectMultipleComponent, isStandalone: true, selector: "id-select-multiple", inputs: { placeholder: "placeholder", maxheight: "maxheight", labelText: "labelText", selectedLabel: "selectedLabel", multiSelectedLabel: "multiSelectedLabel", maxHeight: "maxHeight", disabled: ["disabled", "disabled", booleanAttribute], ariaDisabled: ["ariaDisabled", "ariaDisabled", booleanAttribute] }, outputs: { opened: "opened", closed: "closed" }, host: { listeners: { "document:keydown.escape": "onEsc($event)" } }, queries: [{ propertyName: "checkboxComponents", predicate: IDCheckboxComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<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", dependencies: [{ kind: "directive", type: IDClickOutsideDirective, selector: "[idClickOutside]", outputs: ["idClickOutside"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: IDSelectMultipleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'id-select-multiple', imports: [IDClickOutsideDirective], standalone: true, template: "<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" }]
+            args: [{ selector: 'id-select-multiple', imports: [IDClickOutsideDirective], standalone: true, template: "<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" }]
         }], propDecorators: { onEsc: [{
                 type: HostListener,
                 args: ['document:keydown.escape', ['$event']]
@@ -110,9 +110,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Output
             }], closed: [{
                 type: Output
-            }], checkboxComponents: [{
-                type: ContentChildren,
-                args: [IDCheckboxComponent, { descendants: true }]
             }] } });
 
 /**