@abgov/angular-components 4.10.0 → 4.11.0-dev.2

package/fesm2022/abgov-angular-components.mjs

@@ -210,11 +210,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }] });
 
-class GoabBaseComponent {
+let GoabBaseComponent$1 = class GoabBaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", 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: "20.3.16", ngImport: i0, type: GoabBaseComponent, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabBaseComponent$1, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -278,7 +278,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
  * - `fcChange?`: A function to handle changes in the form control value.
  * - `fcTouched?`: A function to handle touch events on the form control.
  */
-class GoabControlValueAccessor extends GoabBaseComponent {
+let GoabControlValueAccessor$1 = class GoabControlValueAccessor extends GoabBaseComponent$1 {
     /**
      * 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`.
@@ -342,8 +342,8 @@ class GoabControlValueAccessor extends GoabBaseComponent {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabControlValueAccessor, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", 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: "20.3.16", ngImport: i0, type: GoabControlValueAccessor, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabControlValueAccessor$1, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -364,7 +364,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: ["goaComponentRef", { static: false, read: ElementRef }]
             }] } });
 
-class GoabAccordion extends GoabBaseComponent {
+class GoabAccordion extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -456,7 +456,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabBadge extends GoabBaseComponent {
+class GoabBadge extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -519,7 +519,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabBlock extends GoabBaseComponent {
+class GoabBlock extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -593,7 +593,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabButton extends GoabBaseComponent {
+class GoabButton extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -694,7 +694,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabButtonGroup extends GoabBaseComponent {
+class GoabButtonGroup extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -752,7 +752,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabCalendar extends GoabBaseComponent {
+class GoabCalendar extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -827,7 +827,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabCallout extends GoabBaseComponent {
+class GoabCallout extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -906,7 +906,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabCard extends GoabBaseComponent {
+class GoabCard extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -1084,7 +1084,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: [{ required: true }]
             }] } });
 
-class GoabCheckbox extends GoabControlValueAccessor {
+class GoabCheckbox extends GoabControlValueAccessor$1 {
     constructor(cdr, renderer) {
         super(renderer);
         this.cdr = cdr;
@@ -1232,7 +1232,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabCheckboxList extends GoabControlValueAccessor {
+class GoabCheckboxList extends GoabControlValueAccessor$1 {
     constructor(cdr, renderer) {
         super(renderer);
         this.cdr = cdr;
@@ -1338,7 +1338,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabChip extends GoabBaseComponent {
+class GoabChip extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -1518,7 +1518,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
 
-class GoabContainer extends GoabBaseComponent {
+class GoabContainer extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -1537,7 +1537,7 @@ class GoabContainer extends GoabBaseComponent {
         }, 0);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabContainer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", 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: `<goa-container
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", 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: `<goa-container
     *ngIf="isReady"
     [attr.type]="type"
     [attr.accent]="accent"
@@ -1552,13 +1552,17 @@ class GoabContainer extends GoabBaseComponent {
     [attr.ml]="ml"
     [attr.mr]="mr"
   >
-    <div slot="title">
-      <ng-container [ngTemplateOutlet]="title"></ng-container>
-    </div>
+    @if (title) {
+      <div slot="title">
+        <ng-container [ngTemplateOutlet]="title"></ng-container>
+      </div>
+    }
     <ng-content />
-    <div slot="actions">
-      <ng-container [ngTemplateOutlet]="actions"></ng-container>
-    </div>
+    @if (actions) {
+      <div slot="actions">
+        <ng-container [ngTemplateOutlet]="actions"></ng-container>
+      </div>
+    }
   </goa-container>`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabContainer, decorators: [{
@@ -1582,13 +1586,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
     [attr.ml]="ml"
     [attr.mr]="mr"
   >
-    <div slot="title">
-      <ng-container [ngTemplateOutlet]="title"></ng-container>
-    </div>
+    @if (title) {
+      <div slot="title">
+        <ng-container [ngTemplateOutlet]="title"></ng-container>
+      </div>
+    }
     <ng-content />
-    <div slot="actions">
-      <ng-container [ngTemplateOutlet]="actions"></ng-container>
-    </div>
+    @if (actions) {
+      <div slot="actions">
+        <ng-container [ngTemplateOutlet]="actions"></ng-container>
+      </div>
+    }
   </goa-container>`,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
@@ -1666,7 +1674,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: [{ required: true }]
             }] } });
 
-class GoabDatePicker extends GoabControlValueAccessor {
+class GoabDatePicker extends GoabControlValueAccessor$1 {
     formatValue(val) {
         if (!val)
             return "";
@@ -1802,7 +1810,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: ["disabledChange", ["$event.detail.disabled"]]
             }] } });
 
-class GoabDetails extends GoabBaseComponent {
+class GoabDetails extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -1866,7 +1874,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabDivider extends GoabBaseComponent {
+class GoabDivider extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -2006,7 +2014,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             }] } });
 
 // "disabled", "value", "id" is an exposed property of HTMLInputElement, no need to bind with attr
-class GoabDropdown extends GoabControlValueAccessor {
+class GoabDropdown extends GoabControlValueAccessor$1 {
     constructor(cdr, renderer) {
         super(renderer);
         this.cdr = cdr;
@@ -2280,7 +2288,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabFileUploadInput extends GoabBaseComponent {
+class GoabFileUploadInput extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -2352,7 +2360,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabFilterChip extends GoabBaseComponent {
+class GoabFilterChip extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -2622,7 +2630,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabPublicFormPage extends GoabBaseComponent {
+class GoabPublicFormPage extends GoabBaseComponent$1 {
     constructor() {
         super(...arguments);
         this.id = "";
@@ -2741,7 +2749,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabPublicSubform extends GoabBaseComponent {
+class GoabPublicSubform extends GoabBaseComponent$1 {
     constructor() {
         super(...arguments);
         this.id = "";
@@ -2807,7 +2815,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabPublicSubformIndex extends GoabBaseComponent {
+class GoabPublicSubformIndex extends GoabBaseComponent$1 {
     constructor() {
         super(...arguments);
         this.heading = "";
@@ -2893,7 +2901,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabPublicFormTaskList extends GoabBaseComponent {
+class GoabPublicFormTaskList extends GoabBaseComponent$1 {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabPublicFormTaskList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabPublicFormTaskList, isStandalone: true, selector: "goab-public-form-task-list", inputs: { heading: "heading" }, usesInheritance: true, ngImport: i0, template: `
   <goa-public-form-task-list
@@ -2975,7 +2983,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabFormItem extends GoabBaseComponent {
+class GoabFormItem extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -3124,7 +3132,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabFormStepper extends GoabBaseComponent {
+class GoabFormStepper extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -3186,7 +3194,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabGrid extends GoabBaseComponent {
+class GoabGrid extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -3433,7 +3441,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabIcon extends GoabBaseComponent {
+class GoabIcon extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -3510,7 +3518,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabIconButton extends GoabBaseComponent {
+class GoabIconButton extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -3606,7 +3614,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabInput extends GoabControlValueAccessor {
+class GoabInput extends GoabControlValueAccessor$1 {
     constructor(cdr, renderer) {
         super(renderer);
         this.cdr = cdr;
@@ -4759,7 +4767,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabPages extends GoabBaseComponent {
+class GoabPages extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -4810,7 +4818,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: [{ transform: numberAttribute }]
             }] } });
 
-class GoabPagination extends GoabBaseComponent {
+class GoabPagination extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -4885,7 +4893,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabPopover extends GoabBaseComponent {
+class GoabPopover extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -4964,7 +4972,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: [{ required: true }]
             }] } });
 
-class GoabRadioGroup extends GoabControlValueAccessor {
+class GoabRadioGroup extends GoabControlValueAccessor$1 {
     constructor(cdr, renderer) {
         super(renderer);
         this.cdr = cdr;
@@ -5058,7 +5066,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabRadioItem extends GoabBaseComponent {
+class GoabRadioItem extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -5214,7 +5222,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabSideMenuGroup extends GoabBaseComponent {
+class GoabSideMenuGroup extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -5316,7 +5324,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabSkeleton extends GoabBaseComponent {
+class GoabSkeleton extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -5448,13 +5456,19 @@ class GoabTab {
         return this.heading instanceof TemplateRef ? this.heading : null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabTab, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabTab, isStandalone: true, selector: "goab-tab", inputs: { heading: "heading", disabled: ["disabled", "disabled", booleanAttribute] }, ngImport: i0, template: `
-    <goa-tab *ngIf="isReady" [attr.disabled]="disabled || null">
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: GoabTab, isStandalone: true, selector: "goab-tab", inputs: { heading: "heading", disabled: ["disabled", "disabled", booleanAttribute], slug: "slug" }, ngImport: i0, template: `
+    <goa-tab
+      *ngIf="isReady"
+      [attr.slug]="slug"
+      [attr.disabled]="disabled || null"
+      [attr.heading]="getHeadingAsString()"
+    >
       <ng-content />
-      <div slot="heading">
-        <ng-container [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
-        {{getHeadingAsString()}}
-      </div>
+      @if (typeof heading !== "string") {
+        <div slot="heading">
+          <ng-container [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
+        </div>
+      }
     </goa-tab>
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
@@ -5464,25 +5478,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                     standalone: true,
                     selector: "goab-tab",
                     template: `
-    <goa-tab *ngIf="isReady" [attr.disabled]="disabled || null">
+    <goa-tab
+      *ngIf="isReady"
+      [attr.slug]="slug"
+      [attr.disabled]="disabled || null"
+      [attr.heading]="getHeadingAsString()"
+    >
       <ng-content />
-      <div slot="heading">
-        <ng-container [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
-        {{getHeadingAsString()}}
-      </div>
+      @if (typeof heading !== "string") {
+        <div slot="heading">
+          <ng-container [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
+        </div>
+      }
     </goa-tab>
   `,
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
-                    imports: [NgTemplateOutlet, CommonModule]
+                    imports: [NgTemplateOutlet, CommonModule],
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
                 type: Input
             }], disabled: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
+            }], slug: [{
+                type: Input
             }] } });
 
-class GoabTable extends GoabBaseComponent {
+class GoabTable extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -5788,7 +5810,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabTextArea extends GoabControlValueAccessor {
+class GoabTextArea extends GoabControlValueAccessor$1 {
     constructor(cdr, renderer) {
         super(renderer);
         this.cdr = cdr;
@@ -5933,7 +5955,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
-class GoabTooltip extends GoabBaseComponent {
+class GoabTooltip extends GoabBaseComponent$1 {
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -6019,11 +6041,168 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-class GoabxWorkSideMenu {
+class GoabBaseComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", 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: "20.3.16", ngImport: i0, type: GoabBaseComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    template: ``, //** IMPLEMENT IN SUBCLASS
+                }]
+        }], propDecorators: { mt: [{
+                type: Input
+            }], mb: [{
+                type: Input
+            }], ml: [{
+                type: Input
+            }], mr: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }] } });
+/**
+ * An abstract base class that extends `GoabBaseComponent` and implements the `ControlValueAccessor` interface.
+ * This class provides a foundation for creating custom form controls in Angular, enabling them to integrate
+ * seamlessly with Angular forms. It includes support for handling value changes, touch events, and disabled states.
+ *
+ * ## Features
+ * - Supports `disabled="true"` and `error="true` attribute bindings for convenience.
+ * - Handles form control value changes and touch events via `ControlValueAccessor` methods.
+ * - Allows for flexible value types (`unknown`), making it suitable for various data types like integers, dates, or booleans.
+ * - Uses ViewChild to capture a reference to the native GOA web component element via `#goaComponentRef`.
+ * - Uses Renderer2 for safe DOM manipulation (compatible with SSR and security best practices).
+ *
+ * ## Usage
+ * Extend this class to create custom form controls. Child components must:
+ * 1. Add `#goaComponentRef` template reference to their `goa-*` element in the template
+ * 2. Inject `Renderer2` in their constructor and pass it to `super(renderer)`
+ *
+ * ### Example:
+ * ```typescript
+ * @Component({
+ *   template: `<goa-input #goaComponentRef [value]="value" ...></goa-input>`
+ * })
+ * export class GoabInput extends GoabControlValueAccessor {
+ *   constructor(private cdr: ChangeDetectorRef, renderer: Renderer2) {
+ *     super(renderer);  // Required: pass Renderer2 to base class
+ *   }
+ * }
+ * ```
+ *
+ * ## Properties
+ * - `id?`: An optional identifier for the component.
+ * - `disabled?`: A boolean indicating whether the component is disabled.
+ * - `error?`: A boolean indicating whether the component is in an error state.
+ * - `value?`: The current value of the component, which can be of any type.
+ *
+ * ## Methods
+ * - `markAsTouched()`: Marks the component as touched and triggers the `fcTouched` callback if defined.
+ * - `writeValue(value: unknown)`: Writes a new value to the form control (can be overridden for special behavior like checkbox).
+ * - `registerOnChange(fn: any)`: Registers a function to handle changes in the form control value.
+ * - `registerOnTouched(fn: any)`: Registers a function to handle touch events on the form control.
+ * - `setDisabledState?(isDisabled: boolean)`: Sets the disabled state of the component.
+ * - `convertValueToString(value: unknown)`: Converts a value to a string for DOM attribute assignment (can be overridden).
+ *
+ * ## Callbacks
+ * - `fcChange?`: A function to handle changes in the form control value.
+ * - `fcTouched?`: A function to handle touch events on the form control.
+ */
+class GoabControlValueAccessor extends GoabBaseComponent {
+    /**
+     * 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`.
+     */
+    markAsTouched() {
+        if (!this.touched) {
+            this.fcTouched?.();
+            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.
+     * @param value The value to convert
+     * @returns string representation or empty string for nullish/empty
+     */
+    convertValueToString(value) {
+        if (value === null || value === undefined || value === "") {
+            return "";
+        }
+        return String(value);
+    }
+    /**
+     * Writes a new value to the form control.
+     * @param {unknown} value - The value to write.
+     */
+    writeValue(value) {
+        this.value = value;
+        const el = this.goaComponentRef?.nativeElement;
+        if (el) {
+            const stringValue = this.convertValueToString(value);
+            this.renderer.setAttribute(el, "value", stringValue);
+        }
+    }
+    /**
+     * Registers a function to call when the form control value changes.
+     * @param {function} fn - The function to call.
+     */
+    registerOnChange(fn) {
+        this.fcChange = fn;
+    }
+    /**
+     * Registers a function to call when the form control is touched.
+     * @param {function} fn - The function to call.
+     */
+    registerOnTouched(fn) {
+        this.fcTouched = fn;
+    }
+    /**
+     * Sets the disabled state of the component.
+     *
+     * @param isDisabled - A boolean indicating whether the component should be disabled.
+     */
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabControlValueAccessor, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", 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: "20.3.16", ngImport: i0, type: GoabControlValueAccessor, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    template: ``, //** IMPLEMENT IN SUBCLASS
+                }]
+        }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { id: [{
+                type: Input
+            }], disabled: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], error: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], value: [{
+                type: Input
+            }], goaComponentRef: [{
+                type: ViewChild,
+                args: ["goaComponentRef", { static: false, read: ElementRef }]
+            }] } });
+
+class GoabxBadge extends GoabBaseComponent {
     constructor(cdr) {
+        super();
         this.cdr = cdr;
-        this.onToggle = new EventEmitter();
+        this.size = "medium";
+        this.emphasis = "strong";
         this.isReady = false;
+        this.version = "2";
     }
     ngOnInit() {
         // For Angular 20, we need to delay rendering the web component
@@ -6033,52 +6212,2837 @@ class GoabxWorkSideMenu {
             this.cdr.detectChanges();
         }, 0);
     }
-    _onToggle() {
-        this.onToggle.emit();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxWorkSideMenu, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxWorkSideMenu, isStandalone: true, selector: "goabx-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" }, ngImport: i0, template: `
-    <goa-work-side-menu
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxBadge, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxBadge, isStandalone: true, selector: "goabx-badge", inputs: { type: "type", content: "content", icon: ["icon", "icon", booleanAttribute], iconType: "iconType", size: "size", emphasis: "emphasis", ariaLabel: "ariaLabel" }, usesInheritance: true, ngImport: i0, template: `
+    <goa-badge
       *ngIf="isReady"
-      [open]="open ?? false"
-      [attr.heading]="heading"
-      [attr.url]="url"
-      [attr.user-name]="userName"
-      [attr.user-secondary-text]="userSecondaryText"
+      [attr.version]="version"
+      [attr.size]="size"
+      [attr.emphasis]="emphasis"
+      [attr.type]="type"
+      [attr.icon]="icon ? 'true' : 'false'"
+      [attr.icontype]="iconType"
+      [attr.arialabel]="ariaLabel"
+      [attr.content]="content"
       [attr.testid]="testId"
-      (_toggle)="_onToggle()"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
     >
-      <div slot="primary">
-        <ng-container [ngTemplateOutlet]="primaryContent"></ng-container>
-      </div>
-      <div slot="secondary">
-        <ng-container [ngTemplateOutlet]="secondaryContent"></ng-container>
-      </div>
-      <div slot="account">
-        <ng-container [ngTemplateOutlet]="accountContent"></ng-container>
-      </div>
-    </goa-work-side-menu>
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    </goa-badge>
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxWorkSideMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxBadge, decorators: [{
             type: Component,
-            args: [{
-                    standalone: true,
-                    selector: "goabx-work-side-menu", // eslint-disable-line
-                    imports: [NgTemplateOutlet, CommonModule],
-                    template: `
-    <goa-work-side-menu
+            args: [{ standalone: true, selector: "goabx-badge", template: `
+    <goa-badge
       *ngIf="isReady"
-      [open]="open ?? false"
-      [attr.heading]="heading"
-      [attr.url]="url"
-      [attr.user-name]="userName"
-      [attr.user-secondary-text]="userSecondaryText"
+      [attr.version]="version"
+      [attr.size]="size"
+      [attr.emphasis]="emphasis"
+      [attr.type]="type"
+      [attr.icon]="icon ? 'true' : 'false'"
+      [attr.icontype]="iconType"
+      [attr.arialabel]="ariaLabel"
+      [attr.content]="content"
       [attr.testid]="testId"
-      (_toggle)="_onToggle()"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
     >
-      <div slot="primary">
-        <ng-container [ngTemplateOutlet]="primaryContent"></ng-container>
+    </goa-badge>
+  `, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [CommonModule], styles: [":host{display:contents}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+                type: Input
+            }], content: [{
+                type: Input
+            }], icon: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], iconType: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], emphasis: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }] } });
+
+class GoabxButton extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.type = "primary";
+        this.onClick = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+        this.JSON = JSON;
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onClick() {
+        this.onClick.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxButton, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxButton, isStandalone: true, selector: "goabx-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: `
+    <goa-button
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.size]="size"
+      [attr.variant]="variant"
+      [disabled]="disabled"
+      [attr.leadingicon]="leadingIcon"
+      [attr.trailingicon]="trailingIcon"
+      [attr.width]="width"
+      [attr.testid]="testId"
+      [attr.action]="action"
+      [attr.action-arg]="actionArg"
+      [attr.action-args]="JSON.stringify(actionArgs)"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_click)="_onClick()"
+    >
+      <ng-content />
+    </goa-button>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxButton, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-button",
+                    imports: [CommonModule],
+                    template: `
+    <goa-button
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.size]="size"
+      [attr.variant]="variant"
+      [disabled]="disabled"
+      [attr.leadingicon]="leadingIcon"
+      [attr.trailingicon]="trailingIcon"
+      [attr.width]="width"
+      [attr.testid]="testId"
+      [attr.action]="action"
+      [attr.action-arg]="actionArg"
+      [attr.action-args]="JSON.stringify(actionArgs)"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_click)="_onClick()"
+    >
+      <ng-content />
+    </goa-button>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], disabled: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], leadingIcon: [{
+                type: Input
+            }], trailingIcon: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], action: [{
+                type: Input
+            }], actionArg: [{
+                type: Input
+            }], actionArgs: [{
+                type: Input
+            }], onClick: [{
+                type: Output
+            }] } });
+
+class GoabxCalendar extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.version = 2;
+        this.onChange = new EventEmitter();
+        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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onChange(e) {
+        const details = e.detail;
+        this.onChange.emit(details);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxCalendar, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxCalendar, isStandalone: true, selector: "goabx-calendar", inputs: { name: "name", value: "value", min: "min", max: "max" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
+    <goa-calendar
+      *ngIf="isReady"
+      [attr.name]="name"
+      [value]="value"
+      [attr.min]="min"
+      [attr.max]="max"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      [attr.version]="version"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-calendar>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxCalendar, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-calendar",
+                    imports: [CommonModule],
+                    template: `
+    <goa-calendar
+      *ngIf="isReady"
+      [attr.name]="name"
+      [value]="value"
+      [attr.min]="min"
+      [attr.max]="max"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      [attr.version]="version"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-calendar>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { name: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], min: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxCallout extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.type = "information";
+        this.heading = "";
+        this.size = "large";
+        this.ariaLive = "off";
+        this.iconTheme = "outline";
+        this.emphasis = "medium";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxCallout, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxCallout, isStandalone: true, selector: "goabx-callout", inputs: { type: "type", heading: "heading", size: "size", maxWidth: "maxWidth", ariaLive: "ariaLive", iconTheme: "iconTheme", emphasis: "emphasis" }, usesInheritance: true, ngImport: i0, template: `
+    <goa-callout
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.heading]="heading"
+      [attr.size]="size"
+      [attr.maxwidth]="maxWidth"
+      [attr.arialive]="ariaLive"
+      [attr.icontheme]="iconTheme"
+      [attr.emphasis]="emphasis"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+    </goa-callout>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxCallout, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-callout",
+                    imports: [CommonModule],
+                    template: `
+    <goa-callout
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.heading]="heading"
+      [attr.size]="size"
+      [attr.maxwidth]="maxWidth"
+      [attr.arialive]="ariaLive"
+      [attr.icontheme]="iconTheme"
+      [attr.emphasis]="emphasis"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+    </goa-callout>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+                type: Input
+            }], heading: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], ariaLive: [{
+                type: Input
+            }], iconTheme: [{
+                type: Input
+            }], emphasis: [{
+                type: Input
+            }] } });
+
+class GoabxCheckbox extends GoabControlValueAccessor {
+    constructor(cdr, renderer) {
+        super(renderer);
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.size = "default";
+        this.onChange = new EventEmitter();
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    getDescriptionAsString() {
+        return typeof this.description === "string" ? this.description : "";
+    }
+    getDescriptionAsTemplate() {
+        if (this.description) {
+            return typeof this.description === "string" ? null : this.description;
+        }
+        return null;
+    }
+    _onChange(e) {
+        const detail = { ...e.detail, event: e };
+        this.onChange.emit(detail);
+        this.markAsTouched();
+        this.fcChange?.(detail.binding === "check" ? detail.checked : detail.value || "");
+    }
+    // Checkbox is a special case: it uses `checked` instead of `value`.
+    writeValue(value) {
+        this.value = value;
+        this.checked = !!value;
+        const el = this.goaComponentRef?.nativeElement;
+        if (el) {
+            this.renderer.setAttribute(el, "checked", this.checked ? "true" : "false");
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxCheckbox, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxCheckbox, isStandalone: true, selector: "goabx-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,
+                useExisting: forwardRef(() => GoabxCheckbox),
+            },
+        ], usesInheritance: true, ngImport: i0, template: ` <goa-checkbox
+    #goaComponentRef
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.name]="name"
+    [checked]="checked"
+    [disabled]="disabled"
+    [attr.indeterminate]="indeterminate ? 'true' : undefined"
+    [attr.error]="error"
+    [attr.text]="text"
+    [value]="value"
+    [attr.testid]="testId"
+    [attr.arialabel]="ariaLabel"
+    [attr.description]="getDescriptionAsString()"
+    [attr.revealarialabel]="revealArialLabel"
+    [id]="id"
+    [attr.maxwidth]="maxWidth"
+    [attr.size]="size"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.ml]="ml"
+    [attr.mr]="mr"
+    (_change)="_onChange($event)"
+  >
+    <ng-content />
+    <div slot="description">
+      <ng-container [ngTemplateOutlet]="getDescriptionAsTemplate()"></ng-container>
+    </div>
+    <div slot="reveal">
+      <ng-container *ngIf="reveal" [ngTemplateOutlet]="reveal"></ng-container>
+    </div>
+  </goa-checkbox>`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxCheckbox, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-checkbox",
+                    template: ` <goa-checkbox
+    #goaComponentRef
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.name]="name"
+    [checked]="checked"
+    [disabled]="disabled"
+    [attr.indeterminate]="indeterminate ? 'true' : undefined"
+    [attr.error]="error"
+    [attr.text]="text"
+    [value]="value"
+    [attr.testid]="testId"
+    [attr.arialabel]="ariaLabel"
+    [attr.description]="getDescriptionAsString()"
+    [attr.revealarialabel]="revealArialLabel"
+    [id]="id"
+    [attr.maxwidth]="maxWidth"
+    [attr.size]="size"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.ml]="ml"
+    [attr.mr]="mr"
+    (_change)="_onChange($event)"
+  >
+    <ng-content />
+    <div slot="description">
+      <ng-container [ngTemplateOutlet]="getDescriptionAsTemplate()"></ng-container>
+    </div>
+    <div slot="reveal">
+      <ng-container *ngIf="reveal" [ngTemplateOutlet]="reveal"></ng-container>
+    </div>
+  </goa-checkbox>`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            multi: true,
+                            useExisting: forwardRef(() => GoabxCheckbox),
+                        },
+                    ],
+                    imports: [NgTemplateOutlet, CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+                type: Input
+            }], checked: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], indeterminate: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], text: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], description: [{
+                type: Input
+            }], reveal: [{
+                type: Input
+            }], revealArialLabel: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxDatePicker extends GoabControlValueAccessor {
+    formatValue(val) {
+        if (!val)
+            return "";
+        if (val instanceof Date) {
+            return val.toISOString();
+        }
+        return val;
+    }
+    _onChange(e) {
+        const detail = { ...e.detail, event: e };
+        this.onChange.emit(detail);
+        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();
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+        if (this.value && typeof this.value !== "string") {
+            console.warn("Using a `Date` type for value is deprecated. Instead use a string of the format `yyyy-mm-dd`");
+        }
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+        this.elementRef.nativeElement.disabled = isDisabled;
+    }
+    listenDisabledChange(isDisabled) {
+        this.setDisabledState(isDisabled);
+    }
+    writeValue(value) {
+        this.value = value;
+        const datePickerEl = this.goaComponentRef?.nativeElement;
+        if (datePickerEl) {
+            if (!value) {
+                this.renderer.setAttribute(datePickerEl, "value", "");
+            }
+            else {
+                this.renderer.setAttribute(datePickerEl, "value", value instanceof Date ? value.toISOString() : value);
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDatePicker, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxDatePicker, isStandalone: true, selector: "goabx-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.detail.disabled)" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                multi: true,
+                useExisting: forwardRef(() => GoabxDatePicker),
+            },
+        ], usesInheritance: true, ngImport: i0, template: ` <goa-date-picker
+    #goaComponentRef
+    *ngIf="isReady"
+    [attr.name]="name"
+    [attr.value]="formatValue(value)"
+    [attr.min]="min"
+    [attr.max]="max"
+    [attr.error]="error"
+    [attr.disabled]="disabled"
+    [attr.relative]="relative"
+    [attr.type]="type"
+    [attr.testid]="testId"
+    [attr.width]="width"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.ml]="ml"
+    [attr.mr]="mr"
+    [attr.version]="version"
+    (_change)="_onChange($event)"
+  >
+  </goa-date-picker>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDatePicker, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-date-picker",
+                    imports: [CommonModule],
+                    template: ` <goa-date-picker
+    #goaComponentRef
+    *ngIf="isReady"
+    [attr.name]="name"
+    [attr.value]="formatValue(value)"
+    [attr.min]="min"
+    [attr.max]="max"
+    [attr.error]="error"
+    [attr.disabled]="disabled"
+    [attr.relative]="relative"
+    [attr.type]="type"
+    [attr.testid]="testId"
+    [attr.width]="width"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.ml]="ml"
+    [attr.mr]="mr"
+    [attr.version]="version"
+    (_change)="_onChange($event)"
+  >
+  </goa-date-picker>`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            multi: true,
+                            useExisting: forwardRef(() => GoabxDatePicker),
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], min: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], relative: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }], listenDisabledChange: [{
+                type: HostListener,
+                args: ["disabledChange", ["$event.detail.disabled"]]
+            }] } });
+
+class GoabxDrawer {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.version = "2";
+        this.onClose = new EventEmitter();
+        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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onClose() {
+        this.onClose.emit();
+    }
+    getHeadingAsString() {
+        return this.heading instanceof TemplateRef ? "" : this.heading;
+    }
+    getHeadingAsTemplate() {
+        if (!this.heading)
+            return null;
+        return this.heading instanceof TemplateRef ? this.heading : null;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDrawer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxDrawer, isStandalone: true, selector: "goabx-drawer", inputs: { open: ["open", "open", booleanAttribute], position: "position", heading: "heading", maxSize: "maxSize", testId: "testId", actions: "actions" }, outputs: { onClose: "onClose" }, ngImport: i0, template: `
+    <goa-drawer
+      *ngIf="isReady"
+      [open]="open"
+      [attr.position]="position"
+      [attr.heading]="getHeadingAsString()"
+      [attr.maxsize]="maxSize"
+      [attr.testid]="testId"
+      [attr.version]="version"
+      (_close)="_onClose()"
+    >
+      <ng-content></ng-content>
+      <div slot="heading">
+        <ng-container [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
+      </div>
+      <div slot="actions">
+        <ng-container [ngTemplateOutlet]="actions"></ng-container>
+      </div>
+    </goa-drawer>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDrawer, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-drawer",
+                    imports: [NgTemplateOutlet, CommonModule],
+                    template: `
+    <goa-drawer
+      *ngIf="isReady"
+      [open]="open"
+      [attr.position]="position"
+      [attr.heading]="getHeadingAsString()"
+      [attr.maxsize]="maxSize"
+      [attr.testid]="testId"
+      [attr.version]="version"
+      (_close)="_onClose()"
+    >
+      <ng-content></ng-content>
+      <div slot="heading">
+        <ng-container [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
+      </div>
+      <div slot="actions">
+        <ng-container [ngTemplateOutlet]="actions"></ng-container>
+      </div>
+    </goa-drawer>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { open: [{
+                type: Input,
+                args: [{ required: true, transform: booleanAttribute }]
+            }], position: [{
+                type: Input,
+                args: [{ required: true }]
+            }], heading: [{
+                type: Input
+            }], maxSize: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], actions: [{
+                type: Input
+            }], onClose: [{
+                type: Output
+            }] } });
+
+// "disabled", "value", "id" is an exposed property of HTMLInputElement, no need to bind with attr
+class GoabxDropdown extends GoabControlValueAccessor {
+    constructor(cdr, renderer) {
+        super(renderer);
+        this.cdr = cdr;
+        this.size = "default";
+        this.onChange = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onChange(e) {
+        const detail = { ...e.detail, event: e };
+        // Keep local value in sync with emitted detail
+        this.value = detail.value || null;
+        this.onChange.emit(detail);
+        this.markAsTouched();
+        this.fcChange?.(detail.value || "");
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDropdown, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxDropdown, isStandalone: true, selector: "goabx-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,
+                useExisting: forwardRef(() => GoabxDropdown),
+            },
+        ], usesInheritance: true, ngImport: i0, template: `
+    <goa-dropdown
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [value]="value"
+      [attr.arialabel]="ariaLabel"
+      [attr.arialabelledby]="ariaLabelledBy"
+      [disabled]="disabled"
+      [attr.error]="error"
+      [attr.filterable]="filterable"
+      [attr.leadingicon]="leadingIcon"
+      [attr.maxheight]="maxHeight"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      [attr.mt]="mt"
+      [attr.multiselect]="multiselect"
+      [attr.native]="native"
+      [attr.placeholder]="placeholder"
+      [attr.testid]="testId"
+      [attr.width]="width"
+      [attr.maxwidth]="maxWidth"
+      [attr.relative]="relative"
+      [attr.autocomplete]="autoComplete"
+      [attr.size]="size"
+      [id]="id"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-dropdown>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDropdown, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-dropdown",
+                    imports: [CommonModule],
+                    template: `
+    <goa-dropdown
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [value]="value"
+      [attr.arialabel]="ariaLabel"
+      [attr.arialabelledby]="ariaLabelledBy"
+      [disabled]="disabled"
+      [attr.error]="error"
+      [attr.filterable]="filterable"
+      [attr.leadingicon]="leadingIcon"
+      [attr.maxheight]="maxHeight"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      [attr.mt]="mt"
+      [attr.multiselect]="multiselect"
+      [attr.native]="native"
+      [attr.placeholder]="placeholder"
+      [attr.testid]="testId"
+      [attr.width]="width"
+      [attr.maxwidth]="maxWidth"
+      [attr.relative]="relative"
+      [attr.autocomplete]="autoComplete"
+      [attr.size]="size"
+      [id]="id"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-dropdown>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            multi: true,
+                            useExisting: forwardRef(() => GoabxDropdown),
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], ariaLabelledBy: [{
+                type: Input
+            }], filterable: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], leadingIcon: [{
+                type: Input
+            }], maxHeight: [{
+                type: Input
+            }], multiselect: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], native: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], placeholder: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], autoComplete: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], relative: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxDropdownItem {
+    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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDropdownItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxDropdownItem, isStandalone: true, selector: "goabx-dropdown-item", inputs: { value: "value", filter: "filter", label: "label", name: "name", mountType: "mountType" }, ngImport: i0, template: `
+    <goa-dropdown-item
+      *ngIf="isReady"
+      [value]="value"
+      [label]="label"
+      [attr.filter]="filter"
+      [attr.name]="name"
+      [attr.mount]="mountType"
+    >
+    </goa-dropdown-item>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxDropdownItem, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-dropdown-item",
+                    template: `
+    <goa-dropdown-item
+      *ngIf="isReady"
+      [value]="value"
+      [label]="label"
+      [attr.filter]="filter"
+      [attr.name]="name"
+      [attr.mount]="mountType"
+    >
+    </goa-dropdown-item>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { value: [{
+                type: Input
+            }], filter: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], mountType: [{
+                type: Input
+            }] } });
+
+class GoabxFileUploadCard {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.onCancel = new EventEmitter();
+        this.onDelete = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onCancel(event) {
+        this.onCancel.emit({ filename: this.filename, event });
+    }
+    _onDelete(event) {
+        this.onDelete.emit({ filename: this.filename, event });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFileUploadCard, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxFileUploadCard, isStandalone: true, selector: "goabx-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: `<goa-file-upload-card
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.filename]="filename"
+    [attr.size]="size"
+    [attr.type]="type"
+    [attr.progress]="progress"
+    [attr.error]="error"
+    [attr.testid]="testId"
+    (_cancel)="_onCancel($event)"
+    (_delete)="_onDelete($event)"
+  >
+  </goa-file-upload-card>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFileUploadCard, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-file-upload-card",
+                    template: `<goa-file-upload-card
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.filename]="filename"
+    [attr.size]="size"
+    [attr.type]="type"
+    [attr.progress]="progress"
+    [attr.error]="error"
+    [attr.testid]="testId"
+    (_cancel)="_onCancel($event)"
+    (_delete)="_onDelete($event)"
+  >
+  </goa-file-upload-card>`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { filename: [{
+                type: Input,
+                args: [{ required: true }]
+            }], size: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], type: [{
+                type: Input
+            }], progress: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], error: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], onCancel: [{
+                type: Output
+            }], onDelete: [{
+                type: Output
+            }] } });
+
+class GoabxFileUploadInput extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.id = "";
+        this.maxFileSize = "5MB";
+        this.onSelectFile = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onSelectFile(e) {
+        const detail = { ...e.detail, event: e };
+        this.onSelectFile.emit(detail);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFileUploadInput, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxFileUploadInput, isStandalone: true, selector: "goabx-file-upload-input", inputs: { id: "id", variant: "variant", maxFileSize: "maxFileSize", accept: "accept" }, outputs: { onSelectFile: "onSelectFile" }, usesInheritance: true, ngImport: i0, template: `<goa-file-upload-input
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.variant]="variant"
+    [attr.accept]="accept"
+    [attr.maxfilesize]="maxFileSize"
+    [attr.testid]="testId"
+    [id]="id"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.mr]="mr"
+    [attr.ml]="ml"
+    (_selectFile)="_onSelectFile($event)"
+  >
+  </goa-file-upload-input>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFileUploadInput, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-file-upload-input",
+                    template: `<goa-file-upload-input
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.variant]="variant"
+    [attr.accept]="accept"
+    [attr.maxfilesize]="maxFileSize"
+    [attr.testid]="testId"
+    [id]="id"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.mr]="mr"
+    [attr.ml]="ml"
+    (_selectFile)="_onSelectFile($event)"
+  >
+  </goa-file-upload-input>`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { id: [{
+                type: Input
+            }], variant: [{
+                type: Input,
+                args: [{ required: true }]
+            }], maxFileSize: [{
+                type: Input
+            }], accept: [{
+                type: Input
+            }], onSelectFile: [{
+                type: Output
+            }] } });
+
+class GoabxFilterChip extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.content = "";
+        this.secondaryText = "";
+        this.leadingIcon = null;
+        this.onClick = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onClick() {
+        this.onClick.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFilterChip, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxFilterChip, isStandalone: true, selector: "goabx-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: `<goa-filter-chip
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.error]="error"
+    [attr.icontheme]="iconTheme"
+    [attr.content]="content"
+    [attr.secondarytext]="secondaryText"
+    [attr.leadingicon]="leadingIcon"
+    [attr.testid]="testId"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.ml]="ml"
+    [attr.mr]="mr"
+    (_click)="_onClick()"
+  >
+    <ng-content />
+  </goa-filter-chip>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFilterChip, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-filter-chip",
+                    template: `<goa-filter-chip
+    *ngIf="isReady"
+    [attr.version]="version"
+    [attr.error]="error"
+    [attr.icontheme]="iconTheme"
+    [attr.content]="content"
+    [attr.secondarytext]="secondaryText"
+    [attr.leadingicon]="leadingIcon"
+    [attr.testid]="testId"
+    [attr.mt]="mt"
+    [attr.mb]="mb"
+    [attr.ml]="ml"
+    [attr.mr]="mr"
+    (_click)="_onClick()"
+  >
+    <ng-content />
+  </goa-filter-chip>`,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { error: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], deletable: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], content: [{
+                type: Input
+            }], iconTheme: [{
+                type: Input
+            }], secondaryText: [{
+                type: Input
+            }], leadingIcon: [{
+                type: Input
+            }], onClick: [{
+                type: Output
+            }] } });
+
+class GoabxFormItem extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.type = "";
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFormItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxFormItem, isStandalone: true, selector: "goabx-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: `
+    <goa-form-item
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.label]="label"
+      [attr.labelsize]="labelSize"
+      [attr.helptext]="helpText"
+      [attr.error]="error"
+      [attr.testid]="testId"
+      [attr.type]="type"
+      [id]="id"
+      [attr.name]="name"
+      [attr.requirement]="requirement"
+      [attr.maxwidth]="maxWidth"
+      [attr.public-form-summary-order]="publicFormSummaryOrder"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.mr]="mr"
+      [attr.ml]="ml"
+    >
+      <ng-content />
+      <ng-content select="goab-form-item-slot"></ng-content>
+    </goa-form-item>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxFormItem, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-form-item",
+                    template: `
+    <goa-form-item
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.label]="label"
+      [attr.labelsize]="labelSize"
+      [attr.helptext]="helpText"
+      [attr.error]="error"
+      [attr.testid]="testId"
+      [attr.type]="type"
+      [id]="id"
+      [attr.name]="name"
+      [attr.requirement]="requirement"
+      [attr.maxwidth]="maxWidth"
+      [attr.public-form-summary-order]="publicFormSummaryOrder"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.mr]="mr"
+      [attr.ml]="ml"
+    >
+      <ng-content />
+      <ng-content select="goab-form-item-slot"></ng-content>
+    </goa-form-item>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
+                type: Input
+            }], labelSize: [{
+                type: Input
+            }], helpText: [{
+                type: Input
+            }], error: [{
+                type: Input
+            }], requirement: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], publicFormSummaryOrder: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }] } });
+
+class GoabxAppFooter {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = 2;
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxAppFooter, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxAppFooter, isStandalone: true, selector: "goabx-app-footer", inputs: { maxContentWidth: "maxContentWidth", testId: "testId", url: "url" }, ngImport: i0, template: `
+    <goa-app-footer
+      *ngIf="isReady"
+      [attr.maxcontentwidth]="maxContentWidth"
+      [attr.url]="url"
+      [attr.testid]="testId"
+      [attr.version]="version"
+    >
+      <ng-content select="[slot=nav]" />
+      <ng-content select="goabx-app-footer-meta-section"></ng-content>
+      <ng-content></ng-content>
+    </goa-app-footer>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxAppFooter, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-app-footer",
+                    template: `
+    <goa-app-footer
+      *ngIf="isReady"
+      [attr.maxcontentwidth]="maxContentWidth"
+      [attr.url]="url"
+      [attr.testid]="testId"
+      [attr.version]="version"
+    >
+      <ng-content select="[slot=nav]" />
+      <ng-content select="goabx-app-footer-meta-section"></ng-content>
+      <ng-content></ng-content>
+    </goa-app-footer>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [CommonModule],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { maxContentWidth: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], url: [{
+                type: Input
+            }] } });
+
+class GoabxAppFooterMetaSection {
+    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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxAppFooterMetaSection, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxAppFooterMetaSection, isStandalone: true, selector: "goabx-app-footer-meta-section", inputs: { testId: "testId", slot: "slot" }, ngImport: i0, template: `
+    <goa-app-footer-meta-section *ngIf="isReady" [attr.testid]="testId">
+      <ng-content />
+    </goa-app-footer-meta-section>
+  `, isInline: true, styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxAppFooterMetaSection, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "goabx-app-footer-meta-section", template: `
+    <goa-app-footer-meta-section *ngIf="isReady" [attr.testid]="testId">
+      <ng-content />
+    </goa-app-footer-meta-section>
+  `, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [CommonModule], styles: [":host{width:100%}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { testId: [{
+                type: Input
+            }], slot: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+class GoabxAppFooterNavSection {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.maxColumnCount = 1;
+        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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxAppFooterNavSection, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxAppFooterNavSection, isStandalone: true, selector: "goabx-app-footer-nav-section", inputs: { heading: "heading", maxColumnCount: "maxColumnCount", testId: "testId", slot: "slot" }, ngImport: i0, template: `
+    <goa-app-footer-nav-section
+      *ngIf="isReady"
+      [attr.maxcolumncount]="maxColumnCount"
+      [attr.heading]="heading"
+      [attr.testid]="testId"
+    >
+      <ng-content />
+    </goa-app-footer-nav-section>
+  `, isInline: true, styles: [":host{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxAppFooterNavSection, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "goabx-app-footer-nav-section", template: `
+    <goa-app-footer-nav-section
+      *ngIf="isReady"
+      [attr.maxcolumncount]="maxColumnCount"
+      [attr.heading]="heading"
+      [attr.testid]="testId"
+    >
+      <ng-content />
+    </goa-app-footer-nav-section>
+  `, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [CommonModule], styles: [":host{width:100%}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+                type: Input
+            }], maxColumnCount: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], slot: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+class GoabxInput extends GoabControlValueAccessor {
+    constructor(cdr, renderer) {
+        super(renderer);
+        this.cdr = cdr;
+        this.type = "text";
+        this.textAlign = "left";
+        this.size = "default";
+        this.onTrailingIconClick = new EventEmitter();
+        this.onFocus = new EventEmitter();
+        this.onBlur = new EventEmitter();
+        this.onKeyPress = new EventEmitter();
+        this.onChange = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+        this.handleTrailingIconClick = false;
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+        this.handleTrailingIconClick = this.onTrailingIconClick.observed;
+        if (typeof this.value === "number") {
+            console.warn("For numeric values use goab-input-number.");
+        }
+    }
+    _onTrailingIconClick(_) {
+        if (this.handleTrailingIconClick) {
+            this.onTrailingIconClick.emit();
+        }
+    }
+    _onChange(e) {
+        this.markAsTouched();
+        const detail = { ...e.detail, event: e };
+        this.onChange.emit(detail);
+        this.fcChange?.(detail.value);
+    }
+    _onKeyPress(e) {
+        this.markAsTouched();
+        const detail = { ...e.detail, event: e };
+        this.onKeyPress.emit(detail);
+        this.fcTouched?.();
+    }
+    _onFocus(e) {
+        this.markAsTouched();
+        const detail = { ...e.detail, event: e };
+        this.onFocus.emit(detail);
+    }
+    _onBlur(e) {
+        const detail = { ...e.detail, event: e };
+        this.onBlur.emit(detail);
+    }
+    getLeadingContentAsString() {
+        return this.leadingContent instanceof TemplateRef ? "" : this.leadingContent;
+    }
+    getLeadingContentAsTemplate() {
+        if (!this.leadingContent)
+            return null;
+        return this.leadingContent instanceof TemplateRef ? this.leadingContent : null;
+    }
+    getTrailingContentAsString() {
+        return this.trailingContent instanceof TemplateRef ? "" : this.trailingContent;
+    }
+    getTrailingContentAsTemplate() {
+        if (!this.trailingContent)
+            return null;
+        return this.trailingContent instanceof TemplateRef ? this.trailingContent : null;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxInput, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxInput, isStandalone: true, selector: "goabx-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,
+                useExisting: forwardRef(() => GoabxInput),
+            },
+        ], usesInheritance: true, ngImport: i0, template: `
+    <goa-input
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.name]="name"
+      [attr.focused]="focused"
+      [attr.value]="value"
+      [attr.autocapitalize]="autoCapitalize"
+      [attr.autocomplete]="autoComplete"
+      [attr.placeholder]="placeholder"
+      [attr.leadingicon]="leadingIcon"
+      [attr.trailingicon]="trailingIcon"
+      [attr.variant]="variant"
+      [disabled]="disabled"
+      [attr.readonly]="readonly"
+      [attr.error]="error"
+      [attr.data-testid]="testId"
+      [attr.width]="width"
+      [attr.arialabel]="ariaLabel"
+      [attr.arialabelledby]="ariaLabelledBy"
+      [attr.min]="min"
+      [attr.max]="max"
+      [attr.step]="step"
+      [attr.prefix]="prefix"
+      [attr.suffix]="suffix"
+      [attr.debounce]="debounce"
+      [attr.maxlength]="maxLength"
+      [attr.id]="id"
+      [attr.mt]="mt"
+      [attr.mr]="mr"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.handletrailingiconclick]="handleTrailingIconClick"
+      [attr.textalign]="textAlign"
+      [attr.size]="size"
+      (_trailingIconClick)="_onTrailingIconClick($event)"
+      (_change)="_onChange($event)"
+      (_focus)="_onFocus($event)"
+      (_blur)="_onBlur($event)"
+      (_keyPress)="_onKeyPress($event)"
+      [attr.trailingiconarialabel]="trailingIconAriaLabel"
+    >
+      <div slot="leadingContent">
+        <ng-container *ngIf="leadingContent">
+          <ng-container *ngIf="getLeadingContentAsTemplate(); else stringLeading">
+            <ng-container
+              [ngTemplateOutlet]="getLeadingContentAsTemplate()"
+            ></ng-container>
+          </ng-container>
+          <ng-template #stringLeading>{{ getLeadingContentAsString() }}</ng-template>
+        </ng-container>
+      </div>
+
+      <ng-content />
+
+      <div slot="trailingContent">
+        <ng-container *ngIf="trailingContent">
+          <ng-container *ngIf="getTrailingContentAsTemplate(); else stringTrailing">
+            <ng-container
+              [ngTemplateOutlet]="getTrailingContentAsTemplate()"
+            ></ng-container>
+          </ng-container>
+          <ng-template #stringTrailing>{{ getTrailingContentAsString() }}</ng-template>
+        </ng-container>
+      </div>
+    </goa-input>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxInput, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-input",
+                    imports: [NgIf, NgTemplateOutlet, CommonModule],
+                    template: `
+    <goa-input
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.name]="name"
+      [attr.focused]="focused"
+      [attr.value]="value"
+      [attr.autocapitalize]="autoCapitalize"
+      [attr.autocomplete]="autoComplete"
+      [attr.placeholder]="placeholder"
+      [attr.leadingicon]="leadingIcon"
+      [attr.trailingicon]="trailingIcon"
+      [attr.variant]="variant"
+      [disabled]="disabled"
+      [attr.readonly]="readonly"
+      [attr.error]="error"
+      [attr.data-testid]="testId"
+      [attr.width]="width"
+      [attr.arialabel]="ariaLabel"
+      [attr.arialabelledby]="ariaLabelledBy"
+      [attr.min]="min"
+      [attr.max]="max"
+      [attr.step]="step"
+      [attr.prefix]="prefix"
+      [attr.suffix]="suffix"
+      [attr.debounce]="debounce"
+      [attr.maxlength]="maxLength"
+      [attr.id]="id"
+      [attr.mt]="mt"
+      [attr.mr]="mr"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.handletrailingiconclick]="handleTrailingIconClick"
+      [attr.textalign]="textAlign"
+      [attr.size]="size"
+      (_trailingIconClick)="_onTrailingIconClick($event)"
+      (_change)="_onChange($event)"
+      (_focus)="_onFocus($event)"
+      (_blur)="_onBlur($event)"
+      (_keyPress)="_onKeyPress($event)"
+      [attr.trailingiconarialabel]="trailingIconAriaLabel"
+    >
+      <div slot="leadingContent">
+        <ng-container *ngIf="leadingContent">
+          <ng-container *ngIf="getLeadingContentAsTemplate(); else stringLeading">
+            <ng-container
+              [ngTemplateOutlet]="getLeadingContentAsTemplate()"
+            ></ng-container>
+          </ng-container>
+          <ng-template #stringLeading>{{ getLeadingContentAsString() }}</ng-template>
+        </ng-container>
+      </div>
+
+      <ng-content />
+
+      <div slot="trailingContent">
+        <ng-container *ngIf="trailingContent">
+          <ng-container *ngIf="getTrailingContentAsTemplate(); else stringTrailing">
+            <ng-container
+              [ngTemplateOutlet]="getTrailingContentAsTemplate()"
+            ></ng-container>
+          </ng-container>
+          <ng-template #stringTrailing>{{ getTrailingContentAsString() }}</ng-template>
+        </ng-container>
+      </div>
+    </goa-input>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            multi: true,
+                            useExisting: forwardRef(() => GoabxInput),
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { type: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], debounce: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], autoCapitalize: [{
+                type: Input
+            }], autoComplete: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], leadingIcon: [{
+                type: Input
+            }], trailingIcon: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], focused: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], readonly: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], width: [{
+                type: Input
+            }], prefix: [{
+                type: Input
+            }], suffix: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], maxLength: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], min: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], step: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], ariaLabelledBy: [{
+                type: Input
+            }], trailingIconAriaLabel: [{
+                type: Input
+            }], textAlign: [{
+                type: Input
+            }], leadingContent: [{
+                type: Input
+            }], trailingContent: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], onTrailingIconClick: [{
+                type: Output
+            }], onFocus: [{
+                type: Output
+            }], onBlur: [{
+                type: Output
+            }], onKeyPress: [{
+                type: Output
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxLink {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.color = "interactive";
+        this.size = "medium";
+        this.JSON = JSON;
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxLink, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxLink, isStandalone: true, selector: "goabx-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: `
+    <goa-link
+      *ngIf="isReady"
+      [attr.leadingicon]="leadingIcon"
+      [attr.trailingicon]="trailingIcon"
+      [attr.testid]="testId"
+      [attr.action]="action"
+      [attr.color]="color"
+      [attr.size]="size"
+      [attr.action-arg]="actionArg"
+      [attr.action-args]="JSON.stringify(actionArgs)"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+    </goa-link>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxLink, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-link",
+                    template: `
+    <goa-link
+      *ngIf="isReady"
+      [attr.leadingicon]="leadingIcon"
+      [attr.trailingicon]="trailingIcon"
+      [attr.testid]="testId"
+      [attr.action]="action"
+      [attr.color]="color"
+      [attr.size]="size"
+      [attr.action-arg]="actionArg"
+      [attr.action-args]="JSON.stringify(actionArgs)"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+    </goa-link>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { leadingIcon: [{
+                type: Input
+            }], trailingIcon: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], action: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], actionArg: [{
+                type: Input
+            }], actionArgs: [{
+                type: Input
+            }], mt: [{
+                type: Input
+            }], mb: [{
+                type: Input
+            }], ml: [{
+                type: Input
+            }], mr: [{
+                type: Input
+            }] } });
+
+class GoabxModal {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.closable = false;
+        this.onClose = new EventEmitter();
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    getHeadingAsString() {
+        return this.heading instanceof TemplateRef ? "" : this.heading;
+    }
+    getHeadingAsTemplate() {
+        if (!this.heading)
+            return null;
+        return this.heading instanceof TemplateRef ? this.heading : null;
+    }
+    _onClose() {
+        this.onClose.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxModal, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxModal, isStandalone: true, selector: "goabx-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: `
+    <goa-modal
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.calloutvariant]="calloutVariant"
+      [attr.open]="open"
+      [attr.maxwidth]="maxWidth"
+      [attr.testid]="testId"
+      [attr.role]="role"
+      [attr.closable]="closable"
+      [attr.transition]="transition"
+      [attr.heading]="getHeadingAsString()"
+      (_close)="_onClose()"
+      >
+      <div slot="heading">
+        <ng-container *ngIf="this.heading !== '' && getHeadingAsTemplate() !== null" [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
+      </div>
+
+      <ng-content></ng-content>
+
+      <div slot="actions">
+        <ng-container *ngIf="this.actions" [ngTemplateOutlet]="actions"></ng-container>
+      </div>
+    </goa-modal>
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxModal, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-modal",
+                    imports: [NgTemplateOutlet, CommonModule],
+                    template: `
+    <goa-modal
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.calloutvariant]="calloutVariant"
+      [attr.open]="open"
+      [attr.maxwidth]="maxWidth"
+      [attr.testid]="testId"
+      [attr.role]="role"
+      [attr.closable]="closable"
+      [attr.transition]="transition"
+      [attr.heading]="getHeadingAsString()"
+      (_close)="_onClose()"
+      >
+      <div slot="heading">
+        <ng-container *ngIf="this.heading !== '' && getHeadingAsTemplate() !== null" [ngTemplateOutlet]="getHeadingAsTemplate()"></ng-container>
+      </div>
+
+      <ng-content></ng-content>
+
+      <div slot="actions">
+        <ng-container *ngIf="this.actions" [ngTemplateOutlet]="actions"></ng-container>
+      </div>
+    </goa-modal>
+    `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { calloutVariant: [{
+                type: Input
+            }], open: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], maxWidth: [{
+                type: Input
+            }], closable: [{
+                type: Input
+            }], transition: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], role: [{
+                type: Input
+            }], heading: [{
+                type: Input
+            }], actions: [{
+                type: Input
+            }], onClose: [{
+                type: Output
+            }] } });
+
+class GoabxNotification {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.type = "information";
+        this.emphasis = "high";
+        this.onDismiss = new EventEmitter();
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    _onDismiss() {
+        this.onDismiss.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxNotification, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxNotification, isStandalone: true, selector: "goabx-notification", inputs: { type: "type", ariaLive: "ariaLive", maxContentWidth: "maxContentWidth", emphasis: "emphasis", compact: ["compact", "compact", booleanAttribute], testId: "testId" }, outputs: { onDismiss: "onDismiss" }, ngImport: i0, template: `
+    <goa-notification
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.arialive]="ariaLive"
+      [attr.maxcontentwidth]="maxContentWidth"
+      [attr.emphasis]="emphasis"
+      [attr.compact]="compact"
+      [attr.testid]="testId"
+      (_dismiss)="_onDismiss()"
+    >
+      <ng-content />
+    </goa-notification>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxNotification, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-notification",
+                    template: `
+    <goa-notification
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.type]="type"
+      [attr.arialive]="ariaLive"
+      [attr.maxcontentwidth]="maxContentWidth"
+      [attr.emphasis]="emphasis"
+      [attr.compact]="compact"
+      [attr.testid]="testId"
+      (_dismiss)="_onDismiss()"
+    >
+      <ng-content />
+    </goa-notification>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+                type: Input
+            }], ariaLive: [{
+                type: Input
+            }], maxContentWidth: [{
+                type: Input
+            }], emphasis: [{
+                type: Input
+            }], compact: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], testId: [{
+                type: Input
+            }], onDismiss: [{
+                type: Output
+            }] } });
+
+class GoabxPagination extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.perPageCount = 10;
+        this.variant = "all";
+        this.onChange = new EventEmitter();
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    _onChange(e) {
+        const detail = e.detail;
+        this.onChange.emit(detail);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxPagination, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxPagination, isStandalone: true, selector: "goabx-pagination", inputs: { itemCount: "itemCount", pageNumber: "pageNumber", perPageCount: "perPageCount", variant: "variant" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: `
+    <goa-pagination
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.itemcount]="itemCount"
+      [attr.perpagecount]="perPageCount"
+      [attr.pagenumber]="pageNumber"
+      [attr.variant]="variant"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_change)="_onChange($event)"
+    >
+    </goa-pagination>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxPagination, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-pagination",
+                    template: `
+    <goa-pagination
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.itemcount]="itemCount"
+      [attr.perpagecount]="perPageCount"
+      [attr.pagenumber]="pageNumber"
+      [attr.variant]="variant"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_change)="_onChange($event)"
+    >
+    </goa-pagination>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { itemCount: [{
+                type: Input,
+                args: [{ required: true }]
+            }], pageNumber: [{
+                type: Input,
+                args: [{ required: true }]
+            }], perPageCount: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxRadioGroup extends GoabControlValueAccessor {
+    constructor(cdr, renderer) {
+        super(renderer);
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.size = "default";
+        this.onChange = new EventEmitter();
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    _onChange(e) {
+        const detail = { ...e.detail, event: e };
+        this.markAsTouched();
+        this.onChange.emit(detail);
+        this.fcChange?.(detail.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxRadioGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxRadioGroup, isStandalone: true, selector: "goabx-radio-group", inputs: { name: "name", orientation: "orientation", ariaLabel: "ariaLabel", size: "size" }, outputs: { onChange: "onChange" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                multi: true,
+                useExisting: forwardRef(() => GoabxRadioGroup),
+            },
+        ], usesInheritance: true, ngImport: i0, template: `
+    <goa-radio-group
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [attr.value]="value"
+      [disabled]="disabled"
+      [attr.orientation]="orientation"
+      [attr.error]="error"
+      [attr.arialabel]="ariaLabel"
+      [attr.size]="size"
+      [id]="id"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-radio-group>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxRadioGroup, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-radio-group",
+                    template: `
+    <goa-radio-group
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [attr.value]="value"
+      [disabled]="disabled"
+      [attr.orientation]="orientation"
+      [attr.error]="error"
+      [attr.arialabel]="ariaLabel"
+      [attr.size]="size"
+      [id]="id"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-radio-group>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            multi: true,
+                            useExisting: forwardRef(() => GoabxRadioGroup),
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+                type: Input
+            }], orientation: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxRadioItem extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    getDescriptionAsString() {
+        return !this.description || this.description instanceof TemplateRef
+            ? ""
+            : this.description;
+    }
+    getDescriptionAsTemplate() {
+        if (!this.description)
+            return null;
+        return this.description instanceof TemplateRef ? this.description : null;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxRadioItem, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxRadioItem, isStandalone: true, selector: "goabx-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: `
+    <goa-radio-item
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [attr.value]="value"
+      [attr.label]="label"
+      [attr.description]="getDescriptionAsString()"
+      [attr.arialabel]="ariaLabel"
+      [attr.revealarialabel]="revealAriaLabel"
+      [disabled]="disabled"
+      [attr.compact]="compact"
+      [attr.maxwidth]="maxWidth"
+      [attr.checked]="checked"
+      [attr.error]="error"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+      <div slot="description">
+        <ng-container [ngTemplateOutlet]="getDescriptionAsTemplate()"></ng-container>
+      </div>
+      <div slot="reveal">
+        <ng-container *ngIf="this.reveal" [ngTemplateOutlet]="reveal"></ng-container>
+      </div>
+    </goa-radio-item>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxRadioItem, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-radio-item",
+                    template: `
+    <goa-radio-item
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [attr.value]="value"
+      [attr.label]="label"
+      [attr.description]="getDescriptionAsString()"
+      [attr.arialabel]="ariaLabel"
+      [attr.revealarialabel]="revealAriaLabel"
+      [disabled]="disabled"
+      [attr.compact]="compact"
+      [attr.maxwidth]="maxWidth"
+      [attr.checked]="checked"
+      [attr.error]="error"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+      <div slot="description">
+        <ng-container [ngTemplateOutlet]="getDescriptionAsTemplate()"></ng-container>
+      </div>
+      <div slot="reveal">
+        <ng-container *ngIf="this.reveal" [ngTemplateOutlet]="reveal"></ng-container>
+      </div>
+    </goa-radio-item>
+  `,
+                    imports: [NgTemplateOutlet, CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { value: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], description: [{
+                type: Input
+            }], reveal: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], revealAriaLabel: [{
+                type: Input
+            }], disabled: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], checked: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], error: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], maxWidth: [{
+                type: Input
+            }], compact: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }] } });
+
+class GoabxSideMenu {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxSideMenu, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxSideMenu, isStandalone: true, selector: "goabx-side-menu", inputs: { testId: "testId" }, ngImport: i0, template: `
+    <goa-side-menu
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.testid]="testId"
+    >
+      <ng-content />
+    </goa-side-menu>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxSideMenu, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-side-menu",
+                    template: `
+    <goa-side-menu
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.testid]="testId"
+    >
+      <ng-content />
+    </goa-side-menu>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { testId: [{
+                type: Input
+            }] } });
+
+class GoabxSideMenuGroup extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxSideMenuGroup, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxSideMenuGroup, isStandalone: true, selector: "goabx-side-menu-group", inputs: { heading: "heading", icon: "icon" }, usesInheritance: true, ngImport: i0, template: `
+    <goa-side-menu-group
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.heading]="heading"
+      [attr.testid]="testId"
+      [attr.icon]="icon"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+    </goa-side-menu-group>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxSideMenuGroup, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-side-menu-group",
+                    template: `
+    <goa-side-menu-group
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.heading]="heading"
+      [attr.testid]="testId"
+      [attr.icon]="icon"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+    >
+      <ng-content />
+    </goa-side-menu-group>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+                type: Input,
+                args: [{ required: true }]
+            }], icon: [{
+                type: Input
+            }] } });
+
+class GoabxSideMenuHeading {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxSideMenuHeading, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxSideMenuHeading, isStandalone: true, selector: "goabx-side-menu-heading", inputs: { icon: "icon", testId: "testId", meta: "meta" }, ngImport: i0, template: `
+    <goa-side-menu-heading
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.testid]="testId"
+      [attr.icon]="icon"
+    >
+      <ng-content />
+      <span slot="meta">
+        <ng-container [ngTemplateOutlet]="meta"></ng-container>
+      </span>
+    </goa-side-menu-heading>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxSideMenuHeading, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-side-menu-heading",
+                    imports: [NgTemplateOutlet, CommonModule],
+                    template: `
+    <goa-side-menu-heading
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.testid]="testId"
+      [attr.icon]="icon"
+    >
+      <ng-content />
+      <span slot="meta">
+        <ng-container [ngTemplateOutlet]="meta"></ng-container>
+      </span>
+    </goa-side-menu-heading>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { icon: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }], meta: [{
+                type: Input
+            }] } });
+
+class GoabxTable extends GoabBaseComponent {
+    constructor(cdr) {
+        super();
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.onSort = new EventEmitter();
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    _onSort(e) {
+        const detail = e.detail;
+        this.onSort.emit(detail);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTable, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxTable, isStandalone: true, selector: "goabx-table", inputs: { width: "width", variant: "variant", striped: ["striped", "striped", booleanAttribute] }, outputs: { onSort: "onSort" }, usesInheritance: true, ngImport: i0, template: `
+    <goa-table
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.width]="width"
+      [attr.variant]="variant"
+      [attr.striped]="striped"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_sort)="_onSort($event)"
+    >
+      <table style="width: 100%;">
+        <ng-content />
+      </table>
+    </goa-table>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTable, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-table",
+                    template: `
+    <goa-table
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.width]="width"
+      [attr.variant]="variant"
+      [attr.striped]="striped"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_sort)="_onSort($event)"
+    >
+      <table style="width: 100%;">
+        <ng-content />
+      </table>
+    </goa-table>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { width: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], striped: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], onSort: [{
+                type: Output
+            }] } });
+
+class GoabxTableSortHeader {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.direction = "none";
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTableSortHeader, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxTableSortHeader, isStandalone: true, selector: "goabx-table-sort-header", inputs: { name: "name", direction: "direction" }, ngImport: i0, template: `
+    <goa-table-sort-header
+      *ngIf="isReady"
+      [attr.name]="name"
+      [attr.direction]="direction"
+    >
+      <ng-content />
+    </goa-table-sort-header>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTableSortHeader, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-table-sort-header",
+                    template: `
+    <goa-table-sort-header
+      *ngIf="isReady"
+      [attr.name]="name"
+      [attr.direction]="direction"
+    >
+      <ng-content />
+    </goa-table-sort-header>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { name: [{
+                type: Input
+            }], direction: [{
+                type: Input
+            }] } });
+
+class GoabxTextArea extends GoabControlValueAccessor {
+    constructor(cdr, renderer) {
+        super(renderer);
+        this.cdr = cdr;
+        this.countBy = "";
+        this.maxCount = -1;
+        this.autoComplete = "on";
+        this.size = "default";
+        this.onChange = new EventEmitter();
+        this.onKeyPress = new EventEmitter();
+        this.onBlur = new EventEmitter();
+        this.isReady = false;
+        this.version = "2";
+    }
+    ngOnInit() {
+        // For Angular 20, we need to delay rendering the web component
+        // to ensure all attributes are properly bound before the component initializes
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onChange(e) {
+        const detail = { ...e.detail, event: e };
+        this.onChange.emit(detail);
+        this.markAsTouched();
+        this.fcChange?.(detail.value);
+    }
+    _onKeyPress(e) {
+        const detail = { ...e.detail, event: e };
+        this.markAsTouched();
+        this.onKeyPress.emit(detail);
+    }
+    _onBlur(e) {
+        const detail = { ...e.detail, event: e };
+        this.markAsTouched();
+        this.onBlur.emit(detail);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTextArea, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxTextArea, isStandalone: true, selector: "goabx-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,
+                useExisting: forwardRef(() => GoabxTextArea),
+            },
+        ], usesInheritance: true, ngImport: i0, template: `
+    <goa-textarea
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [attr.value]="value"
+      [attr.placeholder]="placeholder"
+      [attr.rows]="rows"
+      [attr.error]="error"
+      [disabled]="disabled"
+      [attr.readonly]="readOnly"
+      [attr.width]="width"
+      [attr.maxwidth]="maxWidth"
+      [attr.arialabel]="ariaLabel"
+      [attr.countby]="countBy"
+      [attr.maxcount]="maxCount"
+      [attr.autocomplete]="autoComplete"
+      [attr.size]="size"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_change)="_onChange($event)"
+      (_keyPress)="_onKeyPress($event)"
+      (_blur)="_onBlur($event)"
+    >
+    </goa-textarea>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTextArea, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-textarea",
+                    imports: [CommonModule],
+                    template: `
+    <goa-textarea
+      #goaComponentRef
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.name]="name"
+      [attr.value]="value"
+      [attr.placeholder]="placeholder"
+      [attr.rows]="rows"
+      [attr.error]="error"
+      [disabled]="disabled"
+      [attr.readonly]="readOnly"
+      [attr.width]="width"
+      [attr.maxwidth]="maxWidth"
+      [attr.arialabel]="ariaLabel"
+      [attr.countby]="countBy"
+      [attr.maxcount]="maxCount"
+      [attr.autocomplete]="autoComplete"
+      [attr.size]="size"
+      [attr.testid]="testId"
+      [attr.mt]="mt"
+      [attr.mb]="mb"
+      [attr.ml]="ml"
+      [attr.mr]="mr"
+      (_change)="_onChange($event)"
+      (_keyPress)="_onKeyPress($event)"
+      (_blur)="_onBlur($event)"
+    >
+    </goa-textarea>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            multi: true,
+                            useExisting: forwardRef(() => GoabxTextArea),
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { name: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], rows: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], readOnly: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], width: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], countBy: [{
+                type: Input
+            }], maxCount: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], autoComplete: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }], onKeyPress: [{
+                type: Output
+            }], onBlur: [{
+                type: Output
+            }] } });
+
+class GoabxTabs {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.isReady = false;
+        this.version = "2";
+        this.onChange = new EventEmitter();
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        });
+    }
+    _onChange(e) {
+        const detail = e.detail;
+        this.onChange.emit(detail);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTabs, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxTabs, isStandalone: true, selector: "goabx-tabs", inputs: { initialTab: ["initialTab", "initialTab", numberAttribute], testId: "testId", variant: "variant" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
+    <goa-tabs
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.initialtab]="initialTab"
+      [attr.testid]="testId"
+      [attr.variant]="variant"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-tabs>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxTabs, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-tabs",
+                    template: `
+    <goa-tabs
+      *ngIf="isReady"
+      [attr.version]="version"
+      [attr.initialtab]="initialTab"
+      [attr.testid]="testId"
+      [attr.variant]="variant"
+      (_change)="_onChange($event)"
+    >
+      <ng-content />
+    </goa-tabs>
+  `,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { initialTab: [{
+                type: Input,
+                args: [{ transform: numberAttribute }]
+            }], testId: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class GoabxWorkSideMenu {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.onToggle = new EventEmitter();
+        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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    _onToggle() {
+        this.onToggle.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxWorkSideMenu, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.16", type: GoabxWorkSideMenu, isStandalone: true, selector: "goabx-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" }, ngImport: i0, template: `
+    <goa-work-side-menu
+      *ngIf="isReady"
+      [open]="open ?? false"
+      [attr.heading]="heading"
+      [attr.url]="url"
+      [attr.user-name]="userName"
+      [attr.user-secondary-text]="userSecondaryText"
+      [attr.testid]="testId"
+      (_toggle)="_onToggle()"
+    >
+      <div slot="primary">
+        <ng-container [ngTemplateOutlet]="primaryContent"></ng-container>
+      </div>
+      <div slot="secondary">
+        <ng-container [ngTemplateOutlet]="secondaryContent"></ng-container>
+      </div>
+      <div slot="account">
+        <ng-container [ngTemplateOutlet]="accountContent"></ng-container>
+      </div>
+    </goa-work-side-menu>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxWorkSideMenu, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-work-side-menu", // eslint-disable-line
+                    imports: [NgTemplateOutlet, CommonModule],
+                    template: `
+    <goa-work-side-menu
+      *ngIf="isReady"
+      [open]="open ?? false"
+      [attr.heading]="heading"
+      [attr.url]="url"
+      [attr.user-name]="userName"
+      [attr.user-secondary-text]="userSecondaryText"
+      [attr.testid]="testId"
+      (_toggle)="_onToggle()"
+    >
+      <div slot="primary">
+        <ng-container [ngTemplateOutlet]="primaryContent"></ng-container>
       </div>
       <div slot="secondary">
         <ng-container [ngTemplateOutlet]="secondaryContent"></ng-container>
@@ -6189,9 +9153,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
+class GoabxWorkSideMenuGroup {
+    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
+        setTimeout(() => {
+            this.isReady = true;
+            this.cdr.detectChanges();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxWorkSideMenuGroup, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: GoabxWorkSideMenuGroup, isStandalone: true, selector: "goabx-work-side-menu-group", inputs: { heading: "heading", icon: "icon", testId: "testId" }, ngImport: i0, template: `
+    <goa-work-side-menu-group
+      *ngIf="isReady"
+      [attr.heading]="heading"
+      [attr.icon]="icon"
+      [attr.testid]="testId"
+    >
+      <ng-content />
+    </goa-work-side-menu-group>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GoabxWorkSideMenuGroup, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: "goabx-work-side-menu-group", // eslint-disable-line
+                    imports: [CommonModule],
+                    template: `
+    <goa-work-side-menu-group
+      *ngIf="isReady"
+      [attr.heading]="heading"
+      [attr.icon]="icon"
+      [attr.testid]="testId"
+    >
+      <ng-content />
+    </goa-work-side-menu-group>
+  `,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { heading: [{
+                type: Input,
+                args: [{ required: true }]
+            }], icon: [{
+                type: Input,
+                args: [{ required: true }]
+            }], testId: [{
+                type: Input
+            }] } });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AngularComponentsModule, CheckedDirective, GoabAccordion, GoabAppFooter, GoabAppFooterMetaSection, GoabAppFooterNavSection, GoabAppHeader, GoabAppHeaderMenu, GoabBadge, GoabBlock, GoabButton, GoabButtonGroup, GoabCalendar, GoabCallout, GoabCard, GoabCardActions, GoabCardContent, GoabCardImage, GoabCheckbox, GoabCheckboxList, GoabChip, GoabCircularProgress, GoabColumnLayout, GoabContainer, GoabDataGrid, GoabDatePicker, GoabDetails, GoabDivider, GoabDrawer, GoabDropdown, GoabDropdownItem, GoabFieldset, GoabFileUploadCard, GoabFileUploadInput, GoabFilterChip, GoabFormItem, GoabFormItemSlot, GoabFormStep, GoabFormStepper, GoabGrid, GoabHeroBanner, GoabIcon, GoabIconButton, GoabInput, GoabInputNumber, GoabLinearProgress, GoabLink, GoabMenuAction, GoabMenuButton, GoabMicrositeHeader, GoabModal, GoabNotification, GoabPageBlock, GoabPages, GoabPagination, GoabPopover, GoabPublicForm, GoabPublicFormPage, GoabPublicFormSummary, GoabPublicFormTask, GoabPublicFormTaskList, GoabPublicSubform, GoabPublicSubformIndex, GoabRadioGroup, GoabRadioItem, GoabSideMenu, GoabSideMenuGroup, GoabSideMenuHeading, GoabSkeleton, GoabSpacer, GoabTab, GoabTable, GoabTableSortHeader, GoabTabs, GoabTemporaryNotificationCtrl, GoabText, GoabTextArea, GoabTooltip, GoabxWorkSideMenu, GoabxWorkSideMenuItem, ValueDirective, ValueListDirective };
+export { AngularComponentsModule, CheckedDirective, GoabAccordion, GoabAppFooter, GoabAppFooterMetaSection, GoabAppFooterNavSection, GoabAppHeader, GoabAppHeaderMenu, GoabBadge, GoabBlock, GoabButton, GoabButtonGroup, GoabCalendar, GoabCallout, GoabCard, GoabCardActions, GoabCardContent, GoabCardImage, GoabCheckbox, GoabCheckboxList, GoabChip, GoabCircularProgress, GoabColumnLayout, GoabContainer, GoabDataGrid, GoabDatePicker, GoabDetails, GoabDivider, GoabDrawer, GoabDropdown, GoabDropdownItem, GoabFieldset, GoabFileUploadCard, GoabFileUploadInput, GoabFilterChip, GoabFormItem, GoabFormItemSlot, GoabFormStep, GoabFormStepper, GoabGrid, GoabHeroBanner, GoabIcon, GoabIconButton, GoabInput, GoabInputNumber, GoabLinearProgress, GoabLink, GoabMenuAction, GoabMenuButton, GoabMicrositeHeader, GoabModal, GoabNotification, GoabPageBlock, GoabPages, GoabPagination, GoabPopover, GoabPublicForm, GoabPublicFormPage, GoabPublicFormSummary, GoabPublicFormTask, GoabPublicFormTaskList, GoabPublicSubform, GoabPublicSubformIndex, GoabRadioGroup, GoabRadioItem, GoabSideMenu, GoabSideMenuGroup, GoabSideMenuHeading, GoabSkeleton, GoabSpacer, GoabTab, GoabTable, GoabTableSortHeader, GoabTabs, GoabTemporaryNotificationCtrl, GoabText, GoabTextArea, GoabTooltip, GoabxAppFooter, GoabxAppFooterMetaSection, GoabxAppFooterNavSection, GoabxBadge, GoabxButton, GoabxCalendar, GoabxCallout, GoabxCheckbox, GoabxDatePicker, GoabxDrawer, GoabxDropdown, GoabxDropdownItem, GoabxFileUploadCard, GoabxFileUploadInput, GoabxFilterChip, GoabxFormItem, GoabxInput, GoabxLink, GoabxModal, GoabxNotification, GoabxPagination, GoabxRadioGroup, GoabxRadioItem, GoabxSideMenu, GoabxSideMenuGroup, GoabxSideMenuHeading, GoabxTable, GoabxTableSortHeader, GoabxTabs, GoabxTextArea, GoabxWorkSideMenu, GoabxWorkSideMenuGroup, GoabxWorkSideMenuItem, ValueDirective, ValueListDirective };
 //# sourceMappingURL=abgov-angular-components.mjs.map