@abgov/angular-components 5.0.0-dev.2 → 5.0.0-dev.3

package/fesm2022/abgov-angular-components.mjs

@@ -1,12 +1,24 @@
 import * as i0 from '@angular/core';
-import { forwardRef, HostListener, Directive, CUSTOM_ELEMENTS_SCHEMA, NgModule, Input, Component, ElementRef, booleanAttribute, ViewChild, EventEmitter, Output, numberAttribute, TemplateRef, HostBinding } from '@angular/core';
+import { inject, ElementRef, forwardRef, HostListener, Directive, Renderer2, CUSTOM_ELEMENTS_SCHEMA, NgModule, Input, Component, booleanAttribute, ViewChild, ChangeDetectorRef, EventEmitter, Output, numberAttribute, TemplateRef, HostBinding } from '@angular/core';
 import { NG_VALUE_ACCESSOR, CheckboxControlValueAccessor } from '@angular/forms';
 import { NgTemplateOutlet } from '@angular/common';
-import { CalendarDate, Once } from '@abgov/ui-components-common';
+import { Once, CalendarDate } from '@abgov/ui-components-common';
 export * from '@abgov/ui-components-common';
 
 // @deprecated: Use the new <goab-input .. /> component
 class ValueDirective {
+    constructor() {
+        this.elementRef = inject(ElementRef);
+        this._value = "";
+        this._disabled = false;
+        /* eslint-disable @typescript-eslint/no-explicit-any */
+        this.onChange = () => {
+            /* default implementation */
+        };
+        this.onTouched = () => {
+            /* default implementation */
+        };
+    }
     get value() {
         return this._value;
     }
@@ -29,18 +41,6 @@ class ValueDirective {
         this._disabled = isDisabled;
         this.elementRef.nativeElement.disabled = isDisabled;
     }
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-        this._value = "";
-        this._disabled = false;
-        /* eslint-disable @typescript-eslint/no-explicit-any */
-        this.onChange = () => {
-            /* default implementation */
-        };
-        this.onTouched = () => {
-            /* default implementation */
-        };
-    }
     listenForValueChange(event) {
         const value = event.detail.value;
         this.value = value;
@@ -49,8 +49,8 @@ class ValueDirective {
         const isDisabled = event.detail.disabled;
         this.setDisabledState(isDisabled);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ValueDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: ValueDirective, isStandalone: true, selector: "[goaValue]", host: { listeners: { "_change": "listenForValueChange($event)", "disabledChange": "listenForDisabledChange($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ValueDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: ValueDirective, isStandalone: true, selector: "[goaValue]", host: { listeners: { "_change": "listenForValueChange($event)", "disabledChange": "listenForDisabledChange($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ValueDirective),
@@ -58,7 +58,7 @@ class ValueDirective {
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ValueDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ValueDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -71,7 +71,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { listenForValueChange: [{
+        }], propDecorators: { listenForValueChange: [{
                 type: HostListener,
                 args: ["_change", ["$event"]]
             }], listenForDisabledChange: [{
@@ -79,6 +79,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: ["disabledChange", ["$event"]]
             }] } });
 class ValueListDirective {
+    constructor() {
+        this.elementRef = inject(ElementRef);
+        this._value = [];
+        this.onChange = () => { };
+        this.onTouched = () => { };
+    }
     get value() {
         return this._value;
     }
@@ -99,12 +105,6 @@ class ValueListDirective {
     registerOnTouched(fn) {
         this.onTouched = fn;
     }
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-        this._value = [];
-        this.onChange = () => { };
-        this.onTouched = () => { };
-    }
     listenForValueChange(event) {
         const value = event.detail.value;
         if (!value) {
@@ -125,8 +125,8 @@ class ValueListDirective {
         this.onChange(value);
         this.onTouched();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ValueListDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: ValueListDirective, isStandalone: true, selector: "[goaValueList]", host: { listeners: { "_change": "listenForValueChange($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ValueListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: ValueListDirective, isStandalone: true, selector: "[goaValueList]", host: { listeners: { "_change": "listenForValueChange($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ValueListDirective),
@@ -134,7 +134,7 @@ class ValueListDirective {
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ValueListDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ValueListDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -147,17 +147,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { listenForValueChange: [{
+        }], propDecorators: { listenForValueChange: [{
                 type: HostListener,
                 args: ["_change", ["$event"]]
             }] } });
 
 // @deprecated: Use the new <goab-checkbox .. /> component
 class CheckedDirective extends CheckboxControlValueAccessor {
-    constructor(renderer, elementRef) {
+    constructor() {
+        const renderer = inject(Renderer2);
+        const elementRef = inject(ElementRef);
         super(renderer, elementRef);
-        this.renderer = renderer;
-        this.elementRef = elementRef;
         this._checked = false;
         /* eslint-disable @typescript-eslint/no-explicit-any */
         this.onChange = () => {
@@ -166,6 +166,8 @@ class CheckedDirective extends CheckboxControlValueAccessor {
         this.onTouched = () => {
             /** No implementation **/
         };
+        this.renderer = renderer;
+        this.elementRef = elementRef;
     }
     get value() {
         return this._checked ? "checked" : "";
@@ -189,8 +191,8 @@ class CheckedDirective extends CheckboxControlValueAccessor {
         const checked = event.detail.checked;
         this.value = checked;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CheckedDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: CheckedDirective, isStandalone: true, selector: "[goaChecked]", host: { listeners: { "_change": "listenForValueChange($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: CheckedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: CheckedDirective, isStandalone: true, selector: "[goaChecked]", host: { listeners: { "_change": "listenForValueChange($event)" } }, providers: [
             {
                 useExisting: forwardRef(() => CheckedDirective),
                 provide: NG_VALUE_ACCESSOR,
@@ -198,7 +200,7 @@ class CheckedDirective extends CheckboxControlValueAccessor {
             },
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CheckedDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: CheckedDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -211,17 +213,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { listenForValueChange: [{
+        }], ctorParameters: () => [], propDecorators: { listenForValueChange: [{
                 type: HostListener,
                 args: ["_change", ["$event"]]
             }] } });
 
 class AngularComponentsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.4", ngImport: i0, type: AngularComponentsModule, imports: [ValueDirective, ValueListDirective, CheckedDirective], exports: [ValueDirective, ValueListDirective, CheckedDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: AngularComponentsModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.6", ngImport: i0, type: AngularComponentsModule, imports: [ValueDirective, ValueListDirective, CheckedDirective], exports: [ValueDirective, ValueListDirective, CheckedDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AngularComponentsModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: AngularComponentsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AngularComponentsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [ValueDirective, ValueListDirective, CheckedDirective],
@@ -231,10 +233,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
         }] });
 
 class GoabBaseComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabBaseComponent, isStandalone: true, selector: "ng-component", inputs: { mt: "mt", mb: "mb", ml: "ml", mr: "mr", testId: "testId" }, ngImport: i0, template: ``, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabBaseComponent, isStandalone: true, selector: "ng-component", inputs: { mt: "mt", mb: "mb", ml: "ml", mr: "mr", testId: "testId" }, ngImport: i0, template: ``, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabBaseComponent, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -299,6 +301,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
  * - `fcTouched?`: A function to handle touch events on the form control.
  */
 class GoabControlValueAccessor extends GoabBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.touched = false;
+        this.renderer = inject(Renderer2);
+    }
     /**
      * Marks the component as touched. If the component is not already marked as touched,
      * it triggers the `fcTouched` callback (if defined) and sets the `touched` property to `true`.
@@ -309,11 +316,6 @@ class GoabControlValueAccessor extends GoabBaseComponent {
             this.touched = true;
         }
     }
-    constructor(renderer) {
-        super();
-        this.renderer = renderer;
-        this.touched = false;
-    }
     /**
      * Convert an arbitrary value into a string for DOM attribute assignment.
      * Child classes can override when they need special formatting.
@@ -360,16 +362,16 @@ class GoabControlValueAccessor extends GoabBaseComponent {
     setDisabledState(isDisabled) {
         this.disabled = isDisabled;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabControlValueAccessor, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.4", type: GoabControlValueAccessor, isStandalone: true, selector: "ng-component", inputs: { id: "id", disabled: ["disabled", "disabled", booleanAttribute], error: ["error", "error", booleanAttribute], value: "value" }, viewQueries: [{ propertyName: "goaComponentRef", first: true, predicate: ["goaComponentRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: ``, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabControlValueAccessor, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.6", type: GoabControlValueAccessor, isStandalone: true, selector: "ng-component", inputs: { id: "id", disabled: ["disabled", "disabled", booleanAttribute], error: ["error", "error", booleanAttribute], value: "value" }, viewQueries: [{ propertyName: "goaComponentRef", first: true, predicate: ["goaComponentRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: ``, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabControlValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabControlValueAccessor, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
                     template: ``, //** IMPLEMENT IN SUBCLASS
                 }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { id: [{
+        }], propDecorators: { id: [{
                 type: Input
             }], disabled: [{
                 type: Input,
@@ -385,9 +387,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabAccordion extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.onChange = new EventEmitter();
         this.isReady = false;
     }
@@ -403,8 +405,8 @@ class GoabAccordion extends GoabBaseComponent {
         const detail = e.detail;
         this.onChange.emit(detail.open);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAccordion, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabAccordion, isStandalone: true, selector: "goab-accordion", inputs: { heading: "heading", secondaryText: "secondaryText", open: ["open", "open", booleanAttribute], headingSize: "headingSize", headingContent: "headingContent", maxWidth: "maxWidth", iconPosition: "iconPosition" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAccordion, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabAccordion, isStandalone: true, selector: "goab-accordion", inputs: { heading: "heading", secondaryText: "secondaryText", open: ["open", "open", booleanAttribute], headingSize: "headingSize", headingContent: "headingContent", maxWidth: "maxWidth", iconPosition: "iconPosition" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-accordion
         [attr.heading]="heading"
@@ -428,7 +430,7 @@ class GoabAccordion extends GoabBaseComponent {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAccordion, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAccordion, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -459,7 +461,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input
             }], secondaryText: [{
                 type: Input
@@ -479,9 +481,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabBadge extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.size = "medium";
         this.emphasis = "strong";
         this.isReady = false;
@@ -495,8 +497,8 @@ class GoabBadge extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabBadge, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabBadge, isStandalone: true, selector: "goab-badge", inputs: { type: "type", content: "content", icon: ["icon", "icon", booleanAttribute], iconType: "iconType", size: "size", emphasis: "emphasis", ariaLabel: "ariaLabel" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabBadge, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabBadge, isStandalone: true, selector: "goab-badge", inputs: { type: "type", content: "content", icon: ["icon", "icon", booleanAttribute], iconType: "iconType", size: "size", emphasis: "emphasis", ariaLabel: "ariaLabel" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-badge
         [attr.version]="version"
@@ -517,7 +519,7 @@ class GoabBadge extends GoabBaseComponent {
     }
   `, isInline: true, styles: [":host{display:contents}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabBadge, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabBadge, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "goab-badge", template: `
     @if (isReady) {
@@ -539,7 +541,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
       </goa-badge>
     }
   `, schemas: [CUSTOM_ELEMENTS_SCHEMA], styles: [":host{display:contents}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], content: [{
                 type: Input
@@ -557,9 +559,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabBlock extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -570,8 +572,8 @@ class GoabBlock extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabBlock, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabBlock, isStandalone: true, selector: "goab-block", inputs: { gap: "gap", direction: "direction", alignment: "alignment", width: "width", minWidth: "minWidth", maxWidth: "maxWidth" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabBlock, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabBlock, isStandalone: true, selector: "goab-block", inputs: { gap: "gap", direction: "direction", alignment: "alignment", width: "width", minWidth: "minWidth", maxWidth: "maxWidth" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-block
         [attr.gap]="gap"
@@ -591,7 +593,7 @@ class GoabBlock extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabBlock, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabBlock, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -617,7 +619,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { gap: [{
+        }], propDecorators: { gap: [{
                 type: Input
             }], direction: [{
                 type: Input
@@ -632,9 +634,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabButton extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.type = "primary";
         this.onClick = new EventEmitter();
         this.isReady = false;
@@ -652,8 +654,8 @@ class GoabButton extends GoabBaseComponent {
     _onClick() {
         this.onClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabButton, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabButton, isStandalone: true, selector: "goab-button", inputs: { type: "type", size: "size", variant: "variant", disabled: ["disabled", "disabled", booleanAttribute], leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", width: "width", action: "action", actionArg: "actionArg", actionArgs: "actionArgs" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabButton, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabButton, isStandalone: true, selector: "goab-button", inputs: { type: "type", size: "size", variant: "variant", disabled: ["disabled", "disabled", booleanAttribute], leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", width: "width", action: "action", actionArg: "actionArg", actionArgs: "actionArgs" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-button
         [attr.version]="version"
@@ -679,7 +681,7 @@ class GoabButton extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabButton, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -711,7 +713,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], size: [{
                 type: Input
@@ -737,9 +739,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabButtonGroup extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -750,8 +752,8 @@ class GoabButtonGroup extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabButtonGroup, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabButtonGroup, isStandalone: true, selector: "goab-button-group", inputs: { alignment: "alignment", gap: "gap" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabButtonGroup, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabButtonGroup, isStandalone: true, selector: "goab-button-group", inputs: { alignment: "alignment", gap: "gap" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-button-group
         [attr.alignment]="alignment"
@@ -767,7 +769,7 @@ class GoabButtonGroup extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabButtonGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabButtonGroup, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -789,13 +791,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { alignment: [{
+        }], propDecorators: { alignment: [{
                 type: Input
             }], gap: [{
                 type: Input
             }] } });
 
 class GoabCalendar extends GoabBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        this.version = "2";
+        this.onChange = new EventEmitter();
+        this.isReady = false;
+        this.once = new Once();
+    }
     formatValue(param, val) {
         if (!val)
             return "";
@@ -813,14 +823,6 @@ class GoabCalendar extends GoabBaseComponent {
     maxString() {
         return this.formatValue("max", this.max);
     }
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
-        this.version = "2";
-        this.onChange = new EventEmitter();
-        this.isReady = false;
-        this.once = new Once();
-    }
     ngOnInit() {
         // For Angular 20, we need to delay rendering the web component
         // to ensure all attributes are properly bound before the component initializes
@@ -833,8 +835,8 @@ class GoabCalendar extends GoabBaseComponent {
         const details = e.detail;
         this.onChange.emit(details);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCalendar, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCalendar, isStandalone: true, selector: "goab-calendar", inputs: { name: "name", value: "value", min: "min", max: "max" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCalendar, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCalendar, isStandalone: true, selector: "goab-calendar", inputs: { name: "name", value: "value", min: "min", max: "max" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-calendar
         [attr.name]="name"
@@ -854,7 +856,7 @@ class GoabCalendar extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCalendar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCalendar, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -880,7 +882,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], value: [{
                 type: Input
@@ -893,9 +895,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabCallout extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.type = "information";
@@ -913,8 +915,8 @@ class GoabCallout extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCallout, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCallout, isStandalone: true, selector: "goab-callout", inputs: { type: "type", heading: "heading", size: "size", maxWidth: "maxWidth", ariaLive: "ariaLive", iconTheme: "iconTheme", emphasis: "emphasis" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCallout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCallout, isStandalone: true, selector: "goab-callout", inputs: { type: "type", heading: "heading", size: "size", maxWidth: "maxWidth", ariaLive: "ariaLive", iconTheme: "iconTheme", emphasis: "emphasis" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-callout
         [attr.version]="version"
@@ -936,7 +938,7 @@ class GoabCallout extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCallout, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCallout, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -964,7 +966,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], heading: [{
                 type: Input
@@ -981,9 +983,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabCard extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -994,8 +996,8 @@ class GoabCard extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCard, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCard, isStandalone: true, selector: "goab-card", inputs: { elevation: ["elevation", "elevation", numberAttribute], width: "width" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCard, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCard, isStandalone: true, selector: "goab-card", inputs: { elevation: ["elevation", "elevation", numberAttribute], width: "width" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-card
         [attr.elevation]="elevation"
@@ -1011,7 +1013,7 @@ class GoabCard extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCard, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1033,7 +1035,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { elevation: [{
+        }], propDecorators: { elevation: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]
             }], width: [{
@@ -1041,8 +1043,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabCardContent {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1053,8 +1055,8 @@ class GoabCardContent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCardContent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCardContent, isStandalone: true, selector: "goab-card-content", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCardContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCardContent, isStandalone: true, selector: "goab-card-content", ngImport: i0, template: `
     @if (isReady) {
       <goa-card-content>
         <ng-content />
@@ -1062,7 +1064,7 @@ class GoabCardContent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCardContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCardContent, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1076,11 +1078,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
 class GoabCardActions {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1091,8 +1093,8 @@ class GoabCardActions {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCardActions, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCardActions, isStandalone: true, selector: "goab-card-actions", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCardActions, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCardActions, isStandalone: true, selector: "goab-card-actions", ngImport: i0, template: `
     @if (isReady) {
       <goa-card-actions>
         <ng-content />
@@ -1100,7 +1102,7 @@ class GoabCardActions {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCardActions, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCardActions, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1114,11 +1116,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
 class GoabCardImage {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1129,8 +1131,8 @@ class GoabCardImage {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCardImage, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCardImage, isStandalone: true, selector: "goab-card-image", inputs: { src: "src", height: "height" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCardImage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCardImage, isStandalone: true, selector: "goab-card-image", inputs: { src: "src", height: "height" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-card-image [attr.src]="src" [attr.height]="height">
         <ng-content />
@@ -1138,7 +1140,7 @@ class GoabCardImage {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCardImage, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCardImage, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1152,7 +1154,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { src: [{
+        }], propDecorators: { src: [{
                 type: Input,
                 args: [{ required: true }]
             }], height: [{
@@ -1161,9 +1163,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabCheckbox extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.size = "default";
@@ -1201,8 +1203,8 @@ class GoabCheckbox extends GoabControlValueAccessor {
             this.renderer.setAttribute(el, "checked", this.checked ? "true" : "false");
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCheckbox, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCheckbox, isStandalone: true, selector: "goab-checkbox", inputs: { name: "name", checked: ["checked", "checked", booleanAttribute], indeterminate: ["indeterminate", "indeterminate", booleanAttribute], text: "text", value: "value", ariaLabel: "ariaLabel", description: "description", reveal: "reveal", revealArialLabel: "revealArialLabel", maxWidth: "maxWidth", size: "size" }, outputs: { onChange: "onChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCheckbox, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCheckbox, isStandalone: true, selector: "goab-checkbox", inputs: { name: "name", checked: ["checked", "checked", booleanAttribute], indeterminate: ["indeterminate", "indeterminate", booleanAttribute], text: "text", value: "value", ariaLabel: "ariaLabel", description: "description", reveal: "reveal", revealArialLabel: "revealArialLabel", maxWidth: "maxWidth", size: "size" }, outputs: { onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -1244,7 +1246,7 @@ class GoabCheckbox extends GoabControlValueAccessor {
     </goa-checkbox>
   }`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCheckbox, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1294,7 +1296,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     ],
                     imports: [NgTemplateOutlet],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], checked: [{
                 type: Input,
@@ -1323,9 +1325,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabCheckboxList extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.size = "default";
@@ -1355,8 +1357,8 @@ class GoabCheckboxList extends GoabControlValueAccessor {
         // clone to ensure a new reference and trigger downstream updates
         this.value = Array.isArray(value) ? [...value] : [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCheckboxList, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCheckboxList, isStandalone: true, selector: "goab-checkbox-list", inputs: { name: "name", maxWidth: "maxWidth", size: "size", value: "value" }, outputs: { onChange: "onChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCheckboxList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCheckboxList, isStandalone: true, selector: "goab-checkbox-list", inputs: { name: "name", maxWidth: "maxWidth", size: "size", value: "value" }, outputs: { onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -1383,7 +1385,7 @@ class GoabCheckboxList extends GoabControlValueAccessor {
     </goa-checkbox-list>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCheckboxList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCheckboxList, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1417,7 +1419,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], maxWidth: [{
                 type: Input
@@ -1430,9 +1432,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabChip extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.content = "";
         this.onClick = new EventEmitter();
@@ -1448,8 +1450,8 @@ class GoabChip extends GoabBaseComponent {
     _onClick() {
         this.onClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabChip, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabChip, isStandalone: true, selector: "goab-chip", inputs: { leadingIcon: "leadingIcon", error: ["error", "error", booleanAttribute], deletable: ["deletable", "deletable", booleanAttribute], content: "content", variant: "variant", iconTheme: "iconTheme" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabChip, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabChip, isStandalone: true, selector: "goab-chip", inputs: { leadingIcon: "leadingIcon", error: ["error", "error", booleanAttribute], deletable: ["deletable", "deletable", booleanAttribute], content: "content", variant: "variant", iconTheme: "iconTheme" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-chip
       [attr.leadingicon]="leadingIcon"
       [attr.variant]="variant"
@@ -1468,7 +1470,7 @@ class GoabChip extends GoabBaseComponent {
     </goa-chip>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabChip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabChip, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1493,7 +1495,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { leadingIcon: [{
+        }], propDecorators: { leadingIcon: [{
                 type: Input
             }], error: [{
                 type: Input,
@@ -1512,8 +1514,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabCircularProgress {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1524,8 +1526,8 @@ class GoabCircularProgress {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCircularProgress, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabCircularProgress, isStandalone: true, selector: "goab-circular-progress", inputs: { variant: "variant", size: "size", message: "message", visible: ["visible", "visible", booleanAttribute], progress: ["progress", "progress", numberAttribute], testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCircularProgress, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabCircularProgress, isStandalone: true, selector: "goab-circular-progress", inputs: { variant: "variant", size: "size", message: "message", visible: ["visible", "visible", booleanAttribute], progress: ["progress", "progress", numberAttribute], testId: "testId" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-circular-progress
         [attr.variant]="variant || 'inline'"
@@ -1539,7 +1541,7 @@ class GoabCircularProgress {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabCircularProgress, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabCircularProgress, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1559,7 +1561,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { variant: [{
+        }], propDecorators: { variant: [{
                 type: Input
             }], size: [{
                 type: Input
@@ -1576,8 +1578,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabColumnLayout {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         /** no props **/
         this.isReady = false;
     }
@@ -1589,8 +1591,8 @@ class GoabColumnLayout {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabColumnLayout, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabColumnLayout, isStandalone: true, selector: "goab-column-layout", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabColumnLayout, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabColumnLayout, isStandalone: true, selector: "goab-column-layout", ngImport: i0, template: `
     @if (isReady) {
       <goa-one-column-layout>
         <ng-content />
@@ -1598,7 +1600,7 @@ class GoabColumnLayout {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabColumnLayout, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabColumnLayout, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1612,12 +1614,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
 class GoabContainer extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.type = "interactive";
         this.accent = "filled";
         this.padding = "relaxed";
@@ -1632,8 +1634,8 @@ class GoabContainer extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabContainer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabContainer, isStandalone: true, selector: "goab-container", inputs: { type: "type", accent: "accent", padding: "padding", width: "width", maxWidth: "maxWidth", minHeight: "minHeight", maxHeight: "maxHeight", title: "title", actions: "actions" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabContainer, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabContainer, isStandalone: true, selector: "goab-container", inputs: { type: "type", accent: "accent", padding: "padding", width: "width", maxWidth: "maxWidth", minHeight: "minHeight", maxHeight: "maxHeight", title: "title", actions: "actions" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-container
       [attr.type]="type"
       [attr.accent]="accent"
@@ -1662,7 +1664,7 @@ class GoabContainer extends GoabBaseComponent {
     </goa-container>
   }`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabContainer, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1698,7 +1700,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], accent: [{
                 type: Input
@@ -1719,8 +1721,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabDataGrid {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.keyboardIconVisibility = "visible";
         this.keyboardIconPosition = "left";
         this.isReady = false;
@@ -1733,8 +1735,8 @@ class GoabDataGrid {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDataGrid, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDataGrid, isStandalone: true, selector: "goab-data-grid", inputs: { keyboardIconVisibility: "keyboardIconVisibility", keyboardIconPosition: "keyboardIconPosition", keyboardNav: "keyboardNav" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDataGrid, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDataGrid, isStandalone: true, selector: "goab-data-grid", inputs: { keyboardIconVisibility: "keyboardIconVisibility", keyboardIconPosition: "keyboardIconPosition", keyboardNav: "keyboardNav" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-data-grid
         [attr.keyboard-icon-visibility]="keyboardIconVisibility"
@@ -1746,7 +1748,7 @@ class GoabDataGrid {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDataGrid, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDataGrid, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1764,7 +1766,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { keyboardIconVisibility: [{
+        }], propDecorators: { keyboardIconVisibility: [{
                 type: Input
             }], keyboardIconPosition: [{
                 type: Input
@@ -1774,6 +1776,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabDatePicker extends GoabControlValueAccessor {
+    constructor() {
+        super(...arguments);
+        this.elementRef = inject(ElementRef);
+        this.cdr = inject(ChangeDetectorRef);
+        this.isReady = false;
+        this.version = "2";
+        this.onChange = new EventEmitter();
+        this.once = new Once();
+    }
     formatValue(param, val) {
         if (!val)
             return "";
@@ -1800,15 +1811,6 @@ class GoabDatePicker extends GoabControlValueAccessor {
         this.markAsTouched();
         this.fcChange?.(detail.value);
     }
-    constructor(elementRef, cdr, renderer) {
-        super(renderer);
-        this.elementRef = elementRef;
-        this.cdr = cdr;
-        this.isReady = false;
-        this.version = "2";
-        this.onChange = new EventEmitter();
-        this.once = new Once();
-    }
     ngOnInit() {
         // For Angular 20, we need to delay rendering the web component
         // to ensure all attributes are properly bound before the component initializes
@@ -1840,8 +1842,8 @@ class GoabDatePicker extends GoabControlValueAccessor {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDatePicker, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDatePicker, isStandalone: true, selector: "goab-date-picker", inputs: { name: "name", value: "value", min: "min", max: "max", type: "type", relative: "relative", width: "width" }, outputs: { onChange: "onChange" }, host: { listeners: { "disabledChange": "listenDisabledChange($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDatePicker, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDatePicker, isStandalone: true, selector: "goab-date-picker", inputs: { name: "name", value: "value", min: "min", max: "max", type: "type", relative: "relative", width: "width" }, outputs: { onChange: "onChange" }, host: { listeners: { "disabledChange": "listenDisabledChange($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -1870,7 +1872,7 @@ class GoabDatePicker extends GoabControlValueAccessor {
     </goa-date-picker>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDatePicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDatePicker, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1906,7 +1908,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], value: [{
                 type: Input
@@ -1928,9 +1930,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabDetails extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1941,8 +1943,8 @@ class GoabDetails extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDetails, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDetails, isStandalone: true, selector: "goab-details", inputs: { heading: "heading", open: ["open", "open", booleanAttribute], maxWidth: "maxWidth" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDetails, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDetails, isStandalone: true, selector: "goab-details", inputs: { heading: "heading", open: ["open", "open", booleanAttribute], maxWidth: "maxWidth" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-details
         [attr.heading]="heading"
@@ -1959,7 +1961,7 @@ class GoabDetails extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDetails, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDetails, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -1982,7 +1984,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input,
                 args: [{ required: true }]
             }], open: [{
@@ -1993,9 +1995,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabDivider extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -2006,8 +2008,8 @@ class GoabDivider extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDivider, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDivider, isStandalone: true, selector: "goab-divider", usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDivider, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDivider, isStandalone: true, selector: "goab-divider", usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-divider
         [attr.testid]="testId"
@@ -2020,7 +2022,7 @@ class GoabDivider extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDivider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDivider, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2039,11 +2041,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
 class GoabDrawer {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.version = "2";
         this.onClose = new EventEmitter();
         this.isReady = false;
@@ -2067,8 +2069,8 @@ class GoabDrawer {
             return null;
         return this.heading instanceof TemplateRef ? this.heading : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDrawer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDrawer, isStandalone: true, selector: "goab-drawer", inputs: { open: ["open", "open", booleanAttribute], position: "position", heading: "heading", maxSize: "maxSize", testId: "testId", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDrawer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDrawer, isStandalone: true, selector: "goab-drawer", inputs: { open: ["open", "open", booleanAttribute], position: "position", heading: "heading", maxSize: "maxSize", testId: "testId", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `@if (isReady) {
     <goa-drawer
       [open]="open"
       [attr.position]="position"
@@ -2088,7 +2090,7 @@ class GoabDrawer {
     </goa-drawer>
   } `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDrawer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDrawer, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2115,7 +2117,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   } `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { open: [{
+        }], propDecorators: { open: [{
                 type: Input,
                 args: [{ required: true, transform: booleanAttribute }]
             }], position: [{
@@ -2135,9 +2137,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
 
 // "disabled", "value", "id" is an exposed property of HTMLInputElement, no need to bind with attr
 class GoabDropdown extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.size = "default";
         this.onChange = new EventEmitter();
         this.isReady = false;
@@ -2159,8 +2161,8 @@ class GoabDropdown extends GoabControlValueAccessor {
         this.markAsTouched();
         this.fcChange?.(detail.value || "");
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDropdown, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDropdown, isStandalone: true, selector: "goab-dropdown", inputs: { name: "name", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterable: ["filterable", "filterable", booleanAttribute], leadingIcon: "leadingIcon", maxHeight: "maxHeight", multiselect: ["multiselect", "multiselect", booleanAttribute], native: ["native", "native", booleanAttribute], placeholder: "placeholder", width: "width", maxWidth: "maxWidth", autoComplete: "autoComplete", size: "size", relative: "relative" }, outputs: { onChange: "onChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDropdown, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDropdown, isStandalone: true, selector: "goab-dropdown", inputs: { name: "name", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterable: ["filterable", "filterable", booleanAttribute], leadingIcon: "leadingIcon", maxHeight: "maxHeight", multiselect: ["multiselect", "multiselect", booleanAttribute], native: ["native", "native", booleanAttribute], placeholder: "placeholder", width: "width", maxWidth: "maxWidth", autoComplete: "autoComplete", size: "size", relative: "relative" }, outputs: { onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -2201,7 +2203,7 @@ class GoabDropdown extends GoabControlValueAccessor {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDropdown, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDropdown, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2249,7 +2251,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], ariaLabel: [{
                 type: Input
@@ -2285,8 +2287,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabDropdownItem {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -2297,8 +2299,8 @@ class GoabDropdownItem {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDropdownItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabDropdownItem, isStandalone: true, selector: "goab-dropdown-item", inputs: { value: "value", filter: "filter", label: "label", name: "name", mountType: "mountType" }, ngImport: i0, template: ` @if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDropdownItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabDropdownItem, isStandalone: true, selector: "goab-dropdown-item", inputs: { value: "value", filter: "filter", label: "label", name: "name", mountType: "mountType" }, ngImport: i0, template: ` @if (isReady) {
     <goa-dropdown-item
       [value]="value"
       [label]="label"
@@ -2309,7 +2311,7 @@ class GoabDropdownItem {
     </goa-dropdown-item>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabDropdownItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabDropdownItem, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2326,7 +2328,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { value: [{
+        }], propDecorators: { value: [{
                 type: Input
             }], filter: [{
                 type: Input
@@ -2339,8 +2341,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabFileUploadCard {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.onCancel = new EventEmitter();
         this.onDelete = new EventEmitter();
         this.isReady = false;
@@ -2360,8 +2362,8 @@ class GoabFileUploadCard {
     _onDelete(event) {
         this.onDelete.emit({ filename: this.filename, event });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFileUploadCard, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabFileUploadCard, isStandalone: true, selector: "goab-file-upload-card", inputs: { filename: "filename", size: ["size", "size", numberAttribute], type: "type", progress: ["progress", "progress", numberAttribute], error: "error", testId: "testId" }, outputs: { onCancel: "onCancel", onDelete: "onDelete" }, ngImport: i0, template: ` @if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFileUploadCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabFileUploadCard, isStandalone: true, selector: "goab-file-upload-card", inputs: { filename: "filename", size: ["size", "size", numberAttribute], type: "type", progress: ["progress", "progress", numberAttribute], error: "error", testId: "testId" }, outputs: { onCancel: "onCancel", onDelete: "onDelete" }, ngImport: i0, template: ` @if (isReady) {
     <goa-file-upload-card
       [attr.version]="version"
       [attr.filename]="filename"
@@ -2376,7 +2378,7 @@ class GoabFileUploadCard {
     </goa-file-upload-card>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFileUploadCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFileUploadCard, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2397,7 +2399,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { filename: [{
+        }], propDecorators: { filename: [{
                 type: Input,
                 args: [{ required: true }]
             }], size: [{
@@ -2419,9 +2421,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabFileUploadInput extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.id = "";
         this.maxFileSize = "5MB";
         this.onSelectFile = new EventEmitter();
@@ -2443,8 +2445,8 @@ class GoabFileUploadInput extends GoabBaseComponent {
         };
         this.onSelectFile.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFileUploadInput, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabFileUploadInput, isStandalone: true, selector: "goab-file-upload-input", inputs: { id: "id", variant: "variant", maxFileSize: "maxFileSize", accept: "accept" }, outputs: { onSelectFile: "onSelectFile" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFileUploadInput, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabFileUploadInput, isStandalone: true, selector: "goab-file-upload-input", inputs: { id: "id", variant: "variant", maxFileSize: "maxFileSize", accept: "accept" }, outputs: { onSelectFile: "onSelectFile" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-file-upload-input
       [attr.version]="version"
       [attr.variant]="variant"
@@ -2461,7 +2463,7 @@ class GoabFileUploadInput extends GoabBaseComponent {
     </goa-file-upload-input>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFileUploadInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFileUploadInput, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2484,7 +2486,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { id: [{
+        }], propDecorators: { id: [{
                 type: Input
             }], variant: [{
                 type: Input,
@@ -2498,9 +2500,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabFilterChip extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.content = "";
         this.secondaryText = "";
         this.leadingIcon = null;
@@ -2519,8 +2521,8 @@ class GoabFilterChip extends GoabBaseComponent {
     _onClick() {
         this.onClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFilterChip, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabFilterChip, isStandalone: true, selector: "goab-filter-chip", inputs: { error: ["error", "error", booleanAttribute], deletable: ["deletable", "deletable", booleanAttribute], content: "content", iconTheme: "iconTheme", secondaryText: "secondaryText", leadingIcon: "leadingIcon" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFilterChip, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabFilterChip, isStandalone: true, selector: "goab-filter-chip", inputs: { error: ["error", "error", booleanAttribute], deletable: ["deletable", "deletable", booleanAttribute], content: "content", iconTheme: "iconTheme", secondaryText: "secondaryText", leadingIcon: "leadingIcon" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-filter-chip
       [attr.version]="version"
       [attr.error]="error"
@@ -2539,7 +2541,7 @@ class GoabFilterChip extends GoabBaseComponent {
     </goa-filter-chip>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFilterChip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFilterChip, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2564,7 +2566,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { error: [{
+        }], propDecorators: { error: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
             }], deletable: [{
@@ -2583,8 +2585,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabAppFooter {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -2596,8 +2598,8 @@ class GoabAppFooter {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppFooter, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabAppFooter, isStandalone: true, selector: "goab-app-footer", inputs: { maxContentWidth: "maxContentWidth", testId: "testId", url: "url" }, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppFooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabAppFooter, isStandalone: true, selector: "goab-app-footer", inputs: { maxContentWidth: "maxContentWidth", testId: "testId", url: "url" }, ngImport: i0, template: `@if (isReady) {
     <goa-app-footer
       [attr.maxcontentwidth]="maxContentWidth"
       [attr.url]="url"
@@ -2610,7 +2612,7 @@ class GoabAppFooter {
     </goa-app-footer>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppFooter, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -2629,7 +2631,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { maxContentWidth: [{
+        }], propDecorators: { maxContentWidth: [{
                 type: Input
             }], testId: [{
                 type: Input
@@ -2638,8 +2640,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabAppFooterMetaSection {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -2650,21 +2652,21 @@ class GoabAppFooterMetaSection {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppFooterMetaSection, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabAppFooterMetaSection, isStandalone: true, selector: "goab-app-footer-meta-section", inputs: { testId: "testId", slot: "slot" }, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppFooterMetaSection, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabAppFooterMetaSection, isStandalone: true, selector: "goab-app-footer-meta-section", inputs: { testId: "testId", slot: "slot" }, ngImport: i0, template: `@if (isReady) {
     <goa-app-footer-meta-section [attr.testid]="testId">
       <ng-content />
     </goa-app-footer-meta-section>
   }`, isInline: true, styles: [":host{width:100%}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppFooterMetaSection, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppFooterMetaSection, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "goab-app-footer-meta-section", template: `@if (isReady) {
     <goa-app-footer-meta-section [attr.testid]="testId">
       <ng-content />
     </goa-app-footer-meta-section>
   }`, schemas: [CUSTOM_ELEMENTS_SCHEMA], styles: [":host{width:100%}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { testId: [{
+        }], propDecorators: { testId: [{
                 type: Input
             }], slot: [{
                 type: Input,
@@ -2672,8 +2674,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabAppFooterNavSection {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.maxColumnCount = 1;
         this.isReady = false;
     }
@@ -2685,8 +2687,8 @@ class GoabAppFooterNavSection {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppFooterNavSection, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabAppFooterNavSection, isStandalone: true, selector: "goab-app-footer-nav-section", inputs: { heading: "heading", maxColumnCount: "maxColumnCount", testId: "testId", slot: "slot" }, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppFooterNavSection, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabAppFooterNavSection, isStandalone: true, selector: "goab-app-footer-nav-section", inputs: { heading: "heading", maxColumnCount: "maxColumnCount", testId: "testId", slot: "slot" }, ngImport: i0, template: `@if (isReady) {
     <goa-app-footer-nav-section
       [attr.maxcolumncount]="maxColumnCount"
       [attr.heading]="heading"
@@ -2696,7 +2698,7 @@ class GoabAppFooterNavSection {
     </goa-app-footer-nav-section>
   }`, isInline: true, styles: [":host{width:100%}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppFooterNavSection, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppFooterNavSection, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "goab-app-footer-nav-section", template: `@if (isReady) {
     <goa-app-footer-nav-section
@@ -2707,7 +2709,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
       <ng-content />
     </goa-app-footer-nav-section>
   }`, schemas: [CUSTOM_ELEMENTS_SCHEMA], styles: [":host{width:100%}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input
             }], maxColumnCount: [{
                 type: Input
@@ -2736,8 +2738,8 @@ class GoabPublicForm {
         const detail = e.detail;
         this.onStateChange.emit(detail.data);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicForm, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicForm, isStandalone: true, selector: "goab-public-form", inputs: { status: "status", name: "name" }, outputs: { onInit: "onInit", onComplete: "onComplete", onStateChange: "onStateChange" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicForm, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicForm, isStandalone: true, selector: "goab-public-form", inputs: { status: "status", name: "name" }, outputs: { onInit: "onInit", onComplete: "onComplete", onStateChange: "onStateChange" }, ngImport: i0, template: `
     <goa-public-form
       [attr.status]="status"
       [attr.name]="name"
@@ -2749,7 +2751,7 @@ class GoabPublicForm {
     </goa-public-form>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicForm, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicForm, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-form",
@@ -2799,8 +2801,8 @@ class GoabPublicFormPage extends GoabBaseComponent {
     _onContinue(event) {
         this.onContinue.emit(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormPage, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicFormPage, isStandalone: true, selector: "goab-public-form-page", inputs: { id: "id", heading: "heading", subHeading: "subHeading", summaryHeading: "summaryHeading", sectionTitle: "sectionTitle", backUrl: "backUrl", type: "type", buttonText: "buttonText", buttonVisibility: "buttonVisibility" }, outputs: { onContinue: "onContinue" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormPage, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicFormPage, isStandalone: true, selector: "goab-public-form-page", inputs: { id: "id", heading: "heading", subHeading: "subHeading", summaryHeading: "summaryHeading", sectionTitle: "sectionTitle", backUrl: "backUrl", type: "type", buttonText: "buttonText", buttonVisibility: "buttonVisibility" }, outputs: { onContinue: "onContinue" }, usesInheritance: true, ngImport: i0, template: `
     <goa-public-form-page
       [id]="id"
       [attr.heading]="heading"
@@ -2821,7 +2823,7 @@ class GoabPublicFormPage extends GoabBaseComponent {
     </goa-public-form-page>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormPage, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormPage, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-form-page",
@@ -2871,14 +2873,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabPublicFormSummary {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormSummary, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicFormSummary, isStandalone: true, selector: "goab-public-form-summary", inputs: { heading: "heading" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormSummary, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicFormSummary, isStandalone: true, selector: "goab-public-form-summary", inputs: { heading: "heading" }, ngImport: i0, template: `
     <goa-public-form-summary [attr.heading]="heading">
       <ng-content />
     </goa-public-form-summary>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormSummary, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormSummary, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-form-summary",
@@ -2909,8 +2911,8 @@ class GoabPublicSubform extends GoabBaseComponent {
     _onStateChange(e) {
         this.onStateChange.emit(e);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicSubform, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicSubform, isStandalone: true, selector: "goab-public-subform", inputs: { id: "id", name: "name", continueMsg: "continueMsg" }, outputs: { onInit: "onInit", onStateChange: "onStateChange" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicSubform, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicSubform, isStandalone: true, selector: "goab-public-subform", inputs: { id: "id", name: "name", continueMsg: "continueMsg" }, outputs: { onInit: "onInit", onStateChange: "onStateChange" }, usesInheritance: true, ngImport: i0, template: `
     <goa-public-subform
       [attr.id]="id"
       [attr.name]="name"
@@ -2926,7 +2928,7 @@ class GoabPublicSubform extends GoabBaseComponent {
     </goa-public-subform>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicSubform, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicSubform, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-subform",
@@ -2968,8 +2970,8 @@ class GoabPublicSubformIndex extends GoabBaseComponent {
         this.actionButtonText = "";
         this.buttonVisibility = "hidden";
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicSubformIndex, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicSubformIndex, isStandalone: true, selector: "goab-public-subform-index", inputs: { heading: "heading", sectionTitle: "sectionTitle", actionButtonText: "actionButtonText", buttonVisibility: "buttonVisibility" }, host: { attributes: { "slot": "subform-index" } }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicSubformIndex, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicSubformIndex, isStandalone: true, selector: "goab-public-subform-index", inputs: { heading: "heading", sectionTitle: "sectionTitle", actionButtonText: "actionButtonText", buttonVisibility: "buttonVisibility" }, host: { attributes: { "slot": "subform-index" } }, usesInheritance: true, ngImport: i0, template: `
     <goa-public-subform-index
       [attr.heading]="heading"
       [attr.section-title]="sectionTitle"
@@ -2984,7 +2986,7 @@ class GoabPublicSubformIndex extends GoabBaseComponent {
     </goa-public-subform-index>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicSubformIndex, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicSubformIndex, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-subform-index",
@@ -3019,14 +3021,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabPublicFormTask {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormTask, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicFormTask, isStandalone: true, selector: "goab-public-form-task", inputs: { status: "status" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormTask, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicFormTask, isStandalone: true, selector: "goab-public-form-task", inputs: { status: "status" }, ngImport: i0, template: `
     <goa-public-form-task [attr.status]="status">
       <ng-content />
     </goa-public-form-task>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormTask, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormTask, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-form-task",
@@ -3043,8 +3045,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabPublicFormTaskList extends GoabBaseComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormTaskList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabPublicFormTaskList, isStandalone: true, selector: "goab-public-form-task-list", inputs: { heading: "heading" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormTaskList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabPublicFormTaskList, isStandalone: true, selector: "goab-public-form-task-list", inputs: { heading: "heading" }, usesInheritance: true, ngImport: i0, template: `
     <goa-public-form-task-list
       [attr.heading]="heading"
       [attr.mt]="mt"
@@ -3056,7 +3058,7 @@ class GoabPublicFormTaskList extends GoabBaseComponent {
     </goa-public-form-task-list>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPublicFormTaskList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPublicFormTaskList, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-public-form-task-list",
@@ -3087,8 +3089,8 @@ class GoabFieldset {
         const detail = event.detail;
         this.onContinue.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFieldset, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabFieldset, isStandalone: true, selector: "goab-fieldset", inputs: { id: "id", sectionTitle: "sectionTitle", dispatchOn: "dispatchOn" }, outputs: { onContinue: "onContinue" }, ngImport: i0, template: ` <goa-fieldset
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFieldset, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabFieldset, isStandalone: true, selector: "goab-fieldset", inputs: { id: "id", sectionTitle: "sectionTitle", dispatchOn: "dispatchOn" }, outputs: { onContinue: "onContinue" }, ngImport: i0, template: ` <goa-fieldset
     [attr.section-title]="sectionTitle"
     [attr.dispatch-on]="dispatchOn"
     [attr.id]="id"
@@ -3097,7 +3099,7 @@ class GoabFieldset {
     <ng-content></ng-content>
   </goa-fieldset>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFieldset, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFieldset, decorators: [{
             type: Component,
             args: [{
                     selector: "goab-fieldset",
@@ -3123,9 +3125,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabFormItem extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.type = "";
         this.isReady = false;
         this.version = "2";
@@ -3138,8 +3140,8 @@ class GoabFormItem extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabFormItem, isStandalone: true, selector: "goab-form-item", inputs: { label: "label", labelSize: "labelSize", helpText: "helpText", error: "error", requirement: "requirement", maxWidth: "maxWidth", id: "id", type: "type", publicFormSummaryOrder: "publicFormSummaryOrder", name: "name" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormItem, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabFormItem, isStandalone: true, selector: "goab-form-item", inputs: { label: "label", labelSize: "labelSize", helpText: "helpText", error: "error", requirement: "requirement", maxWidth: "maxWidth", id: "id", type: "type", publicFormSummaryOrder: "publicFormSummaryOrder", name: "name" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-form-item
       [attr.version]="version"
       [attr.label]="label"
@@ -3163,7 +3165,7 @@ class GoabFormItem extends GoabBaseComponent {
     </goa-form-item>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormItem, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3193,7 +3195,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
+        }], propDecorators: { label: [{
                 type: Input
             }], labelSize: [{
                 type: Input
@@ -3222,10 +3224,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
  * // similar to app-footer-meta-section & app-footer-nav-section
  */
 class GoabFormItemSlot {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormItemSlot, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabFormItemSlot, isStandalone: true, selector: "goab-form-item-slot", inputs: { slot: "slot" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormItemSlot, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabFormItemSlot, isStandalone: true, selector: "goab-form-item-slot", inputs: { slot: "slot" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormItemSlot, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormItemSlot, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3238,8 +3240,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabFormStep {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3248,14 +3250,14 @@ class GoabFormStep {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormStep, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabFormStep, isStandalone: true, selector: "goab-form-step", inputs: { text: "text", status: "status" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormStep, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabFormStep, isStandalone: true, selector: "goab-form-step", inputs: { text: "text", status: "status" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-form-step [attr.text]="text" [attr.status]="status"></goa-form-step>
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormStep, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormStep, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3267,16 +3269,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { text: [{
+        }], propDecorators: { text: [{
                 type: Input
             }], status: [{
                 type: Input
             }] } });
 
 class GoabFormStepper extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.step = -1;
         this.onChange = new EventEmitter();
         this.isReady = false;
@@ -3291,8 +3293,8 @@ class GoabFormStepper extends GoabBaseComponent {
         const detail = e.detail;
         this.onChange.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormStepper, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabFormStepper, isStandalone: true, selector: "goab-form-stepper", inputs: { step: "step" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormStepper, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabFormStepper, isStandalone: true, selector: "goab-form-stepper", inputs: { step: "step" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-form-stepper
         [attr.step]="step"
@@ -3308,7 +3310,7 @@ class GoabFormStepper extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabFormStepper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormStepper, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3330,16 +3332,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { step: [{
+        }], propDecorators: { step: [{
                 type: Input
             }], onChange: [{
                 type: Output
             }] } });
 
 class GoabGrid extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3348,8 +3350,8 @@ class GoabGrid extends GoabBaseComponent {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabGrid, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabGrid, isStandalone: true, selector: "goab-grid", inputs: { minChildWidth: "minChildWidth", gap: "gap" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabGrid, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabGrid, isStandalone: true, selector: "goab-grid", inputs: { minChildWidth: "minChildWidth", gap: "gap" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-grid
         [attr.gap]="gap"
@@ -3365,7 +3367,7 @@ class GoabGrid extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabGrid, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabGrid, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3387,7 +3389,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { minChildWidth: [{
+        }], propDecorators: { minChildWidth: [{
                 type: Input,
                 args: [{ required: true }]
             }], gap: [{
@@ -3395,9 +3397,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabAppHeader extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.onMenuClick = new EventEmitter();
@@ -3411,8 +3413,8 @@ class GoabAppHeader extends GoabBaseComponent {
     _onMenuClick() {
         this.onMenuClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppHeader, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabAppHeader, isStandalone: true, selector: "goab-app-header", inputs: { url: "url", heading: "heading", secondaryText: "secondaryText", maxContentWidth: "maxContentWidth", fullMenuBreakpoint: ["fullMenuBreakpoint", "fullMenuBreakpoint", numberAttribute] }, outputs: { onMenuClick: "onMenuClick" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppHeader, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabAppHeader, isStandalone: true, selector: "goab-app-header", inputs: { url: "url", heading: "heading", secondaryText: "secondaryText", maxContentWidth: "maxContentWidth", fullMenuBreakpoint: ["fullMenuBreakpoint", "fullMenuBreakpoint", numberAttribute] }, outputs: { onMenuClick: "onMenuClick" }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-app-header
       [attr.url]="url"
       [attr.heading]="heading"
@@ -3428,7 +3430,7 @@ class GoabAppHeader extends GoabBaseComponent {
     </goa-app-header>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppHeader, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3450,7 +3452,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { url: [{
+        }], propDecorators: { url: [{
                 type: Input
             }], heading: [{
                 type: Input
@@ -3466,22 +3468,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabAppHeaderMenu extends GoabBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        this.isReady = false;
+    }
     get hostSlot() {
         return this.slotName ?? null;
     }
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
-        this.isReady = false;
-    }
     ngOnInit() {
         setTimeout(() => {
             this.isReady = true;
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppHeaderMenu, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabAppHeaderMenu, isStandalone: true, selector: "goab-app-header-menu", inputs: { leadingIcon: "leadingIcon", heading: "heading", slotName: "slotName" }, host: { properties: { "attr.slot": "this.hostSlot" } }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppHeaderMenu, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabAppHeaderMenu, isStandalone: true, selector: "goab-app-header-menu", inputs: { leadingIcon: "leadingIcon", heading: "heading", slotName: "slotName" }, host: { properties: { "attr.slot": "this.hostSlot" } }, usesInheritance: true, ngImport: i0, template: `@if (isReady) {
     <goa-app-header-menu
       [attr.leadingicon]="leadingIcon"
       [attr.heading]="heading"
@@ -3491,7 +3493,7 @@ class GoabAppHeaderMenu extends GoabBaseComponent {
     </goa-app-header-menu>
   }`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabAppHeaderMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabAppHeaderMenu, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3507,7 +3509,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { leadingIcon: [{
+        }], propDecorators: { leadingIcon: [{
                 type: Input
             }], heading: [{
                 type: Input
@@ -3519,8 +3521,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabHeroBanner {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3529,8 +3531,8 @@ class GoabHeroBanner {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabHeroBanner, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabHeroBanner, isStandalone: true, selector: "goab-hero-banner", inputs: { heading: "heading", backgroundUrl: "backgroundUrl", minHeight: "minHeight", testId: "testId", maxContentWidth: "maxContentWidth", backgroundColor: "backgroundColor", textColor: "textColor", actions: "actions" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabHeroBanner, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabHeroBanner, isStandalone: true, selector: "goab-hero-banner", inputs: { heading: "heading", backgroundUrl: "backgroundUrl", minHeight: "minHeight", testId: "testId", maxContentWidth: "maxContentWidth", backgroundColor: "backgroundColor", textColor: "textColor", actions: "actions" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-hero-banner
         [attr.heading]="heading"
@@ -3549,7 +3551,7 @@ class GoabHeroBanner {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabHeroBanner, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabHeroBanner, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3575,7 +3577,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input
             }], backgroundUrl: [{
                 type: Input
@@ -3594,9 +3596,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabIcon extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3607,8 +3609,8 @@ class GoabIcon extends GoabBaseComponent {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabIcon, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabIcon, isStandalone: true, selector: "goab-icon", inputs: { type: "type", size: "size", theme: "theme", inverted: ["inverted", "inverted", booleanAttribute], fillColor: "fillColor", opacity: ["opacity", "opacity", numberAttribute], title: "title", ariaLabel: "ariaLabel" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabIcon, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabIcon, isStandalone: true, selector: "goab-icon", inputs: { type: "type", size: "size", theme: "theme", inverted: ["inverted", "inverted", booleanAttribute], fillColor: "fillColor", opacity: ["opacity", "opacity", numberAttribute], title: "title", ariaLabel: "ariaLabel" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-icon
         [attr.type]="type"
@@ -3629,7 +3631,7 @@ class GoabIcon extends GoabBaseComponent {
     }
   `, isInline: true, styles: [":host{display:inline-flex;align-items:center}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabIcon, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "goab-icon", template: `
     @if (isReady) {
@@ -3651,7 +3653,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
       </goa-icon>
     }
   `, schemas: [CUSTOM_ELEMENTS_SCHEMA], styles: [":host{display:inline-flex;align-items:center}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input,
                 args: [{ required: true }]
             }], size: [{
@@ -3673,9 +3675,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabIconButton extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.JSON = JSON;
         this.size = "medium";
@@ -3690,8 +3692,8 @@ class GoabIconButton extends GoabBaseComponent {
     _onClick() {
         this.onClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabIconButton, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabIconButton, isStandalone: true, selector: "goab-icon-button", inputs: { icon: "icon", size: "size", variant: "variant", title: "title", disabled: ["disabled", "disabled", booleanAttribute], ariaLabel: "ariaLabel", action: "action", actionArg: "actionArg", actionArgs: "actionArgs" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabIconButton, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabIconButton, isStandalone: true, selector: "goab-icon-button", inputs: { icon: "icon", size: "size", variant: "variant", title: "title", disabled: ["disabled", "disabled", booleanAttribute], ariaLabel: "ariaLabel", action: "action", actionArg: "actionArg", actionArgs: "actionArgs" }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-icon-button
         [attr.icon]="icon"
@@ -3715,7 +3717,7 @@ class GoabIconButton extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabIconButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabIconButton, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3745,7 +3747,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { icon: [{
+        }], propDecorators: { icon: [{
                 type: Input,
                 args: [{ required: true }]
             }], size: [{
@@ -3770,9 +3772,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabInput extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.type = "text";
         this.textAlign = "left";
         this.size = "default";
@@ -3839,8 +3841,8 @@ class GoabInput extends GoabControlValueAccessor {
             return null;
         return this.trailingContent instanceof TemplateRef ? this.trailingContent : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabInput, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabInput, isStandalone: true, selector: "goab-input", inputs: { type: "type", name: "name", debounce: ["debounce", "debounce", numberAttribute], autoCapitalize: "autoCapitalize", autoComplete: "autoComplete", placeholder: "placeholder", leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", variant: "variant", focused: ["focused", "focused", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], width: "width", prefix: "prefix", suffix: "suffix", ariaLabel: "ariaLabel", maxLength: ["maxLength", "maxLength", numberAttribute], min: "min", max: "max", step: ["step", "step", numberAttribute], ariaLabelledBy: "ariaLabelledBy", trailingIconAriaLabel: "trailingIconAriaLabel", textAlign: "textAlign", leadingContent: "leadingContent", trailingContent: "trailingContent", size: "size" }, outputs: { onTrailingIconClick: "onTrailingIconClick", onFocus: "onFocus", onBlur: "onBlur", onKeyPress: "onKeyPress", onChange: "onChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabInput, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabInput, isStandalone: true, selector: "goab-input", inputs: { type: "type", name: "name", debounce: ["debounce", "debounce", numberAttribute], autoCapitalize: "autoCapitalize", autoComplete: "autoComplete", placeholder: "placeholder", leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", variant: "variant", focused: ["focused", "focused", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], width: "width", prefix: "prefix", suffix: "suffix", ariaLabel: "ariaLabel", maxLength: ["maxLength", "maxLength", numberAttribute], min: "min", max: "max", step: ["step", "step", numberAttribute], ariaLabelledBy: "ariaLabelledBy", trailingIconAriaLabel: "trailingIconAriaLabel", textAlign: "textAlign", leadingContent: "leadingContent", trailingContent: "trailingContent", size: "size" }, outputs: { onTrailingIconClick: "onTrailingIconClick", onFocus: "onFocus", onBlur: "onBlur", onKeyPress: "onKeyPress", onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -3916,7 +3918,7 @@ class GoabInput extends GoabControlValueAccessor {
     </goa-input>
   }`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabInput, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4000,7 +4002,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -4068,8 +4070,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabInputNumber {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.type = "number";
         this.textAlign = "right"; // Default to right for numbers
@@ -4158,8 +4160,8 @@ class GoabInputNumber {
             return null;
         return this.trailingContent instanceof TemplateRef ? this.trailingContent : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabInputNumber, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabInputNumber, isStandalone: true, selector: "goab-input-number", inputs: { type: "type", name: "name", id: "id", debounce: ["debounce", "debounce", numberAttribute], disabled: ["disabled", "disabled", booleanAttribute], autoCapitalize: "autoCapitalize", placeholder: "placeholder", leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", variant: "variant", focused: ["focused", "focused", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], error: ["error", "error", booleanAttribute], width: "width", prefix: "prefix", suffix: "suffix", testId: "testId", ariaLabel: "ariaLabel", maxLength: ["maxLength", "maxLength", numberAttribute], min: "min", max: "max", step: ["step", "step", numberAttribute], ariaLabelledBy: "ariaLabelledBy", mt: "mt", mr: "mr", mb: "mb", ml: "ml", trailingIconAriaLabel: "trailingIconAriaLabel", textAlign: "textAlign", value: "value", leadingContent: "leadingContent", trailingContent: "trailingContent" }, outputs: { onTrailingIconClick: "onTrailingIconClick", onFocus: "onFocus", onBlur: "onBlur", onKeyPress: "onKeyPress", onChange: "onChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabInputNumber, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabInputNumber, isStandalone: true, selector: "goab-input-number", inputs: { type: "type", name: "name", id: "id", debounce: ["debounce", "debounce", numberAttribute], disabled: ["disabled", "disabled", booleanAttribute], autoCapitalize: "autoCapitalize", placeholder: "placeholder", leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", variant: "variant", focused: ["focused", "focused", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], error: ["error", "error", booleanAttribute], width: "width", prefix: "prefix", suffix: "suffix", testId: "testId", ariaLabel: "ariaLabel", maxLength: ["maxLength", "maxLength", numberAttribute], min: "min", max: "max", step: ["step", "step", numberAttribute], ariaLabelledBy: "ariaLabelledBy", mt: "mt", mr: "mr", mb: "mb", ml: "ml", trailingIconAriaLabel: "trailingIconAriaLabel", textAlign: "textAlign", value: "value", leadingContent: "leadingContent", trailingContent: "trailingContent" }, outputs: { onTrailingIconClick: "onTrailingIconClick", onFocus: "onFocus", onBlur: "onBlur", onKeyPress: "onKeyPress", onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -4235,7 +4237,7 @@ class GoabInputNumber {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabInputNumber, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabInputNumber, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4319,7 +4321,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -4403,8 +4405,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabLinearProgress {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -4415,8 +4417,8 @@ class GoabLinearProgress {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabLinearProgress, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabLinearProgress, isStandalone: true, selector: "goab-linear-progress", inputs: { progress: "progress", percentVisibility: "percentVisibility", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", testid: "testid" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabLinearProgress, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabLinearProgress, isStandalone: true, selector: "goab-linear-progress", inputs: { progress: "progress", percentVisibility: "percentVisibility", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", testid: "testid" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-linear-progress
         [attr.progress]="progress"
@@ -4429,7 +4431,7 @@ class GoabLinearProgress {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabLinearProgress, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabLinearProgress, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4448,7 +4450,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { progress: [{
+        }], propDecorators: { progress: [{
                 type: Input
             }], percentVisibility: [{
                 type: Input
@@ -4461,8 +4463,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabLink {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.color = "interactive";
         this.size = "medium";
@@ -4474,8 +4476,8 @@ class GoabLink {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabLink, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabLink, isStandalone: true, selector: "goab-link", inputs: { leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", testId: "testId", action: "action", color: "color", size: "size", actionArg: "actionArg", actionArgs: "actionArgs", mt: "mt", mb: "mb", ml: "ml", mr: "mr" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabLink, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabLink, isStandalone: true, selector: "goab-link", inputs: { leadingIcon: "leadingIcon", trailingIcon: "trailingIcon", testId: "testId", action: "action", color: "color", size: "size", actionArg: "actionArg", actionArgs: "actionArgs", mt: "mt", mb: "mb", ml: "ml", mr: "mr" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-link
         [attr.leadingicon]="leadingIcon"
@@ -4496,7 +4498,7 @@ class GoabLink {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabLink, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabLink, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4523,7 +4525,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { leadingIcon: [{
+        }], propDecorators: { leadingIcon: [{
                 type: Input
             }], trailingIcon: [{
                 type: Input
@@ -4550,8 +4552,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabMicrositeHeader {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.onFeedbackClick = new EventEmitter();
     }
@@ -4572,8 +4574,8 @@ class GoabMicrositeHeader {
     _onFeedbackClick() {
         this.onFeedbackClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabMicrositeHeader, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabMicrositeHeader, isStandalone: true, selector: "goab-microsite-header", inputs: { type: "type", version: "version", feedbackUrl: "feedbackUrl", testId: "testId", maxContentWidth: "maxContentWidth", feedbackUrlTarget: "feedbackUrlTarget", headerUrlTarget: "headerUrlTarget" }, outputs: { onFeedbackClick: "onFeedbackClick" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabMicrositeHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabMicrositeHeader, isStandalone: true, selector: "goab-microsite-header", inputs: { type: "type", version: "version", feedbackUrl: "feedbackUrl", testId: "testId", maxContentWidth: "maxContentWidth", feedbackUrlTarget: "feedbackUrlTarget", headerUrlTarget: "headerUrlTarget" }, outputs: { onFeedbackClick: "onFeedbackClick" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-microsite-header
         [attr.type]="type"
@@ -4593,7 +4595,7 @@ class GoabMicrositeHeader {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabMicrositeHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabMicrositeHeader, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4620,7 +4622,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     imports: [NgTemplateOutlet],
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input,
                 args: [{ required: true }]
             }], version: [{
@@ -4640,8 +4642,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabModal {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.closable = false;
@@ -4666,8 +4668,8 @@ class GoabModal {
     _onClose() {
         this.onClose.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabModal, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabModal, isStandalone: true, selector: "goab-modal", inputs: { calloutVariant: "calloutVariant", open: ["open", "open", booleanAttribute], maxWidth: "maxWidth", closable: "closable", transition: "transition", testId: "testId", role: "role", heading: "heading", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabModal, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabModal, isStandalone: true, selector: "goab-modal", inputs: { calloutVariant: "calloutVariant", open: ["open", "open", booleanAttribute], maxWidth: "maxWidth", closable: "closable", transition: "transition", testId: "testId", role: "role", heading: "heading", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-modal
         [attr.version]="version"
@@ -4698,7 +4700,7 @@ class GoabModal {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabModal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabModal, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4736,7 +4738,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { calloutVariant: [{
+        }], propDecorators: { calloutVariant: [{
                 type: Input
             }], open: [{
                 type: Input,
@@ -4767,8 +4769,8 @@ class GoabMenuButton {
         const detail = e.detail;
         this.onAction.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabMenuButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabMenuButton, isStandalone: true, selector: "goab-menu-button", inputs: { text: "text", type: "type", size: "size", variant: "variant", maxWidth: "maxWidth", leadingIcon: "leadingIcon", ariaLabel: "ariaLabel", testId: "testId" }, outputs: { onAction: "onAction" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabMenuButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabMenuButton, isStandalone: true, selector: "goab-menu-button", inputs: { text: "text", type: "type", size: "size", variant: "variant", maxWidth: "maxWidth", leadingIcon: "leadingIcon", ariaLabel: "ariaLabel", testId: "testId" }, outputs: { onAction: "onAction" }, ngImport: i0, template: `
     <goa-menu-button
       [attr.text]="text"
       [attr.type]="type"
@@ -4785,7 +4787,7 @@ class GoabMenuButton {
     </goa-menu-button>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabMenuButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabMenuButton, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4829,8 +4831,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabMenuAction {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabMenuAction, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: GoabMenuAction, isStandalone: true, selector: "goab-menu-action", inputs: { text: "text", action: "action", icon: "icon", testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabMenuAction, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: GoabMenuAction, isStandalone: true, selector: "goab-menu-action", inputs: { text: "text", action: "action", icon: "icon", testId: "testId" }, ngImport: i0, template: `
     <goa-menu-action
       [attr.text]="text"
       [attr.action]="action"
@@ -4840,7 +4842,7 @@ class GoabMenuAction {
     </goa-menu-action>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabMenuAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabMenuAction, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4869,8 +4871,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabNotification {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.type = "information";
@@ -4886,8 +4888,8 @@ class GoabNotification {
     _onDismiss() {
         this.onDismiss.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabNotification, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabNotification, isStandalone: true, selector: "goab-notification", inputs: { type: "type", ariaLive: "ariaLive", maxContentWidth: "maxContentWidth", emphasis: "emphasis", compact: ["compact", "compact", booleanAttribute], testId: "testId" }, outputs: { onDismiss: "onDismiss" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabNotification, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabNotification, isStandalone: true, selector: "goab-notification", inputs: { type: "type", ariaLive: "ariaLive", maxContentWidth: "maxContentWidth", emphasis: "emphasis", compact: ["compact", "compact", booleanAttribute], testId: "testId" }, outputs: { onDismiss: "onDismiss" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-notification
         [attr.version]="version"
@@ -4904,7 +4906,7 @@ class GoabNotification {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabNotification, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4927,7 +4929,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], ariaLive: [{
                 type: Input
@@ -4945,8 +4947,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabPageBlock {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -4955,8 +4957,8 @@ class GoabPageBlock {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPageBlock, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabPageBlock, isStandalone: true, selector: "goab-page-block", inputs: { width: "width", testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPageBlock, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabPageBlock, isStandalone: true, selector: "goab-page-block", inputs: { width: "width", testId: "testId" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-page-block [attr.width]="width" [attr.testid]="testId">
         <ng-content></ng-content>
@@ -4964,7 +4966,7 @@ class GoabPageBlock {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPageBlock, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPageBlock, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -4978,16 +4980,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { width: [{
+        }], propDecorators: { width: [{
                 type: Input
             }], testId: [{
                 type: Input
             }] } });
 
 class GoabPages extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -4996,8 +4998,8 @@ class GoabPages extends GoabBaseComponent {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPages, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabPages, isStandalone: true, selector: "goab-pages", inputs: { current: ["current", "current", numberAttribute] }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPages, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabPages, isStandalone: true, selector: "goab-pages", inputs: { current: ["current", "current", numberAttribute] }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-pages
         [attr.current]="current"
@@ -5011,7 +5013,7 @@ class GoabPages extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPages, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPages, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5031,15 +5033,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { current: [{
+        }], propDecorators: { current: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]
             }] } });
 
 class GoabPagination extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.perPageCount = 10;
@@ -5056,8 +5058,8 @@ class GoabPagination extends GoabBaseComponent {
         const detail = e.detail;
         this.onChange.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPagination, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabPagination, isStandalone: true, selector: "goab-pagination", inputs: { itemCount: "itemCount", pageNumber: "pageNumber", perPageCount: "perPageCount", variant: "variant" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPagination, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabPagination, isStandalone: true, selector: "goab-pagination", inputs: { itemCount: "itemCount", pageNumber: "pageNumber", perPageCount: "perPageCount", variant: "variant" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-pagination
         [attr.version]="version"
@@ -5076,7 +5078,7 @@ class GoabPagination extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPagination, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPagination, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5101,7 +5103,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { itemCount: [{
+        }], propDecorators: { itemCount: [{
                 type: Input,
                 args: [{ required: true }]
             }], pageNumber: [{
@@ -5116,9 +5118,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabPopover extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.maxWidth = "320px";
         this.padded = true;
@@ -5129,8 +5131,8 @@ class GoabPopover extends GoabBaseComponent {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPopover, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabPopover, isStandalone: true, selector: "goab-popover", inputs: { maxWidth: "maxWidth", minWidth: "minWidth", padded: "padded", position: "position", relative: "relative", target: "target" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPopover, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabPopover, isStandalone: true, selector: "goab-popover", inputs: { maxWidth: "maxWidth", minWidth: "minWidth", padded: "padded", position: "position", relative: "relative", target: "target" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-popover
         [attr.maxwidth]="maxWidth"
@@ -5152,7 +5154,7 @@ class GoabPopover extends GoabBaseComponent {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPopover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPopover, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5181,7 +5183,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { maxWidth: [{
+        }], propDecorators: { maxWidth: [{
                 type: Input
             }], minWidth: [{
                 type: Input
@@ -5197,8 +5199,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabPushDrawer {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.version = "2";
         this.onClose = new EventEmitter();
         this.isReady = false;
@@ -5220,8 +5222,8 @@ class GoabPushDrawer {
             return null;
         return this.heading instanceof TemplateRef ? this.heading : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPushDrawer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabPushDrawer, isStandalone: true, selector: "goab-push-drawer", inputs: { open: ["open", "open", booleanAttribute], heading: "heading", width: "width", testId: "testId", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `@if (isReady) {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPushDrawer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabPushDrawer, isStandalone: true, selector: "goab-push-drawer", inputs: { open: ["open", "open", booleanAttribute], heading: "heading", width: "width", testId: "testId", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `@if (isReady) {
     <goa-push-drawer
       [open]="open"
       [attr.heading]="getHeadingAsString()"
@@ -5242,7 +5244,7 @@ class GoabPushDrawer {
     </goa-push-drawer>
   } `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabPushDrawer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabPushDrawer, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5270,7 +5272,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   } `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { open: [{
+        }], propDecorators: { open: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
             }], heading: [{
@@ -5286,9 +5288,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabRadioGroup extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.size = "default";
@@ -5309,8 +5311,8 @@ class GoabRadioGroup extends GoabControlValueAccessor {
         this.onChange.emit(detail);
         this.fcChange?.(detail.value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabRadioGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabRadioGroup, isStandalone: true, selector: "goab-radio-group", inputs: { name: "name", orientation: "orientation", ariaLabel: "ariaLabel", size: "size" }, outputs: { onChange: "onChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabRadioGroup, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabRadioGroup, isStandalone: true, selector: "goab-radio-group", inputs: { name: "name", orientation: "orientation", ariaLabel: "ariaLabel", size: "size" }, outputs: { onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -5341,7 +5343,7 @@ class GoabRadioGroup extends GoabControlValueAccessor {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabRadioGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabRadioGroup, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5379,7 +5381,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], orientation: [{
                 type: Input
@@ -5392,9 +5394,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabRadioItem extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -5416,8 +5418,8 @@ class GoabRadioItem extends GoabBaseComponent {
             return null;
         return this.description instanceof TemplateRef ? this.description : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabRadioItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabRadioItem, isStandalone: true, selector: "goab-radio-item", inputs: { value: "value", label: "label", name: "name", description: "description", reveal: "reveal", ariaLabel: "ariaLabel", revealAriaLabel: "revealAriaLabel", disabled: ["disabled", "disabled", booleanAttribute], checked: ["checked", "checked", booleanAttribute], error: ["error", "error", booleanAttribute], maxWidth: "maxWidth", compact: ["compact", "compact", booleanAttribute] }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabRadioItem, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabRadioItem, isStandalone: true, selector: "goab-radio-item", inputs: { value: "value", label: "label", name: "name", description: "description", reveal: "reveal", ariaLabel: "ariaLabel", revealAriaLabel: "revealAriaLabel", disabled: ["disabled", "disabled", booleanAttribute], checked: ["checked", "checked", booleanAttribute], error: ["error", "error", booleanAttribute], maxWidth: "maxWidth", compact: ["compact", "compact", booleanAttribute] }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-radio-item
         [attr.version]="version"
@@ -5450,7 +5452,7 @@ class GoabRadioItem extends GoabBaseComponent {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabRadioItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabRadioItem, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5490,7 +5492,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     imports: [NgTemplateOutlet],
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { value: [{
+        }], propDecorators: { value: [{
                 type: Input
             }], label: [{
                 type: Input
@@ -5521,8 +5523,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabSideMenu {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -5532,8 +5534,8 @@ class GoabSideMenu {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSideMenu, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabSideMenu, isStandalone: true, selector: "goab-side-menu", inputs: { testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSideMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabSideMenu, isStandalone: true, selector: "goab-side-menu", inputs: { testId: "testId" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-side-menu [attr.version]="version" [attr.testid]="testId">
         <ng-content />
@@ -5541,7 +5543,7 @@ class GoabSideMenu {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSideMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSideMenu, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5555,14 +5557,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { testId: [{
+        }], propDecorators: { testId: [{
                 type: Input
             }] } });
 
 class GoabSideMenuGroup extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -5572,8 +5574,8 @@ class GoabSideMenuGroup extends GoabBaseComponent {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSideMenuGroup, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabSideMenuGroup, isStandalone: true, selector: "goab-side-menu-group", inputs: { heading: "heading", icon: "icon" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSideMenuGroup, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabSideMenuGroup, isStandalone: true, selector: "goab-side-menu-group", inputs: { heading: "heading", icon: "icon" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-side-menu-group
         [attr.version]="version"
@@ -5590,7 +5592,7 @@ class GoabSideMenuGroup extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSideMenuGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSideMenuGroup, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5613,7 +5615,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input,
                 args: [{ required: true }]
             }], icon: [{
@@ -5621,8 +5623,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabSideMenuHeading {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -5632,8 +5634,8 @@ class GoabSideMenuHeading {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSideMenuHeading, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabSideMenuHeading, isStandalone: true, selector: "goab-side-menu-heading", inputs: { icon: "icon", testId: "testId", meta: "meta" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSideMenuHeading, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabSideMenuHeading, isStandalone: true, selector: "goab-side-menu-heading", inputs: { icon: "icon", testId: "testId", meta: "meta" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-side-menu-heading
         [attr.version]="version"
@@ -5648,7 +5650,7 @@ class GoabSideMenuHeading {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSideMenuHeading, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSideMenuHeading, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5670,7 +5672,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { icon: [{
+        }], propDecorators: { icon: [{
                 type: Input
             }], testId: [{
                 type: Input
@@ -5679,9 +5681,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabSkeleton extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.maxWidth = "300px";
     }
@@ -5691,8 +5693,8 @@ class GoabSkeleton extends GoabBaseComponent {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSkeleton, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabSkeleton, isStandalone: true, selector: "goab-skeleton", inputs: { type: "type", maxWidth: "maxWidth", size: "size", lineCount: ["lineCount", "lineCount", numberAttribute] }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSkeleton, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabSkeleton, isStandalone: true, selector: "goab-skeleton", inputs: { type: "type", maxWidth: "maxWidth", size: "size", lineCount: ["lineCount", "lineCount", numberAttribute] }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-skeleton
         [attr.maxwidth]="maxWidth"
@@ -5709,7 +5711,7 @@ class GoabSkeleton extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSkeleton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSkeleton, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5732,7 +5734,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input,
                 args: [{ required: true }]
             }], maxWidth: [{
@@ -5745,8 +5747,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabSpacer {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -5755,8 +5757,8 @@ class GoabSpacer {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSpacer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabSpacer, isStandalone: true, selector: "goab-spacer", inputs: { hSpacing: "hSpacing", vSpacing: "vSpacing", testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSpacer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabSpacer, isStandalone: true, selector: "goab-spacer", inputs: { hSpacing: "hSpacing", vSpacing: "vSpacing", testId: "testId" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-spacer
         [attr.hspacing]="hSpacing"
@@ -5767,7 +5769,7 @@ class GoabSpacer {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabSpacer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabSpacer, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5784,7 +5786,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { hSpacing: [{
+        }], propDecorators: { hSpacing: [{
                 type: Input
             }], vSpacing: [{
                 type: Input
@@ -5793,8 +5795,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTab {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -5811,8 +5813,8 @@ class GoabTab {
             return null;
         return this.heading instanceof TemplateRef ? this.heading : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTab, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTab, isStandalone: true, selector: "goab-tab", inputs: { heading: "heading", disabled: ["disabled", "disabled", booleanAttribute], slug: "slug" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTab, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTab, isStandalone: true, selector: "goab-tab", inputs: { heading: "heading", disabled: ["disabled", "disabled", booleanAttribute], slug: "slug" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-tab
         [attr.slug]="slug"
@@ -5829,7 +5831,7 @@ class GoabTab {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTab, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTab, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5853,7 +5855,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                     imports: [NgTemplateOutlet],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input
             }], disabled: [{
                 type: Input,
@@ -5863,9 +5865,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTable extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.onSort = new EventEmitter();
@@ -5885,8 +5887,8 @@ class GoabTable extends GoabBaseComponent {
         const detail = e.detail;
         this.onMultiSort.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTable, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTable, isStandalone: true, selector: "goab-table", inputs: { width: "width", variant: "variant", sortMode: "sortMode", striped: ["striped", "striped", booleanAttribute] }, outputs: { onSort: "onSort", onMultiSort: "onMultiSort" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTable, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTable, isStandalone: true, selector: "goab-table", inputs: { width: "width", variant: "variant", sortMode: "sortMode", striped: ["striped", "striped", booleanAttribute] }, outputs: { onSort: "onSort", onMultiSort: "onMultiSort" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-table
         [attr.version]="version"
@@ -5909,7 +5911,7 @@ class GoabTable extends GoabBaseComponent {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTable, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTable, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5938,7 +5940,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { width: [{
+        }], propDecorators: { width: [{
                 type: Input
             }], variant: [{
                 type: Input
@@ -5954,8 +5956,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTableSortHeader {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.direction = "none";
     }
@@ -5965,8 +5967,8 @@ class GoabTableSortHeader {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTableSortHeader, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTableSortHeader, isStandalone: true, selector: "goab-table-sort-header", inputs: { name: "name", direction: "direction", sortOrder: "sortOrder" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTableSortHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTableSortHeader, isStandalone: true, selector: "goab-table-sort-header", inputs: { name: "name", direction: "direction", sortOrder: "sortOrder" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-table-sort-header
         [attr.name]="name"
@@ -5978,7 +5980,7 @@ class GoabTableSortHeader {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTableSortHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTableSortHeader, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -5996,7 +5998,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], direction: [{
                 type: Input
@@ -6005,8 +6007,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTabs {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
         this.onChange = new EventEmitter();
@@ -6021,8 +6023,8 @@ class GoabTabs {
         const detail = e.detail;
         this.onChange.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTabs, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTabs, isStandalone: true, selector: "goab-tabs", inputs: { initialTab: ["initialTab", "initialTab", numberAttribute], testId: "testId", variant: "variant", orientation: "orientation", navigation: "navigation" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTabs, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTabs, isStandalone: true, selector: "goab-tabs", inputs: { initialTab: ["initialTab", "initialTab", numberAttribute], testId: "testId", variant: "variant", orientation: "orientation", navigation: "navigation" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-tabs
         [attr.version]="version"
@@ -6038,7 +6040,7 @@ class GoabTabs {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTabs, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTabs, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6060,7 +6062,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { initialTab: [{
+        }], propDecorators: { initialTab: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]
             }], testId: [{
@@ -6076,8 +6078,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTemporaryNotificationCtrl {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.verticalPosition = "bottom";
         this.horizontalPosition = "center";
@@ -6088,8 +6090,8 @@ class GoabTemporaryNotificationCtrl {
             this.cdr.detectChanges();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTemporaryNotificationCtrl, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTemporaryNotificationCtrl, isStandalone: true, selector: "goab-temporary-notification-ctrl", inputs: { verticalPosition: "verticalPosition", horizontalPosition: "horizontalPosition", testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTemporaryNotificationCtrl, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTemporaryNotificationCtrl, isStandalone: true, selector: "goab-temporary-notification-ctrl", inputs: { verticalPosition: "verticalPosition", horizontalPosition: "horizontalPosition", testId: "testId" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-temp-notification-ctrl
         [attr.vertical-position]="verticalPosition"
@@ -6100,7 +6102,7 @@ class GoabTemporaryNotificationCtrl {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTemporaryNotificationCtrl, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTemporaryNotificationCtrl, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6117,7 +6119,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { verticalPosition: [{
+        }], propDecorators: { verticalPosition: [{
                 type: Input
             }], horizontalPosition: [{
                 type: Input
@@ -6126,6 +6128,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabText {
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        this.isReady = false;
+    }
     /*
       This is necessary because angular outputs two elements, <goab-text> and <goa-text>
       This removes the id from <goa-text> and only outputs it to <goab-text>
@@ -6133,10 +6139,6 @@ class GoabText {
     get hostId() {
         return this.id;
     }
-    constructor(cdr) {
-        this.cdr = cdr;
-        this.isReady = false;
-    }
     ngOnInit() {
         // For Angular 20, we need to delay rendering the web component
         // to ensure all attributes are properly bound before the component initializes
@@ -6145,8 +6147,8 @@ class GoabText {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabText, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabText, isStandalone: true, selector: "goab-text", inputs: { tag: "tag", size: "size", maxWidth: "maxWidth", color: "color", id: "id", mt: "mt", mb: "mb", ml: "ml", mr: "mr" }, host: { properties: { "attr.id": "this.hostId" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabText, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabText, isStandalone: true, selector: "goab-text", inputs: { tag: "tag", size: "size", maxWidth: "maxWidth", color: "color", id: "id", mt: "mt", mb: "mb", ml: "ml", mr: "mr" }, host: { properties: { "attr.id": "this.hostId" } }, ngImport: i0, template: `
     @if (isReady) {
       <goa-text
         [attr.as]="tag"
@@ -6163,7 +6165,7 @@ class GoabText {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabText, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabText, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6186,7 +6188,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { tag: [{
+        }], propDecorators: { tag: [{
                 type: Input
             }], size: [{
                 type: Input
@@ -6210,9 +6212,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTextArea extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.countBy = "";
         this.maxCount = -1;
         this.autoComplete = "on";
@@ -6250,8 +6252,8 @@ class GoabTextArea extends GoabControlValueAccessor {
         this.markAsTouched();
         this.onBlur.emit(detail);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTextArea, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTextArea, isStandalone: true, selector: "goab-textarea", inputs: { name: "name", placeholder: "placeholder", rows: ["rows", "rows", numberAttribute], readOnly: ["readOnly", "readOnly", booleanAttribute], width: "width", ariaLabel: "ariaLabel", countBy: "countBy", maxCount: "maxCount", maxWidth: "maxWidth", autoComplete: "autoComplete", size: "size" }, outputs: { onChange: "onChange", onKeyPress: "onKeyPress", onBlur: "onBlur" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTextArea, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTextArea, isStandalone: true, selector: "goab-textarea", inputs: { name: "name", placeholder: "placeholder", rows: ["rows", "rows", numberAttribute], readOnly: ["readOnly", "readOnly", booleanAttribute], width: "width", ariaLabel: "ariaLabel", countBy: "countBy", maxCount: "maxCount", maxWidth: "maxWidth", autoComplete: "autoComplete", size: "size" }, outputs: { onChange: "onChange", onKeyPress: "onKeyPress", onBlur: "onBlur" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -6289,7 +6291,7 @@ class GoabTextArea extends GoabControlValueAccessor {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTextArea, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTextArea, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6334,7 +6336,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
                 type: Input
             }], placeholder: [{
                 type: Input
@@ -6367,9 +6369,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabTooltip extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -6386,8 +6388,8 @@ class GoabTooltip extends GoabBaseComponent {
             return null;
         return this.content instanceof TemplateRef ? this.content : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTooltip, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabTooltip, isStandalone: true, selector: "goab-tooltip", inputs: { position: "position", content: "content", hAlign: "hAlign", maxWidth: "maxWidth" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTooltip, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabTooltip, isStandalone: true, selector: "goab-tooltip", inputs: { position: "position", content: "content", hAlign: "hAlign", maxWidth: "maxWidth" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-tooltip
         [attr.position]="position"
@@ -6411,7 +6413,7 @@ class GoabTooltip extends GoabBaseComponent {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabTooltip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabTooltip, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6442,7 +6444,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                     imports: [NgTemplateOutlet],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { position: [{
+        }], propDecorators: { position: [{
                 type: Input
             }], content: [{
                 type: Input
@@ -6453,8 +6455,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabWorkSideMenu {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.onToggle = new EventEmitter();
         this.onNavigate = new EventEmitter();
         this.isReady = false;
@@ -6473,8 +6475,8 @@ class GoabWorkSideMenu {
     _onNavigate(e) {
         this.onNavigate.emit(e.detail.url);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideMenu, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabWorkSideMenu, isStandalone: true, selector: "goab-work-side-menu", inputs: { heading: "heading", url: "url", userName: "userName", userSecondaryText: "userSecondaryText", open: ["open", "open", booleanAttribute], testId: "testId", primaryContent: "primaryContent", secondaryContent: "secondaryContent", accountContent: "accountContent" }, outputs: { onToggle: "onToggle", onNavigate: "onNavigate" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabWorkSideMenu, isStandalone: true, selector: "goab-work-side-menu", inputs: { heading: "heading", url: "url", userName: "userName", userSecondaryText: "userSecondaryText", open: ["open", "open", booleanAttribute], testId: "testId", primaryContent: "primaryContent", secondaryContent: "secondaryContent", accountContent: "accountContent" }, outputs: { onToggle: "onToggle", onNavigate: "onNavigate" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-work-side-menu
         [open]="open ?? false"
@@ -6499,7 +6501,7 @@ class GoabWorkSideMenu {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideMenu, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6531,7 +6533,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input,
                 args: [{ required: true }]
             }], url: [{
@@ -6559,8 +6561,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabWorkSideMenuGroup {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -6571,8 +6573,8 @@ class GoabWorkSideMenuGroup {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideMenuGroup, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabWorkSideMenuGroup, isStandalone: true, selector: "goab-work-side-menu-group", inputs: { heading: "heading", icon: "icon", open: ["open", "open", booleanAttribute], testId: "testId" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideMenuGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabWorkSideMenuGroup, isStandalone: true, selector: "goab-work-side-menu-group", inputs: { heading: "heading", icon: "icon", open: ["open", "open", booleanAttribute], testId: "testId" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-work-side-menu-group
         [attr.heading]="heading"
@@ -6585,7 +6587,7 @@ class GoabWorkSideMenuGroup {
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideMenuGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideMenuGroup, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6604,7 +6606,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input,
                 args: [{ required: true }]
             }], icon: [{
@@ -6617,8 +6619,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabWorkSideMenuItem {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.type = "normal";
         this.isReady = false;
     }
@@ -6630,8 +6632,8 @@ class GoabWorkSideMenuItem {
             this.cdr.detectChanges();
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideMenuItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabWorkSideMenuItem, isStandalone: true, selector: "goab-work-side-menu-item", inputs: { label: "label", url: "url", badge: "badge", current: "current", divider: "divider", icon: "icon", testId: "testId", type: "type", popoverContent: "popoverContent" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabWorkSideMenuItem, isStandalone: true, selector: "goab-work-side-menu-item", inputs: { label: "label", url: "url", badge: "badge", current: "current", divider: "divider", icon: "icon", testId: "testId", type: "type", popoverContent: "popoverContent" }, ngImport: i0, template: `
     @if (isReady) {
       <goa-work-side-menu-item
         [attr.label]="label"
@@ -6653,7 +6655,7 @@ class GoabWorkSideMenuItem {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideMenuItem, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -6682,7 +6684,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
+        }], propDecorators: { label: [{
                 type: Input,
                 args: [{ required: true }]
             }], url: [{
@@ -6704,8 +6706,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabWorkSideNotificationItem {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.onClick = new EventEmitter();
         this.isReady = false;
     }
@@ -6718,44 +6720,44 @@ class GoabWorkSideNotificationItem {
     _onClick() {
         this.onClick.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideNotificationItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabWorkSideNotificationItem, isStandalone: true, selector: "goab-work-side-notification-item", inputs: { type: "type", timestamp: "timestamp", title: "title", description: "description", readStatus: "readStatus", priority: "priority", testId: "testId" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideNotificationItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabWorkSideNotificationItem, isStandalone: true, selector: "goab-work-side-notification-item", inputs: { type: "type", timestamp: "timestamp", title: "title", description: "description", readStatus: "readStatus", priority: "priority", testId: "testId" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
     @if (isReady) {
-    <goa-work-side-notification-item
-      [attr.type]="type"
-      [attr.timestamp]="timestamp"
-      [attr.title]="title"
-      [attr.description]="description"
-      [attr.read-status]="readStatus"
-      [attr.priority]="priority"
-      [attr.testid]="testId"
-      (_click)="_onClick()"
-    />
+      <goa-work-side-notification-item
+        [attr.type]="type"
+        [attr.timestamp]="timestamp"
+        [attr.title]="title"
+        [attr.description]="description"
+        [attr.read-status]="readStatus"
+        [attr.priority]="priority"
+        [attr.testid]="testId"
+        (_click)="_onClick()"
+      />
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideNotificationItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideNotificationItem, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
                     selector: "goab-work-side-notification-item", // eslint-disable-line
                     template: `
     @if (isReady) {
-    <goa-work-side-notification-item
-      [attr.type]="type"
-      [attr.timestamp]="timestamp"
-      [attr.title]="title"
-      [attr.description]="description"
-      [attr.read-status]="readStatus"
-      [attr.priority]="priority"
-      [attr.testid]="testId"
-      (_click)="_onClick()"
-    />
+      <goa-work-side-notification-item
+        [attr.type]="type"
+        [attr.timestamp]="timestamp"
+        [attr.title]="title"
+        [attr.description]="description"
+        [attr.read-status]="readStatus"
+        [attr.priority]="priority"
+        [attr.testid]="testId"
+        (_click)="_onClick()"
+      />
     }
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }], timestamp: [{
                 type: Input
@@ -6775,8 +6777,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 class GoabWorkSideNotificationPanel {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.onMarkAllRead = new EventEmitter();
         this.onViewAll = new EventEmitter();
         this.isReady = false;
@@ -6793,42 +6795,42 @@ class GoabWorkSideNotificationPanel {
     _onViewAll() {
         this.onViewAll.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideNotificationPanel, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: GoabWorkSideNotificationPanel, isStandalone: true, selector: "goab-work-side-notification-panel", inputs: { heading: "heading", activeTab: "activeTab", testId: "testId" }, outputs: { onMarkAllRead: "onMarkAllRead", onViewAll: "onViewAll" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideNotificationPanel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GoabWorkSideNotificationPanel, isStandalone: true, selector: "goab-work-side-notification-panel", inputs: { heading: "heading", activeTab: "activeTab", testId: "testId" }, outputs: { onMarkAllRead: "onMarkAllRead", onViewAll: "onViewAll" }, ngImport: i0, template: `
     @if (isReady) {
-    <goa-work-side-notification-panel
-      [attr.heading]="heading"
-      [attr.active-tab]="activeTab"
-      [attr.testid]="testId"
-      (_markAllRead)="_onMarkAllRead()"
-      (_viewAll)="_onViewAll()"
-    >
-      <ng-content />
-    </goa-work-side-notification-panel>
+      <goa-work-side-notification-panel
+        [attr.heading]="heading"
+        [attr.active-tab]="activeTab"
+        [attr.testid]="testId"
+        (_markAllRead)="_onMarkAllRead()"
+        (_viewAll)="_onViewAll()"
+      >
+        <ng-content />
+      </goa-work-side-notification-panel>
     }
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: GoabWorkSideNotificationPanel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabWorkSideNotificationPanel, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
                     selector: "goab-work-side-notification-panel", // eslint-disable-line
                     template: `
     @if (isReady) {
-    <goa-work-side-notification-panel
-      [attr.heading]="heading"
-      [attr.active-tab]="activeTab"
-      [attr.testid]="testId"
-      (_markAllRead)="_onMarkAllRead()"
-      (_viewAll)="_onViewAll()"
-    >
-      <ng-content />
-    </goa-work-side-notification-panel>
+      <goa-work-side-notification-panel
+        [attr.heading]="heading"
+        [attr.active-tab]="activeTab"
+        [attr.testid]="testId"
+        (_markAllRead)="_onMarkAllRead()"
+        (_viewAll)="_onViewAll()"
+      >
+        <ng-content />
+      </goa-work-side-notification-panel>
     }
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+        }], propDecorators: { heading: [{
                 type: Input
             }], activeTab: [{
                 type: Input