@abgov/angular-components 5.0.0 → 5.2.0-dev.1

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],
@@ -230,11 +232,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 }]
         }] });
 
+/** Provides shared margin and test id inputs for Angular GoA wrapper components. */
 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 +302,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 +317,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 +363,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,
@@ -384,10 +387,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: ["goaComponentRef", { static: false, read: ElementRef }]
             }] } });
 
+/** Let users show and hide sections of related content on a page. */
 class GoabAccordion extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Emits when the accordion opens or closes. Emits the new open state as a boolean. */
         this.onChange = new EventEmitter();
         this.isReady = false;
     }
@@ -403,8 +408,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 +433,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 +464,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
@@ -478,11 +483,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Small labels which hold small amounts of information, system feedback, or states. */
 class GoabBadge extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the size of the badge. @default "medium" */
         this.size = "medium";
+        /** Sets the visual emphasis. 'subtle' for less prominent, 'strong' for more emphasis. @default "strong" */
         this.emphasis = "strong";
         this.isReady = false;
         this.version = "2";
@@ -495,8 +503,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 +525,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 +547,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
@@ -556,10 +564,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Group components into a block with consistent space between. */
 class GoabBlock extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -570,8 +579,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 +600,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 +626,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
@@ -631,11 +640,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Carry out an important action or navigate to another page. */
 class GoabButton extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the visual style of the button. Use "primary" for main actions, "secondary" for alternative actions, "tertiary" for low-emphasis actions, "start" for prominent call-to-action buttons, and "text" for text-only buttons. @default "primary" */
         this.type = "primary";
+        /** Emits when the button is clicked. */
         this.onClick = new EventEmitter();
         this.isReady = false;
         this.version = "2";
@@ -652,8 +664,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 +691,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 +723,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
@@ -736,10 +748,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Display multiple related actions stacked or in a horizontal row to help with arrangement and spacing. */
 class GoabButtonGroup extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -750,8 +763,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 +780,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 +802,23 @@ 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
             }] } });
 
+/** Visual calendar for date selection. */
 class GoabCalendar extends GoabBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        this.version = "2";
+        /** Emits when the selected date changes. Emits the selected date details as GoabCalendarOnChangeDetail. */
+        this.onChange = new EventEmitter();
+        this.isReady = false;
+        this.once = new Once();
+    }
     formatValue(param, val) {
         if (!val)
             return "";
@@ -813,14 +836,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 +848,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 +869,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 +895,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
@@ -892,17 +907,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Communicate important information through a strong visual emphasis. */
 class GoabCallout extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Define the context and colour of the callout. @default "information" */
         this.type = "information";
+        /** Callout heading text. */
         this.heading = "";
+        /** Sets the size of the callout. 'medium' has reduced padding and type size for compact areas. @default "large" */
         this.size = "large";
+        /** Indicates how assistive technology should handle updates to the live region. @default "off" */
         this.ariaLive = "off";
+        /** Sets the icon theme. 'outline' for stroked icons, 'filled' for solid icons. @default "outline" */
         this.iconTheme = "outline";
+        /** Sets the visual prominence. 'high' for full background, 'medium' for subtle, 'low' for minimal. @default "medium" */
         this.emphasis = "medium";
     }
     ngOnInit() {
@@ -913,8 +935,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 +958,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 +986,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
@@ -980,10 +1002,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** A container that groups related content and actions. */
 class GoabCard extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -994,8 +1017,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 +1034,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,16 +1056,17 @@ 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: [{
                 type: Input
             }] } });
 
+/** A container that groups related content and actions. */
 class GoabCardContent {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1053,8 +1077,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 +1086,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 +1100,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
+/** A container that groups related content and actions. */
 class GoabCardActions {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1091,8 +1116,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 +1125,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 +1139,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
+/** A container that groups related content and actions. */
 class GoabCardImage {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1129,8 +1155,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 +1164,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 +1178,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: [{
@@ -1160,13 +1186,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ required: true }]
             }] } });
 
+/** Let the user select one or more options. */
 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";
+        /** Sets the size of the checkbox. 'compact' reduces spacing for dense layouts. @default "default" */
         this.size = "default";
+        /** Emits when the checkbox value changes. Emits the new checkbox state as a GoabCheckboxOnChangeDetail object. */
         this.onChange = new EventEmitter();
     }
     ngOnInit() {
@@ -1201,8 +1230,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 +1273,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 +1323,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,
@@ -1322,13 +1351,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A multiple selection input. */
 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";
+        /** Sets the size of the checkbox list. 'compact' reduces spacing between items. @default "default" */
         this.size = "default";
+        /** Emits when a checkbox selection changes. Emits the change detail including name, value array, and event. */
         this.onChange = new EventEmitter();
     }
     ngOnInit() {
@@ -1355,8 +1387,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 +1415,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 +1449,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
@@ -1429,12 +1461,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Compact element for labels, tags, or selections. */
 class GoabChip extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** @deprecated Use GoabFilterChip (goab-filter-chip) instead. The text content displayed in the chip. */
         this.content = "";
+        /** Emits when the chip is clicked. */
         this.onClick = new EventEmitter();
     }
     ngOnInit() {
@@ -1448,8 +1483,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 +1503,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 +1528,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,
@@ -1511,9 +1546,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Provide feedback of progress to users while loading. */
 class GoabCircularProgress {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1524,8 +1560,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 +1575,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 +1595,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
@@ -1575,9 +1611,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Organizes page content in one, two, or three responsive columns. */
 class GoabColumnLayout {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         /** no props **/
         this.isReady = false;
     }
@@ -1589,8 +1626,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 +1635,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,15 +1649,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
+/** Group information, create hierarchy, and show related information. */
 class GoabContainer extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the container and accent bar styling. @default "interactive" */
         this.type = "interactive";
+        /** Sets the style of accent on the container. @default "filled" */
         this.accent = "filled";
+        /** Sets the amount of white space in the container. @default "relaxed" */
         this.padding = "relaxed";
+        /** Sets the width of the container. @default "full" */
         this.width = "full";
         this.isReady = false;
     }
@@ -1632,8 +1674,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 +1704,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 +1740,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
@@ -1718,10 +1760,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Advanced table with sorting and selection. */
 class GoabDataGrid {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Controls visibility of the keyboard navigation indicator icon. Use "visible" to show or "hidden" to hide. @default "visible" */
         this.keyboardIconVisibility = "visible";
+        /** Position of the keyboard navigation indicator icon. @default "left" */
         this.keyboardIconPosition = "left";
         this.isReady = false;
     }
@@ -1733,8 +1778,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 +1791,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 +1809,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
@@ -1773,7 +1818,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ required: true }]
             }] } });
 
+/** Lets users select a date through a calendar without the need to manually type it in a field. */
 class GoabDatePicker extends GoabControlValueAccessor {
+    constructor() {
+        super(...arguments);
+        this.elementRef = inject(ElementRef);
+        this.cdr = inject(ChangeDetectorRef);
+        this.isReady = false;
+        this.version = "2";
+        /** Emits when the selected date changes. Emits the date picker change detail including name and value. */
+        this.onChange = new EventEmitter();
+        this.once = new Once();
+    }
     formatValue(param, val) {
         if (!val)
             return "";
@@ -1800,15 +1856,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 +1887,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 +1917,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 +1953,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
@@ -1927,10 +1974,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: ["disabledChange", ["$event"]]
             }] } });
 
+/** Let users reveal more detailed information when they need it. */
 class GoabDetails extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -1941,8 +1989,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 +2007,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 +2030,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: [{
@@ -1992,10 +2040,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Indicate a separation of layout, or to distinguish large chunks of information on a page. */
 class GoabDivider extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -2006,8 +2055,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 +2069,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,12 +2088,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+        }] });
 
+/** A panel that slides in from the side of the screen to display additional content or actions without navigating away from the current view. */
 class GoabDrawer {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.version = "2";
+        /** Emits when the drawer is closed. */
         this.onClose = new EventEmitter();
         this.isReady = false;
     }
@@ -2067,8 +2118,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 +2139,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 +2166,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: [{
@@ -2134,11 +2185,14 @@ 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
+/** Present a list of options to the user to select from. */
 class GoabDropdown extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the size of the dropdown. Compact reduces height for dense layouts. @default "default" */
         this.size = "default";
+        /** Emits when the user selects a value from the dropdown. Emits a GoabDropdownOnChangeDetail object with the new value. */
         this.onChange = new EventEmitter();
         this.isReady = false;
         this.version = "2";
@@ -2159,8 +2213,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 +2255,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 +2303,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
@@ -2284,9 +2338,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Present a list of options to the user to select from. */
 class GoabDropdownItem {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -2297,8 +2352,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 +2364,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 +2381,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
@@ -2338,10 +2393,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Display uploaded file with actions. */
 class GoabFileUploadCard {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Emits when the user cancels a file upload. Emits a GoabFileUploadOnCancelDetail object with the filename. */
         this.onCancel = new EventEmitter();
+        /** Emits when the user removes an uploaded file. Emits a GoabFileUploadOnDeleteDetail object with the filename. */
         this.onDelete = new EventEmitter();
         this.isReady = false;
         this.version = "2";
@@ -2360,8 +2418,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 +2434,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,12 +2455,12 @@ 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: [{
                 type: Input,
-                args: [{ transform: numberAttribute }]
+                args: [{ required: true, transform: numberAttribute }]
             }], type: [{
                 type: Input
             }], progress: [{
@@ -2418,12 +2476,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Help users select and upload a file. */
 class GoabFileUploadInput extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the id attribute on the file upload input element. */
         this.id = "";
+        /** Maximum file size with unit (e.g., "5MB", "100KB", "1GB"). Files exceeding this will be rejected. @default "5MB" */
         this.maxFileSize = "5MB";
+        /** Emits when a file is selected. Emits the selected file details. */
         this.onSelectFile = new EventEmitter();
         this.isReady = false;
         this.version = "2";
@@ -2443,8 +2505,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 +2523,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,11 +2546,10 @@ 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,
-                args: [{ required: true }]
+                type: Input
             }], maxFileSize: [{
                 type: Input
             }], accept: [{
@@ -2497,13 +2558,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Allow the user to enter information, filter content, and make selections. */
 class GoabFilterChip extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Text label of the chip. */
         this.content = "";
+        /** Secondary text displayed in a smaller size before the main content. */
         this.secondaryText = "";
+        /** Icon displayed at the start of the chip. */
         this.leadingIcon = null;
+        /** Emits when the filter chip delete button is clicked. */
         this.onClick = new EventEmitter();
         this.isReady = false;
         this.version = "2";
@@ -2519,8 +2585,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 +2605,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 +2630,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: [{
@@ -2582,9 +2648,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Provides information related your service at the bottom of every page. */
 class GoabAppFooter {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -2596,8 +2663,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 +2677,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 +2696,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
@@ -2637,9 +2704,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Copyright and legal links in footer. */
 class GoabAppFooterMetaSection {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -2650,30 +2718,32 @@ 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,
                 args: [{ required: true }]
             }] } });
 
+/** Navigation links section in footer. */
 class GoabAppFooterNavSection {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Maximum number of columns to display links in on larger screens. @default 1 */
         this.maxColumnCount = 1;
         this.isReady = false;
     }
@@ -2685,8 +2755,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 +2766,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 +2777,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
@@ -2718,11 +2788,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ required: true }]
             }] } });
 
+/** Container for form inputs and validation. */
 class GoabPublicForm {
     constructor() {
+        /** The initialization status of the form. Set to "initializing" while loading external state, then "complete" when ready. @default "complete" */
         this.status = "complete";
+        /** Emits when the form is initialized. */
         this.onInit = new EventEmitter();
+        /** Emits when the form is complete. Emits the form state. */
         this.onComplete = new EventEmitter();
+        /** Emits when the form state changes. Emits the updated form state. */
         this.onStateChange = new EventEmitter();
     }
     _onInit(e) {
@@ -2736,8 +2811,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 +2824,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",
@@ -2779,28 +2854,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Container for form inputs and validation. */
 class GoabPublicFormPage extends GoabBaseComponent {
     constructor() {
         super(...arguments);
+        /** Sets the id of the form page. */
         this.id = "";
+        /** Sets the main heading text of the form page. */
         this.heading = "";
+        /** Sets the sub-heading text displayed below the main heading. */
         this.subHeading = "";
+        /** Sets the heading used in the summary view for this page. */
         this.summaryHeading = "";
+        /** Sets the section title displayed above the heading. */
         this.sectionTitle = "";
+        /** Sets the URL for the back navigation link. */
         this.backUrl = "";
+        /** Sets the type of the form page step. @default "step" */
         this.type = "step";
+        /** Sets the text for the continue or confirm button. */
         this.buttonText = "";
+        /** Sets the visibility of the continue button. @default "visible" */
         this.buttonVisibility = "visible";
-        /**
-         * triggers when the form page continues to the next step
-         */
+        /** Emits when the form page continues to the next step. */
         this.onContinue = new EventEmitter();
     }
     _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 +2904,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",
@@ -2870,15 +2953,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Container for form inputs and validation. */
 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",
@@ -2894,13 +2978,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Container for form inputs and validation. */
 class GoabPublicSubform extends GoabBaseComponent {
     constructor() {
         super(...arguments);
+        /** Sets the id of the subform. */
         this.id = "";
+        /** Sets the name identifier for the subform. */
         this.name = "";
+        /** Sets the text for the continue button. */
         this.continueMsg = "";
+        /** Emits when the subform is initialized. */
         this.onInit = new EventEmitter();
+        /** Emits when the subform state changes. */
         this.onStateChange = new EventEmitter();
     }
     _onInit(e) {
@@ -2909,8 +2999,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 +3016,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",
@@ -2960,16 +3050,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Container for form inputs and validation. */
 class GoabPublicSubformIndex extends GoabBaseComponent {
     constructor() {
         super(...arguments);
+        /** Sets the heading text of the subform index page. */
         this.heading = "";
+        /** Sets the section title displayed above the heading. */
         this.sectionTitle = "";
+        /** Sets the text for the action button that navigates to the subform. */
         this.actionButtonText = "";
+        /** Sets the visibility of the continue button. @default "hidden" */
         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 +3079,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",
@@ -3018,15 +3113,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Container for form inputs and validation. */
 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",
@@ -3042,9 +3138,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Container for form inputs and validation. */
 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 +3153,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",
@@ -3078,17 +3175,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Container for form inputs and validation. */
 class GoabFieldset {
     constructor() {
+        /** Sets when changes will be dispatched to the form. @default "continue" */
         this.dispatchOn = "continue";
+        /** Emits when the fieldset continues to the next step. Emits the continue detail. */
         this.onContinue = new EventEmitter();
     }
     _onContinue(event) {
         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 +3197,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",
@@ -3122,14 +3222,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Wraps an input control with a text label, requirement label, helper text, and error text. */
 class GoabFormItem extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Specifies the input type for appropriate message spacing. Used with checkbox-list or radio-group. */
         this.type = "";
         this.isReady = false;
         this.version = "2";
     }
+    getHelpTextAsString() {
+        return typeof this.helpText === "string" ? this.helpText : undefined;
+    }
+    getHelpTextAsTemplate() {
+        return this.helpText instanceof TemplateRef ? this.helpText : null;
+    }
+    getErrorAsString() {
+        return typeof this.error === "string" ? this.error : undefined;
+    }
+    getErrorAsTemplate() {
+        return this.error instanceof TemplateRef ? this.error : null;
+    }
     ngOnInit() {
         // For Angular 20, we need to delay rendering the web component
         // to ensure all attributes are properly bound before the component initializes
@@ -3138,14 +3252,14 @@ 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"
       [attr.labelsize]="labelSize"
-      [attr.helptext]="helpText"
-      [attr.error]="error"
+      [attr.helptext]="getHelpTextAsString()"
+      [attr.error]="getErrorAsString()"
       [attr.testid]="testId"
       [attr.type]="type"
       [id]="id"
@@ -3158,23 +3272,33 @@ class GoabFormItem extends GoabBaseComponent {
       [attr.mr]="mr"
       [attr.ml]="ml"
     >
+      @if (getErrorAsTemplate()) {
+        <div slot="error">
+          <ng-container [ngTemplateOutlet]="getErrorAsTemplate()"></ng-container>
+        </div>
+      }
+      @if (getHelpTextAsTemplate()) {
+        <div slot="helptext">
+          <ng-container [ngTemplateOutlet]="getHelpTextAsTemplate()"></ng-container>
+        </div>
+      }
       <ng-content />
-      <ng-content select="goab-form-item-slot"></ng-content>
     </goa-form-item>
-  }`, isInline: true }); }
+  }`, 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: GoabFormItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GoabFormItem, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
                     selector: "goab-form-item",
+                    imports: [NgTemplateOutlet],
                     template: `@if (isReady) {
     <goa-form-item
       [attr.version]="version"
       [attr.label]="label"
       [attr.labelsize]="labelSize"
-      [attr.helptext]="helpText"
-      [attr.error]="error"
+      [attr.helptext]="getHelpTextAsString()"
+      [attr.error]="getErrorAsString()"
       [attr.testid]="testId"
       [attr.type]="type"
       [id]="id"
@@ -3187,13 +3311,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
       [attr.mr]="mr"
       [attr.ml]="ml"
     >
+      @if (getErrorAsTemplate()) {
+        <div slot="error">
+          <ng-container [ngTemplateOutlet]="getErrorAsTemplate()"></ng-container>
+        </div>
+      }
+      @if (getHelpTextAsTemplate()) {
+        <div slot="helptext">
+          <ng-container [ngTemplateOutlet]="getHelpTextAsTemplate()"></ng-container>
+        </div>
+      }
       <ng-content />
-      <ng-content select="goab-form-item-slot"></ng-content>
     </goa-form-item>
   }`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
+        }], propDecorators: { label: [{
                 type: Input
             }], labelSize: [{
                 type: Input
@@ -3216,16 +3349,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }] } });
 
 /**
- * This component is used to define the slot for the form item component.
- * We need to use a separate component with a required attribute `slot` because
- * svelte component renders based on the `slot` of the wrapper component (which is `div` before)
- * // similar to app-footer-meta-section & app-footer-nav-section
+ * @deprecated Use `TemplateRef` inputs on `goab-form-item` (`[helpText]` / `[error]`) instead.
  */
 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,
@@ -3237,9 +3367,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ required: true }]
             }] } });
 
+/** Individual step in a multi-step form. */
 class GoabFormStep {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3248,14 +3379,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,17 +3398,20 @@ 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
             }] } });
 
+/** Provides a visual representation of a form through a series of steps. */
 class GoabFormStepper extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** The current step state value (1-based index). Leaving it blank (-1) will allow any step to be accessed. @default -1 */
         this.step = -1;
+        /** Emits when the form stepper step changes. Emits the new step as GoabFormStepperOnChangeDetail. */
         this.onChange = new EventEmitter();
         this.isReady = false;
     }
@@ -3291,8 +3425,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 +3442,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 +3464,17 @@ 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
             }] } });
 
+/** Arrange a number of components into a responsive grid pattern. */
 class GoabGrid extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3348,8 +3483,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 +3500,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,19 +3522,20 @@ 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: [{
                 type: Input
             }] } });
 
-class GoabAppHeader extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+/** Provide structure to help users find their way around the service. */
+class GoabAppHeader {
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Emits when the menu button is clicked. Used for custom menu handling. */
         this.onMenuClick = new EventEmitter();
     }
     ngOnInit() {
@@ -3411,8 +3547,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: [], 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], testId: "testId" }, outputs: { onMenuClick: "onMenuClick" }, ngImport: i0, template: `@if (isReady) {
     <goa-app-header
       [attr.url]="url"
       [attr.heading]="heading"
@@ -3428,7 +3564,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 +3586,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
@@ -3461,27 +3597,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             }], fullMenuBreakpoint: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]
+            }], testId: [{
+                type: Input
             }], onMenuClick: [{
                 type: Output
             }] } });
 
-class GoabAppHeaderMenu extends GoabBaseComponent {
+/** Menu items within the app header. */
+class GoabAppHeaderMenu {
+    constructor() {
+        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: [], 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", testId: "testId", slotName: "slotName" }, host: { properties: { "attr.slot": "this.hostSlot" } }, ngImport: i0, template: `@if (isReady) {
     <goa-app-header-menu
       [attr.leadingicon]="leadingIcon"
       [attr.heading]="heading"
@@ -3491,7 +3629,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,10 +3645,12 @@ 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
+            }], testId: [{
+                type: Input
             }], slotName: [{
                 type: Input
             }], hostSlot: [{
@@ -3518,9 +3658,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: ["attr.slot"]
             }] } });
 
+/** A visual band of text, including an image and a call to action. */
 class GoabHeroBanner {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3529,8 +3670,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 +3690,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 +3716,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
@@ -3593,10 +3734,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** A simple and universal graphic symbol representing an action, object, or concept to help guide the user. */
 class GoabIcon extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -3607,8 +3749,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", role: "role" }, usesInheritance: true, ngImport: i0, template: `
     @if (isReady) {
       <goa-icon
         [attr.type]="type"
@@ -3619,6 +3761,7 @@ class GoabIcon extends GoabBaseComponent {
         [attr.opacity]="opacity"
         [attr.title]="title"
         [attr.arialabel]="ariaLabel"
+        [attr.role]="role"
         [attr.mt]="mt"
         [attr.mb]="mb"
         [attr.ml]="ml"
@@ -3629,7 +3772,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) {
@@ -3642,6 +3785,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
         [attr.opacity]="opacity"
         [attr.title]="title"
         [attr.arialabel]="ariaLabel"
+        [attr.role]="role"
         [attr.mt]="mt"
         [attr.mb]="mb"
         [attr.ml]="ml"
@@ -3651,7 +3795,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: [{
@@ -3670,15 +3814,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }], ariaLabel: [{
                 type: Input
+            }], role: [{
+                type: Input
             }] } });
 
+/** A compact button with an icon and no text. */
 class GoabIconButton extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.JSON = JSON;
+        /** Sets the size of button. @default "medium" */
         this.size = "medium";
+        /** Sets the icon theme. "outline" for stroked icons, "filled" for solid icons. @default "outline" */
+        this.theme = "outline";
+        /** Emits when the icon button is clicked. */
         this.onClick = new EventEmitter();
     }
     ngOnInit() {
@@ -3690,13 +3841,14 @@ 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", theme: "theme", 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"
         [disabled]="disabled"
         [attr.size]="size"
+        [attr.theme]="theme"
         [attr.variant]="variant"
         [title]="title"
         [attr.arialabel]="ariaLabel"
@@ -3715,7 +3867,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,
@@ -3726,6 +3878,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
         [attr.icon]="icon"
         [disabled]="disabled"
         [attr.size]="size"
+        [attr.theme]="theme"
         [attr.variant]="variant"
         [title]="title"
         [attr.arialabel]="ariaLabel"
@@ -3745,13 +3898,15 @@ 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: [{
                 type: Input
             }], variant: [{
                 type: Input
+            }], theme: [{
+                type: Input
             }], title: [{
                 type: Input
             }], disabled: [{
@@ -3769,17 +3924,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A single-line field where users can input and edit text. */
 class GoabInput extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the type of the input field. @default "text" */
         this.type = "text";
+        /** Sets the text alignment within the input field. @default "left" */
         this.textAlign = "left";
+        /** Sets the size of the input. 'compact' reduces height for dense layouts. @default "default" */
         this.size = "default";
+        /** Emits when the trailing icon is clicked. */
         this.onTrailingIconClick = new EventEmitter();
+        /** Emits when the input receives focus. Emits focus detail including the current value. */
         this.onFocus = new EventEmitter();
+        /** Emits when the input loses focus. Emits blur detail including the current value. */
         this.onBlur = new EventEmitter();
+        /** Emits when a key is pressed in the input. Emits key press detail including the value and key pressed. */
         this.onKeyPress = new EventEmitter();
+        /** Emits when the input value changes. Emits change detail including the new value. */
         this.onChange = new EventEmitter();
         this.version = "2";
         this.isReady = false;
@@ -3839,8 +4003,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 +4080,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 +4164,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
@@ -4067,17 +4231,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A single-line field where users can input and edit numeric values. */
 class GoabInputNumber {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Sets the type of the input field. @default "number" */
         this.type = "number";
+        /** Sets the text alignment within the input field. @default "right" */
         this.textAlign = "right"; // Default to right for numbers
+        /** Bound to value. */
         this.value = null;
+        /** Emits when the trailing icon is clicked. */
         this.onTrailingIconClick = new EventEmitter(); // Keep void type
+        /** Emits when the input receives focus. Emits focus detail including the current value. */
         this.onFocus = new EventEmitter();
+        /** Emits when the input loses focus. Emits blur detail including the current value. */
         this.onBlur = new EventEmitter();
+        /** Emits when a key is pressed in the input. Emits key press detail including the value and key pressed. */
         this.onKeyPress = new EventEmitter();
+        /** Emits when the input value changes. Emits change detail including the new value. */
         this.onChange = new EventEmitter();
         this.handleTrailingIconClick = false;
         this.touched = false;
@@ -4158,8 +4331,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 +4408,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 +4492,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
@@ -4402,9 +4575,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Provide visual feedback to users while loading. */
 class GoabLinearProgress {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -4415,8 +4589,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 +4603,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 +4622,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
@@ -4460,11 +4634,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Wraps an anchor element to add icons or margins. */
 class GoabLink {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Sets the color theme. 'interactive' for blue, 'dark' for black, 'light' for white text. @default "interactive" */
         this.color = "interactive";
+        /** Sets the text size and corresponding icon size. @default "medium" */
         this.size = "medium";
         this.JSON = JSON;
     }
@@ -4474,8 +4651,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 +4673,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 +4700,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
@@ -4549,10 +4726,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Communicate what stage the service is at, connect to Alberta.ca, and gather feedback on your service. */
 class GoabMicrositeHeader {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Emits when the feedback link is clicked. */
         this.onFeedbackClick = new EventEmitter();
     }
     ngOnInit() {
@@ -4572,8 +4751,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 +4772,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 +4799,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: [{
@@ -4639,12 +4818,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** An overlay that appears in front of all other content, and requires a user to take an action before continuing. */
 class GoabModal {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Show close icon and allow clicking the background to close the modal. */
         this.closable = false;
+        /** Emits when the modal is closed. */
         this.onClose = new EventEmitter();
     }
     ngOnInit() {
@@ -4666,8 +4848,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 +4880,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 +4918,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,
@@ -4759,16 +4941,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A button with more than one action. */
 class GoabMenuButton {
     constructor() {
+        /** Emits when a menu action is clicked. Emits the action detail. */
         this.onAction = new EventEmitter();
     }
     _onAction(e) {
         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 +4969,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,
@@ -4828,9 +5012,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Individual action item within a menu button. */
 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 +5025,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,
@@ -4868,13 +5053,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Display important page level information or notifications. */
 class GoabNotification {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Define the context and colour of the notification. @default "information" */
         this.type = "information";
+        /** Sets the visual prominence. 'high' for full background, 'low' for medium. @default "high" */
         this.emphasis = "high";
+        /** Emits when the notification is dismissed. */
         this.onDismiss = new EventEmitter();
     }
     ngOnInit() {
@@ -4886,8 +5075,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 +5093,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 +5116,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
@@ -4944,9 +5133,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Full-width section with optional background. */
 class GoabPageBlock {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -4955,8 +5145,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 +5154,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 +5168,17 @@ 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
             }] } });
 
+/** Container for paginated content views. */
 class GoabPages extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -4996,8 +5187,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 +5202,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,19 +5222,23 @@ 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 }]
             }] } });
 
+/** Help users navigation between multiple pages or screens as part of a set. */
 class GoabPagination extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Number of data items shown per page. @default 10 */
         this.perPageCount = 10;
+        /** Controls which nav controls are visible. @default "all" */
         this.variant = "all";
+        /** Emits when the page changes. Emits the new page number as part of the change detail. */
         this.onChange = new EventEmitter();
     }
     ngOnInit() {
@@ -5056,8 +5251,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 +5271,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 +5296,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: [{
@@ -5115,12 +5310,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A small overlay that opens on demand, used in other components. */
 class GoabPopover extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Sets the maximum width of the popover container. @default "320px" */
         this.maxWidth = "320px";
+        /** Sets if the popover has padding. Use false when content needs to be flush with boundaries. @default true */
         this.padded = true;
     }
     ngOnInit() {
@@ -5129,8 +5327,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 +5350,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 +5379,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
@@ -5196,10 +5394,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ required: true }]
             }] } });
 
+/** A panel that pushes the main page content aside on desktop, falling back to an overlay drawer on smaller screens. */
 class GoabPushDrawer {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.version = "2";
+        /** Emits when the push drawer closes. */
         this.onClose = new EventEmitter();
         this.isReady = false;
     }
@@ -5220,8 +5420,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 +5442,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 +5470,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: [{
@@ -5285,13 +5485,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Allow users to select one option from a set. */
 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";
+        /** Sets the size of all radio items. 'compact' reduces spacing for dense layouts (V2 only). @default "default" */
         this.size = "default";
+        /** Emits when the selected radio item changes. Emits the name, value, and event of the selected item. */
         this.onChange = new EventEmitter();
     }
     ngOnInit() {
@@ -5309,8 +5512,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", value: "value", orientation: "orientation", ariaLabel: "ariaLabel", size: "size" }, outputs: { onChange: "onChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
@@ -5341,7 +5544,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 +5582,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+        }], propDecorators: { name: [{
+                type: Input
+            }], value: [{
                 type: Input
             }], orientation: [{
                 type: Input
@@ -5391,10 +5596,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Individual radio option within a group. */
 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 +5622,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 +5656,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 +5696,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
@@ -5520,9 +5726,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ transform: booleanAttribute }]
             }] } });
 
+/** A side navigation that helps the user navigate between pages. */
 class GoabSideMenu {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -5532,8 +5739,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 +5748,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 +5762,15 @@ 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
             }] } });
 
+/** Group of related side menu items. */
 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 +5780,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 +5798,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,16 +5821,17 @@ 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: [{
                 type: Input
             }] } });
 
+/** Section heading in side menu. */
 class GoabSideMenuHeading {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
     }
@@ -5632,8 +5841,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 +5857,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 +5879,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
@@ -5678,11 +5887,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Provide visual feedback to users while loading a content heavy page or page element. */
 class GoabSkeleton extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Sets the maximum width. Currently only used in card skeleton type. @default "300px" */
         this.maxWidth = "300px";
     }
     ngOnInit() {
@@ -5691,8 +5902,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 +5920,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 +5943,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: [{
@@ -5744,9 +5955,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 args: [{ transform: numberAttribute }]
             }] } });
 
+/** Negative area between the components and the interface. */
 class GoabSpacer {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -5755,8 +5967,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 +5979,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 +5996,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
@@ -5792,9 +6004,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Individual tab within a tabs component. */
 class GoabTab {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -5811,8 +6024,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 +6042,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 +6066,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,
@@ -5862,13 +6075,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** A set of structured data that is easy for a user to scan, examine, and compare. */
 class GoabTable extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Emits when a table column is sorted. Emits the sort column and direction as GoabTableOnSortDetail. */
         this.onSort = new EventEmitter();
+        /** Emits when multi-column sorting changes. Emits an array of sort entries as GoabTableOnMultiSortDetail. */
         this.onMultiSort = new EventEmitter();
     }
     ngOnInit() {
@@ -5885,8 +6101,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 +6125,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 +6154,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
@@ -5953,10 +6169,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A set of structured data that is easy for a user to scan, examine, and compare. */
 class GoabTableSortHeader {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Sets the sort direction indicator. @default "none" */
         this.direction = "none";
     }
     ngOnInit() {
@@ -5965,8 +6183,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 +6196,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 +6214,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
@@ -6004,11 +6222,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Let users navigate between related sections of content, displaying one section at a time. */
 class GoabTabs {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
         this.version = "2";
+        /** Emits when the active tab changes. Emits the new tab index as GoabTabsOnChangeDetail. */
         this.onChange = new EventEmitter();
     }
     ngOnInit() {
@@ -6021,8 +6241,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 +6258,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 +6280,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: [{
@@ -6075,11 +6295,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A notification that appears at the bottom of the screen. */
 class GoabTemporaryNotificationCtrl {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
+        /** Vertical position of the notification container. @default "bottom" */
         this.verticalPosition = "bottom";
+        /** Horizontal position of the notification container. @default "center" */
         this.horizontalPosition = "center";
     }
     ngOnInit() {
@@ -6088,8 +6311,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 +6323,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 +6340,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
@@ -6125,7 +6348,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Provides consistent sizing, spacing, and colour to written content. */
 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 +6361,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 +6369,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 +6387,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 +6410,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
@@ -6209,16 +6433,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** A multi-line field where users can input and edit text. */
 class GoabTextArea extends GoabControlValueAccessor {
-    constructor(cdr, renderer) {
-        super(renderer);
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
+        /** Counting interval for characters or words, specifying whether to count every character or word. @default "" */
         this.countBy = "";
+        /** Maximum number of characters or words allowed. @default -1 */
         this.maxCount = -1;
+        /** Specifies the autocomplete attribute for the textarea input. @default "on" */
         this.autoComplete = "on";
+        /** Sets the size variant of the textarea. @default "default" */
         this.size = "default";
+        /** Emits when the textarea value changes. Emits the name and new value. */
         this.onChange = new EventEmitter();
+        /** Emits when a key is pressed in the textarea. Emits the name, value, and key. */
         this.onKeyPress = new EventEmitter();
+        /** Emits when the textarea loses focus. Emits the name and current value. */
         this.onBlur = new EventEmitter();
         this.isReady = false;
         this.version = "2";
@@ -6250,8 +6482,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 +6521,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 +6566,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
@@ -6366,10 +6598,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** A small popover that displays more information about an item. */
 class GoabTooltip extends GoabBaseComponent {
-    constructor(cdr) {
-        super();
-        this.cdr = cdr;
+    constructor() {
+        super(...arguments);
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -6386,8 +6619,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 +6644,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 +6675,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
@@ -6452,10 +6685,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Side menu variant for worker applications. */
 class GoabWorkSideMenu {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Emits when the side menu is toggled open or closed. */
         this.onToggle = new EventEmitter();
+        /** Emits when a navigation link is clicked. Emits the URL as a string. */
         this.onNavigate = new EventEmitter();
         this.isReady = false;
     }
@@ -6473,8 +6709,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 +6735,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 +6767,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: [{
@@ -6558,9 +6794,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Collapsible group of items within the work side menu. */
 class GoabWorkSideMenuGroup {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
         this.isReady = false;
     }
     ngOnInit() {
@@ -6571,8 +6808,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 +6822,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 +6841,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: [{
@@ -6616,9 +6853,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Individual menu item within the work side menu. */
 class GoabWorkSideMenuItem {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Sets the visual style of the badge. Use "emergency" for urgent items, "success" for positive status. @default "normal" */
         this.type = "normal";
         this.isReady = false;
     }
@@ -6630,8 +6869,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 +6892,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 +6921,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: [{
@@ -6703,9 +6942,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }] } });
 
+/** Displays an individual notification item in the work-side notification panel. */
 class GoabWorkSideNotificationItem {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Emits when the notification item is clicked. */
         this.onClick = new EventEmitter();
         this.isReady = false;
     }
@@ -6718,44 +6959,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
@@ -6774,10 +7015,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Output
             }] } });
 
+/** Displays a panel of work-side notifications. */
 class GoabWorkSideNotificationPanel {
-    constructor(cdr) {
-        this.cdr = cdr;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        /** Emits when the user clicks "Mark all as read". */
         this.onMarkAllRead = new EventEmitter();
+        /** Emits when the user clicks "View all". */
         this.onViewAll = new EventEmitter();
         this.isReady = false;
     }
@@ -6793,42 +7037,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