@vsn-ux/ngx-gaia 0.2.4 → 0.3.0

package/fesm2022/vsn-ux-ngx-gaia.mjs

@@ -1,23 +1,23 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, input, numberAttribute, Component, ViewEncapsulation, Attribute, NgModule, ChangeDetectionStrategy, Injectable, makeEnvironmentProviders, booleanAttribute, output, computed, contentChild, forwardRef, Injector, signal, linkedSignal, Directive, model, HostListener, InjectionToken, effect, TemplateRef, NgZone, Input, afterRender, contentChildren, viewChild } from '@angular/core';
+import { inject, ElementRef, input, numberAttribute, Component, ViewEncapsulation, Attribute, NgModule, ChangeDetectionStrategy, Injectable, makeEnvironmentProviders, booleanAttribute, output, computed, contentChild, forwardRef, Injector, signal, linkedSignal, Directive, model, HostListener, InjectionToken, TemplateRef, NgZone, Input, effect, afterRender, contentChildren, viewChild } from '@angular/core';
 import * as i1 from 'lucide-angular';
 import { LucideAngularModule, X, CircleCheck, TriangleAlert, OctagonAlert, Info, Minus, Check, ChevronUp, ChevronDown } from 'lucide-angular';
 import { NG_VALUE_ACCESSOR, NgControl, NG_VALIDATORS, CheckboxRequiredValidator, RequiredValidator } from '@angular/forms';
-import { DOCUMENT, NgTemplateOutlet } from '@angular/common';
-import * as i1$1 from '@angular/cdk/menu';
-import { CdkMenu, CdkMenuItem, CdkMenuTrigger } from '@angular/cdk/menu';
-import { toSignal } from '@angular/core/rxjs-interop';
-import { merge, map, Subject, takeUntil } from 'rxjs';
+import { NgTemplateOutlet, DOCUMENT } from '@angular/common';
 import * as i1$3 from '@angular/cdk/overlay';
 import { Overlay, CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
+import { Subject, takeUntil, map, merge } from 'rxjs';
 import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
+import * as i1$1 from '@angular/cdk/menu';
+import { CdkMenu, CdkMenuItem, CdkMenuTrigger } from '@angular/cdk/menu';
+import { toSignal } from '@angular/core/rxjs-interop';
 import * as i1$2 from '@angular/cdk/listbox';
 import { CdkOption, CdkListbox } from '@angular/cdk/listbox';
 
 class GaIconComponent {
     elementRef = inject(ElementRef);
-    icon = input();
+    icon = input.required();
     size = input();
     color = input();
     strokeWidth = input(undefined, { transform: numberAttribute });
@@ -27,7 +27,7 @@ class GaIconComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaIconComponent, deps: [{ token: 'aria-hidden', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.5", type: GaIconComponent, isStandalone: true, selector: "ga-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "img" }, classAttribute: "ga-icon" }, ngImport: i0, template: `<lucide-icon
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.5", type: GaIconComponent, isStandalone: true, selector: "ga-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "img" }, classAttribute: "ga-icon" }, ngImport: i0, template: `<lucide-icon
     [name]="icon()"
     [size]="size()"
     [color]="color()"
@@ -573,8 +573,11 @@ class GaFormControlDirective {
     _formControlId = input(undefined, {
         alias: 'gaFormControl',
     });
+    _formControlDisabled = input(undefined, {
+        alias: 'gaFormControlDisabled',
+    });
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.5", type: GaFormControlDirective, isStandalone: true, selector: "[gaFormControl]", inputs: { _formControlId: { classPropertyName: "_formControlId", publicName: "gaFormControl", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.5", type: GaFormControlDirective, isStandalone: true, selector: "[gaFormControl]", inputs: { _formControlId: { classPropertyName: "_formControlId", publicName: "gaFormControl", isSignal: true, isRequired: false, transformFunction: null }, _formControlDisabled: { classPropertyName: "_formControlDisabled", publicName: "gaFormControlDisabled", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             { provide: GA_FORM_CONTROL, useExisting: GaFormControlDirective },
         ], ngImport: i0 });
 }
@@ -603,14 +606,20 @@ class GaInputDirective {
         transform: booleanAttribute,
     });
     idInput = input(undefined, { alias: 'id' });
+    disabledInput = input(false, {
+        alias: 'disabled',
+        transform: booleanAttribute,
+    });
     invalid = computed(() => {
         return this.invalidInput() ?? this.implicitInvalid();
     });
     id = computed(() => {
         return this.idInput() ?? this.uniqueId;
     });
+    disabled = linkedSignal(() => this.disabledInput());
     errors = this.implicitErrors.asReadonly();
     _formControlId = this.id;
+    _formControlDisabled = computed(() => this.disabled());
     ngDoCheck() {
         if (this.hasWrapper)
             return;
@@ -619,10 +628,11 @@ class GaInputDirective {
         if (implicitNgControl) {
             this.implicitInvalid.set(!!implicitNgControl.invalid && !!implicitNgControl.dirty);
             this.implicitErrors.set(implicitNgControl.errors);
+            this.disabled.set(!!implicitNgControl.disabled);
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.5", type: GaInputDirective, isStandalone: true, selector: "[gaInput]", inputs: { invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()", "class.ga-input": "!hasWrapper", "class.ga-input--invalid": "!hasWrapper && invalid()" } }, providers: [{ provide: GA_FORM_CONTROL, useExisting: GaInputDirective }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.5", type: GaInputDirective, isStandalone: true, selector: "[gaInput]", inputs: { invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()", "class.ga-input": "!hasWrapper", "class.ga-input--invalid": "!hasWrapper && invalid()" } }, providers: [{ provide: GA_FORM_CONTROL, useExisting: GaInputDirective }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaInputDirective, decorators: [{
             type: Component,
@@ -669,230 +679,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                     }, template: "<ng-content />\n" }]
         }] });
 
-class GaFieldLabelComponent {
-    document = inject(DOCUMENT);
-    formField = inject(GaFormFieldComponent);
-    for = input();
-    controlId = computed(() => {
-        return this.for() ?? this.formField.controlId();
-    });
-    controlElement = computed(() => {
-        const control = this.document.querySelector(`#${this.controlId()}`);
-        if (control instanceof HTMLElement) {
-            return control;
-        }
-        return null;
-    });
-    focusControl() {
-        const control = this.controlElement();
-        // only focus custom elements as native elements already
-        // have support for connecting label and reacting to events
-        if (control?.tagName.includes('-')) {
-            control.focus();
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.5", type: GaFieldLabelComponent, isStandalone: true, selector: "ga-label", inputs: { for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `<label
-    [attr.for]="controlId()"
-    class="ga-form-field__label"
-    (click)="focusControl()"
-    ><ng-content
-  /></label>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldLabelComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ga-label',
-                    template: `<label
-    [attr.for]="controlId()"
-    class="ga-form-field__label"
-    (click)="focusControl()"
-    ><ng-content
-  /></label>`,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }] });
-
-class GaFieldInfoComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaFieldInfoComponent, isStandalone: true, selector: "ga-info", host: { classAttribute: "ga-form-field__info" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldInfoComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ga-info',
-                    template: `<ng-content />`,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
-                        class: 'ga-form-field__info',
-                    },
-                }]
-        }] });
-
-class GaFormFieldModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule, imports: [GaFormFieldComponent,
-            GaFieldLabelComponent,
-            GaFieldInfoComponent,
-            GaFormControlDirective], exports: [GaFormFieldComponent,
-            GaFieldLabelComponent,
-            GaFieldInfoComponent,
-            GaFormControlDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        GaFormFieldComponent,
-                        GaFieldLabelComponent,
-                        GaFieldInfoComponent,
-                        GaFormControlDirective,
-                    ],
-                    exports: [
-                        GaFormFieldComponent,
-                        GaFieldLabelComponent,
-                        GaFieldInfoComponent,
-                        GaFormControlDirective,
-                    ],
-                }]
-        }] });
-
-class GaMenuComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuComponent, isStandalone: true, selector: "ga-menu", host: { classAttribute: "ga-menu" }, hostDirectives: [{ directive: i1$1.CdkMenu }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host{margin-top:var(--ga-size-8);margin-bottom:var(--ga-size-8)}\n"] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ga-menu', template: `<ng-content />`, hostDirectives: [CdkMenu], host: {
-                        class: 'ga-menu',
-                    }, styles: [":host{margin-top:var(--ga-size-8);margin-bottom:var(--ga-size-8)}\n"] }]
-        }] });
-
-class GaMenuItemComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuItemComponent, isStandalone: true, selector: "[gaMenuItem]", host: { classAttribute: "ga-menu__item" }, hostDirectives: [{ directive: i1$1.CdkMenuItem }], ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuItemComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: '[gaMenuItem]',
-                    template: `<ng-content />`,
-                    hostDirectives: [CdkMenuItem],
-                    host: {
-                        class: 'ga-menu__item',
-                    },
-                }]
-        }] });
-
-class GaMenuTitleComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuTitleComponent, isStandalone: true, selector: "ga-menu-title", host: { classAttribute: "ga-menu__title" }, ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTitleComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ga-menu-title',
-                    template: `<ng-content />`,
-                    host: {
-                        class: 'ga-menu__title',
-                    },
-                }]
-        }] });
-
-class GaMenuTriggerDirective {
-    cdkMenuTrigger = inject(CdkMenuTrigger);
-    menuRef = input.required({
-        alias: 'gaMenuTrigger',
-    });
-    isOpen = toSignal(merge(this.cdkMenuTrigger.opened.pipe(map(() => true)), this.cdkMenuTrigger.closed.pipe(map(() => false))), { initialValue: this.cdkMenuTrigger.isOpen() });
-    constructor() {
-        effect(() => {
-            this.cdkMenuTrigger.menuTemplateRef = this.menuRef();
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.5", type: GaMenuTriggerDirective, isStandalone: true, selector: "[gaMenuTrigger]", inputs: { menuRef: { classPropertyName: "menuRef", publicName: "gaMenuTrigger", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["gaMenuTrigger"], hostDirectives: [{ directive: i1$1.CdkMenuTrigger }], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[gaMenuTrigger]',
-                    exportAs: 'gaMenuTrigger',
-                    standalone: true,
-                    hostDirectives: [CdkMenuTrigger],
-                }]
-        }], ctorParameters: () => [] });
-
-class GaMenuSeparatorComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuSeparatorComponent, isStandalone: true, selector: "ga-menu-separator", host: { classAttribute: "ga-menu__separator" }, ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuSeparatorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ga-menu-separator',
-                    template: `<ng-content />`,
-                    host: {
-                        class: 'ga-menu__separator',
-                    },
-                }]
-        }] });
-
-class GaMenuTriggerIconComponent {
-    menuTrigger = inject(GaMenuTriggerDirective);
-    icon = computed(() => {
-        return this.menuTrigger.isOpen() ? ChevronUp : ChevronDown;
-    });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuTriggerIconComponent, isStandalone: true, selector: "ga-menu-trigger-icon", ngImport: i0, template: `<ga-icon [icon]="icon()" />`, isInline: true, dependencies: [{ kind: "ngmodule", type: GaIconModule }, { kind: "component", type: GaIconComponent, selector: "ga-icon", inputs: ["icon", "size", "color", "strokeWidth"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerIconComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ga-menu-trigger-icon',
-                    imports: [GaIconModule],
-                    template: `<ga-icon [icon]="icon()" />`,
-                }]
-        }] });
-
-class GaMenuModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, imports: [GaMenuComponent,
-            GaMenuItemComponent,
-            GaMenuTriggerDirective,
-            GaMenuSeparatorComponent,
-            GaMenuTitleComponent,
-            GaMenuTriggerIconComponent], exports: [GaMenuComponent,
-            GaMenuItemComponent,
-            GaMenuTriggerDirective,
-            GaMenuSeparatorComponent,
-            GaMenuTitleComponent,
-            GaMenuTriggerIconComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, imports: [GaMenuTriggerIconComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        GaMenuComponent,
-                        GaMenuItemComponent,
-                        GaMenuTriggerDirective,
-                        GaMenuSeparatorComponent,
-                        GaMenuTitleComponent,
-                        GaMenuTriggerIconComponent,
-                    ],
-                    exports: [
-                        GaMenuComponent,
-                        GaMenuItemComponent,
-                        GaMenuTriggerDirective,
-                        GaMenuSeparatorComponent,
-                        GaMenuTitleComponent,
-                        GaMenuTriggerIconComponent,
-                    ],
-                }]
-        }] });
-
 class GaTooltipComponent {
     mouseLeaveSubject = new Subject();
     afterMouseLeave = () => this.mouseLeaveSubject.asObservable();
@@ -1274,6 +1060,219 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                 }]
         }] });
 
+class GaFieldLabelComponent {
+    document = inject(DOCUMENT);
+    formField = inject(GaFormFieldComponent);
+    for = input();
+    definition = input(null);
+    state = input();
+    controlId = computed(() => {
+        return this.for() ?? this.formField.controlId();
+    });
+    controlElement = computed(() => {
+        const control = this.document.querySelector(`#${this.controlId()}`);
+        if (control instanceof HTMLElement) {
+            return control;
+        }
+        return null;
+    });
+    focusControl() {
+        const control = this.controlElement();
+        // only focus custom elements as native elements already
+        // have support for connecting label and reacting to events
+        if (control?.tagName.includes('-')) {
+            control.focus();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: GaFieldLabelComponent, isStandalone: true, selector: "ga-label", inputs: { for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null }, definition: { classPropertyName: "definition", publicName: "definition", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<label\n  [attr.for]=\"controlId()\"\n  class=\"ga-form-field__label\"\n  [class.ga-form-field__label--defined]=\"!!definition()\"\n  [class.ga-form-field__label--disabled]=\"\n    !!formField.formControl()?._formControlDisabled()\n  \"\n  (click)=\"focusControl()\"\n  [attr.tabindex]=\"definition() ? 0 : -1\"\n>\n  <span\n    class=\"ga-form-field__label-text\"\n    [gaTooltip]=\"definition()\"\n    gaTooltipPlacement=\"top-start\"\n    ><ng-content\n  /></span>\n  @if (state()) {\n    <span class=\"ga-form-field__label-state\">{{ state() }}</span>\n  }\n</label>\n", dependencies: [{ kind: "ngmodule", type: GaTooltipModule }, { kind: "directive", type: GaTooltipDirective, selector: "[gaTooltip]", inputs: ["gaTooltip", "gaTooltipDisabled", "gaTooltipControlMode", "gaTooltipShowControlMode", "gaTooltipHideControlMode", "gaTooltipOffsetSize", "gaTooltipPlacement"], exportAs: ["gaTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldLabelComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ga-label', imports: [GaTooltipModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label\n  [attr.for]=\"controlId()\"\n  class=\"ga-form-field__label\"\n  [class.ga-form-field__label--defined]=\"!!definition()\"\n  [class.ga-form-field__label--disabled]=\"\n    !!formField.formControl()?._formControlDisabled()\n  \"\n  (click)=\"focusControl()\"\n  [attr.tabindex]=\"definition() ? 0 : -1\"\n>\n  <span\n    class=\"ga-form-field__label-text\"\n    [gaTooltip]=\"definition()\"\n    gaTooltipPlacement=\"top-start\"\n    ><ng-content\n  /></span>\n  @if (state()) {\n    <span class=\"ga-form-field__label-state\">{{ state() }}</span>\n  }\n</label>\n" }]
+        }] });
+
+class GaFieldInfoComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaFieldInfoComponent, isStandalone: true, selector: "ga-info", host: { classAttribute: "ga-form-field__info" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFieldInfoComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ga-info',
+                    template: `<ng-content />`,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        class: 'ga-form-field__info',
+                    },
+                }]
+        }] });
+
+class GaFormFieldModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule, imports: [GaFormFieldComponent,
+            GaFieldLabelComponent,
+            GaFieldInfoComponent,
+            GaFormControlDirective], exports: [GaFormFieldComponent,
+            GaFieldLabelComponent,
+            GaFieldInfoComponent,
+            GaFormControlDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaFormFieldModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        GaFormFieldComponent,
+                        GaFieldLabelComponent,
+                        GaFieldInfoComponent,
+                        GaFormControlDirective,
+                    ],
+                    exports: [
+                        GaFormFieldComponent,
+                        GaFieldLabelComponent,
+                        GaFieldInfoComponent,
+                        GaFormControlDirective,
+                    ],
+                }]
+        }] });
+
+class GaMenuComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuComponent, isStandalone: true, selector: "ga-menu", host: { classAttribute: "ga-menu" }, hostDirectives: [{ directive: i1$1.CdkMenu }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host{margin-top:var(--ga-size-8);margin-bottom:var(--ga-size-8)}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ga-menu', template: `<ng-content />`, hostDirectives: [CdkMenu], host: {
+                        class: 'ga-menu',
+                    }, styles: [":host{margin-top:var(--ga-size-8);margin-bottom:var(--ga-size-8)}\n"] }]
+        }] });
+
+class GaMenuItemComponent {
+    icon = input(undefined, {
+        alias: 'gaMenuItemIcon',
+    });
+    description = input('', { alias: 'gaMenuItemDescription' });
+    shortcut = input('', { alias: 'gaMenuItemShortcut' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: GaMenuItemComponent, isStandalone: true, selector: "[gaMenuItem]", inputs: { icon: { classPropertyName: "icon", publicName: "gaMenuItemIcon", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "gaMenuItemDescription", isSignal: true, isRequired: false, transformFunction: null }, shortcut: { classPropertyName: "shortcut", publicName: "gaMenuItemShortcut", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ga-menu__item" }, hostDirectives: [{ directive: i1$1.CdkMenuItem }], ngImport: i0, template: "@if (icon()) {\n  <ga-icon [icon]=\"icon()!\" class=\"ga-menu__item-icon\" size=\"16\" />\n}\n<div class=\"ga-menu__item-content\">\n  <div class=\"ga-menu__item-title\">\n    <div class=\"ga-menu__item-label\"><ng-content /></div>\n    @if (shortcut()) {\n      <span class=\"ga-menu__item-shortcut\">{{ shortcut() }}</span>\n    }\n  </div>\n  @if (description()) {\n    <div class=\"ga-menu__item-description\">{{ description() }}</div>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: GaIconModule }, { kind: "component", type: GaIconComponent, selector: "ga-icon", inputs: ["icon", "size", "color", "strokeWidth"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: '[gaMenuItem]', imports: [GaIconModule], hostDirectives: [CdkMenuItem], host: {
+                        class: 'ga-menu__item',
+                    }, template: "@if (icon()) {\n  <ga-icon [icon]=\"icon()!\" class=\"ga-menu__item-icon\" size=\"16\" />\n}\n<div class=\"ga-menu__item-content\">\n  <div class=\"ga-menu__item-title\">\n    <div class=\"ga-menu__item-label\"><ng-content /></div>\n    @if (shortcut()) {\n      <span class=\"ga-menu__item-shortcut\">{{ shortcut() }}</span>\n    }\n  </div>\n  @if (description()) {\n    <div class=\"ga-menu__item-description\">{{ description() }}</div>\n  }\n</div>\n" }]
+        }] });
+
+class GaMenuTitleComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuTitleComponent, isStandalone: true, selector: "ga-menu-title", host: { classAttribute: "ga-menu__title" }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ga-menu-title',
+                    template: `<ng-content />`,
+                    host: {
+                        class: 'ga-menu__title',
+                    },
+                }]
+        }] });
+
+class GaMenuTriggerDirective {
+    cdkMenuTrigger = inject(CdkMenuTrigger);
+    menuRef = input.required({
+        alias: 'gaMenuTrigger',
+    });
+    isOpen = toSignal(merge(this.cdkMenuTrigger.opened.pipe(map(() => true)), this.cdkMenuTrigger.closed.pipe(map(() => false))), { initialValue: this.cdkMenuTrigger.isOpen() });
+    constructor() {
+        effect(() => {
+            this.cdkMenuTrigger.menuTemplateRef = this.menuRef();
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.5", type: GaMenuTriggerDirective, isStandalone: true, selector: "[gaMenuTrigger]", inputs: { menuRef: { classPropertyName: "menuRef", publicName: "gaMenuTrigger", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["gaMenuTrigger"], hostDirectives: [{ directive: i1$1.CdkMenuTrigger }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[gaMenuTrigger]',
+                    exportAs: 'gaMenuTrigger',
+                    standalone: true,
+                    hostDirectives: [CdkMenuTrigger],
+                }]
+        }], ctorParameters: () => [] });
+
+class GaMenuSeparatorComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuSeparatorComponent, isStandalone: true, selector: "ga-menu-separator", host: { classAttribute: "ga-menu__separator" }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuSeparatorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ga-menu-separator',
+                    template: `<ng-content />`,
+                    host: {
+                        class: 'ga-menu__separator',
+                    },
+                }]
+        }] });
+
+class GaMenuTriggerIconComponent {
+    menuTrigger = inject(GaMenuTriggerDirective);
+    icon = computed(() => {
+        return this.menuTrigger.isOpen() ? ChevronUp : ChevronDown;
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: GaMenuTriggerIconComponent, isStandalone: true, selector: "ga-menu-trigger-icon", ngImport: i0, template: `<ga-icon [icon]="icon()" />`, isInline: true, dependencies: [{ kind: "ngmodule", type: GaIconModule }, { kind: "component", type: GaIconComponent, selector: "ga-icon", inputs: ["icon", "size", "color", "strokeWidth"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuTriggerIconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ga-menu-trigger-icon',
+                    imports: [GaIconModule],
+                    template: `<ga-icon [icon]="icon()" />`,
+                }]
+        }] });
+
+class GaMenuModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, imports: [GaMenuComponent,
+            GaMenuItemComponent,
+            GaMenuTriggerDirective,
+            GaMenuSeparatorComponent,
+            GaMenuTitleComponent,
+            GaMenuTriggerIconComponent], exports: [GaMenuComponent,
+            GaMenuItemComponent,
+            GaMenuTriggerDirective,
+            GaMenuSeparatorComponent,
+            GaMenuTitleComponent,
+            GaMenuTriggerIconComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, imports: [GaMenuItemComponent,
+            GaMenuTriggerIconComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaMenuModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        GaMenuComponent,
+                        GaMenuItemComponent,
+                        GaMenuTriggerDirective,
+                        GaMenuSeparatorComponent,
+                        GaMenuTitleComponent,
+                        GaMenuTriggerIconComponent,
+                    ],
+                    exports: [
+                        GaMenuComponent,
+                        GaMenuItemComponent,
+                        GaMenuTriggerDirective,
+                        GaMenuSeparatorComponent,
+                        GaMenuTitleComponent,
+                        GaMenuTriggerIconComponent,
+                    ],
+                }]
+        }] });
+
 /**
  * Provider Expression that allows ga-radio-group to register as a ControlValueAccessor.
  * This allows it to support [(ngModel)] and ngControl.
@@ -1462,7 +1461,7 @@ class GaOptionComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: GaOptionComponent, isStandalone: true, selector: "ga-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, withInput: { classPropertyName: "withInput", publicName: "withInput", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick()" }, properties: { "class.ga-dropdown__item--selected": "selected()", "class.ga-dropdown__item--disabled": "cdkOption.disabled", "class.ga-dropdown__item--active": "active() && !cdkOption.disabled" }, classAttribute: "ga-dropdown__item" }, hostDirectives: [{ directive: i1$2.CdkOption, inputs: ["cdkOption", "value", "cdkOptionDisabled", "disabled", "cdkOptionTypeaheadLabel", "typeaheadLabel"] }], ngImport: i0, template: "@if (withInput()) {\n  @if (selectComponent.multiple()) {\n    <ga-checkbox\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  } @else {\n    <ga-radio-button\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  }\n}\n<ng-content />\n", dependencies: [{ kind: "ngmodule", type: GaCheckboxModule }, { kind: "component", type: GaCheckboxComponent, selector: "ga-checkbox", inputs: ["value", "disabled", "checked", "name", "id", "indeterminate", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage", "required"], outputs: ["change", "indeterminateChange"] }, { kind: "ngmodule", type: GaRadioModule }, { kind: "component", type: GaRadioButtonComponent, selector: "ga-radio-button", inputs: ["value", "id", "name", "checked", "disabled", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage"], outputs: ["change"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: GaOptionComponent, isStandalone: true, selector: "ga-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, withInput: { classPropertyName: "withInput", publicName: "withInput", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick()" }, properties: { "class.ga-dropdown__item--selected": "selected()", "class.ga-dropdown__item--disabled": "cdkOption.disabled", "class.ga-dropdown__item--active": "active() && !cdkOption.disabled" }, classAttribute: "ga-dropdown__item" }, hostDirectives: [{ directive: i1$2.CdkOption, inputs: ["cdkOption", "value", "cdkOptionDisabled", "disabled", "cdkOptionTypeaheadLabel", "typeaheadLabel"] }], ngImport: i0, template: "@if (withInput()) {\n  @if (selectComponent.multiple()) {\n    <ga-checkbox\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  } @else {\n    <ga-radio-button\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  }\n}\n<div class=\"ga-dropdown__item-label\"><ng-content /></div>\n", dependencies: [{ kind: "ngmodule", type: GaCheckboxModule }, { kind: "component", type: GaCheckboxComponent, selector: "ga-checkbox", inputs: ["value", "disabled", "checked", "name", "id", "indeterminate", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage", "required"], outputs: ["change", "indeterminateChange"] }, { kind: "ngmodule", type: GaRadioModule }, { kind: "component", type: GaRadioButtonComponent, selector: "ga-radio-button", inputs: ["value", "id", "name", "checked", "disabled", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage"], outputs: ["change"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaOptionComponent, decorators: [{
             type: Component,
@@ -1481,7 +1480,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                         '[class.ga-dropdown__item--disabled]': 'cdkOption.disabled',
                         '[class.ga-dropdown__item--active]': 'active() && !cdkOption.disabled',
                         '(click)': 'onClick()',
-                    }, template: "@if (withInput()) {\n  @if (selectComponent.multiple()) {\n    <ga-checkbox\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  } @else {\n    <ga-radio-button\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  }\n}\n<ng-content />\n" }]
+                    }, template: "@if (withInput()) {\n  @if (selectComponent.multiple()) {\n    <ga-checkbox\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  } @else {\n    <ga-radio-button\n      [checked]=\"selected()\"\n      [disabled]=\"disabled()\"\n      aria-hidden=\"true\"\n      style=\"pointer-events: none\"\n      tabindex=\"-1\"\n    />\n  }\n}\n<div class=\"ga-dropdown__item-label\"><ng-content /></div>\n" }]
         }], ctorParameters: () => [] });
 
 class GaSelectValueComponent {
@@ -1574,6 +1573,8 @@ class GaSelectComponent {
     textValue = model('');
     leftIcon = input();
     idInput = input(null, { alias: 'id' });
+    opened = output();
+    closed = output();
     // TODO: if we rename this to options, it breaks, why?
     gaOptions = contentChildren(GaOptionComponent, {
         descendants: true,
@@ -1609,6 +1610,7 @@ class GaSelectComponent {
         return this.invalidInput() ?? this.implicitInvalid();
     });
     _formControlId = computed(() => this.id());
+    _formControlDisabled = computed(() => this.disabled());
     constructor() {
         effect(() => {
             // if the select became disabled while open, close it
@@ -1739,12 +1741,14 @@ class GaSelectComponent {
         else {
             this.focusListbox();
         }
+        this.opened.emit();
     }
     onOverlayDetach() {
         this._isOpen.set(false);
         this.focusedTriggerElement?.focus();
         this.textValue.set('');
         this._onTouched?.();
+        this.closed.emit();
     }
     setItemActive(direction) {
         const options = this.gaOptions();
@@ -1766,7 +1770,7 @@ class GaSelectComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: GaSelectComponent, isStandalone: true, selector: "ga-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, leftIcon: { classPropertyName: "leftIcon", publicName: "leftIcon", isSignal: true, isRequired: false, transformFunction: null }, idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", textValue: "textValueChange" }, host: { attributes: { "role": "combobox", "aria-haspopup": "listbox" }, listeners: { "click": "toggle()", "keydown.arrowdown": "open(); $event.preventDefault()", "keydown.space": "open(); $event.preventDefault()", "keydown.enter": "open(); $event.preventDefault()" }, properties: { "attr.id": "id()", "class.ga-select--expanded": "isOpen()", "class.ga-select--disabled": "disabled()", "class.ga-select--invalid": "invalid()", "class.ga-select--empty": "!hasValue()", "attr.aria-expanded": "isOpen()", "attr.aria-controls": "cdkListbox().id", "attr.aria-invalid": "invalid()", "attr.aria-disabled": "disabled()", "attr.aria-owns": "searchable() ? cdkListbox().id : null", "attr.aria-activedescendant": "!searchable() ? activeDescendantId() : null", "attr.tabindex": "disabled() ? -1 : 0" }, classAttribute: "ga-select" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: GaSelectComponent, isStandalone: true, selector: "ga-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, leftIcon: { classPropertyName: "leftIcon", publicName: "leftIcon", isSignal: true, isRequired: false, transformFunction: null }, idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", textValue: "textValueChange", opened: "opened", closed: "closed" }, host: { attributes: { "role": "combobox", "aria-haspopup": "listbox" }, listeners: { "click": "toggle()", "keydown.arrowdown": "open(); $event.preventDefault()", "keydown.space": "open(); $event.preventDefault()", "keydown.enter": "open(); $event.preventDefault()" }, properties: { "attr.id": "id()", "class.ga-select--expanded": "isOpen()", "class.ga-select--disabled": "disabled()", "class.ga-select--invalid": "invalid()", "class.ga-select--empty": "!hasValue()", "attr.aria-expanded": "isOpen()", "attr.aria-controls": "cdkListbox().id", "attr.aria-invalid": "invalid()", "attr.aria-disabled": "disabled()", "attr.aria-owns": "searchable() ? cdkListbox().id : null", "attr.aria-activedescendant": "!searchable() ? activeDescendantId() : null", "attr.tabindex": "disabled() ? -1 : 0" }, classAttribute: "ga-select" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => GaSelectComponent),
@@ -1776,7 +1780,7 @@ class GaSelectComponent {
                 provide: GA_FORM_CONTROL,
                 useExisting: forwardRef(() => GaSelectComponent),
             },
-        ], queries: [{ propertyName: "gaOptions", predicate: GaOptionComponent, descendants: true, read: GaOptionComponent, isSignal: true }, { propertyName: "cdkListbox", first: true, predicate: CdkListbox, descendants: true, isSignal: true }, { propertyName: "customSelectValue", first: true, predicate: GaSelectValueComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputSearch", first: true, predicate: ["inputSearch"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["ngContent"], descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1$3.CdkOverlayOrigin }], ngImport: i0, template: "@if (leftIcon()) {\n  <ga-icon [icon]=\"leftIcon()\" />\n}\n@if (searchable() && isOpen()) {\n  <input\n    #inputSearch\n    type=\"text\"\n    class=\"ga-select__input\"\n    aria-autocomplete=\"list\"\n    [value]=\"textValue()\"\n    (input)=\"textValue.set(inputSearch.value)\"\n    (click)=\"$event.stopPropagation()\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [attr.aria-controls]=\"cdkListbox().id\"\n    [attr.aria-activedescendant]=\"activeDescendantId()\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"onInputKeyDown($event)\"\n    tabindex=\"-1\"\n  />\n} @else if (hasValue()) {\n  <div class=\"ga-select__value\">\n    @if (customSelectValue()) {\n      <ng-content select=\"ga-select-value\" />\n    } @else {\n      <ga-select-default-value />\n    }\n  </div>\n} @else {\n  <div class=\"ga-select__placeholder\">\n    {{ placeholder() }}\n  </div>\n}\n<ga-icon [icon]=\"menuStatusIcon()\" />\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayLockPosition\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"positions\"\n  (overlayOutsideClick)=\"close()\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <ng-content select=\"ga-select-dropdown\" />\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: GaIconModule }, { kind: "component", type: GaIconComponent, selector: "ga-icon", inputs: ["icon", "size", "color", "strokeWidth"] }, { kind: "ngmodule", type: GaButtonModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$3.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: GaSelectDefaultValueComponent, selector: "ga-select-default-value" }] });
+        ], queries: [{ propertyName: "gaOptions", predicate: GaOptionComponent, descendants: true, read: GaOptionComponent, isSignal: true }, { propertyName: "cdkListbox", first: true, predicate: CdkListbox, descendants: true, isSignal: true }, { propertyName: "customSelectValue", first: true, predicate: GaSelectValueComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputSearch", first: true, predicate: ["inputSearch"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["ngContent"], descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1$3.CdkOverlayOrigin }], ngImport: i0, template: "@if (leftIcon()) {\n  <ga-icon [icon]=\"leftIcon()!\" />\n}\n@if (searchable() && isOpen()) {\n  <input\n    #inputSearch\n    type=\"text\"\n    class=\"ga-select__input\"\n    aria-autocomplete=\"list\"\n    [value]=\"textValue()\"\n    (input)=\"textValue.set(inputSearch.value)\"\n    (click)=\"$event.stopPropagation()\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [attr.aria-controls]=\"cdkListbox().id\"\n    [attr.aria-activedescendant]=\"activeDescendantId()\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"onInputKeyDown($event)\"\n    tabindex=\"-1\"\n  />\n} @else if (hasValue()) {\n  <div class=\"ga-select__value\">\n    @if (customSelectValue()) {\n      <ng-content select=\"ga-select-value\" />\n    } @else {\n      <ga-select-default-value />\n    }\n  </div>\n} @else {\n  <div class=\"ga-select__placeholder\">\n    {{ placeholder() }}\n  </div>\n}\n<ga-icon [icon]=\"menuStatusIcon()\" />\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayLockPosition\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"positions\"\n  (overlayOutsideClick)=\"close()\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <ng-content select=\"ga-select-dropdown\" />\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: GaIconModule }, { kind: "component", type: GaIconComponent, selector: "ga-icon", inputs: ["icon", "size", "color", "strokeWidth"] }, { kind: "ngmodule", type: GaButtonModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$3.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: GaSelectDefaultValueComponent, selector: "ga-select-default-value" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: GaSelectComponent, decorators: [{
             type: Component,
@@ -1815,7 +1819,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                         '(keydown.arrowdown)': 'open(); $event.preventDefault()',
                         '(keydown.space)': 'open(); $event.preventDefault()',
                         '(keydown.enter)': 'open(); $event.preventDefault()',
-                    }, template: "@if (leftIcon()) {\n  <ga-icon [icon]=\"leftIcon()\" />\n}\n@if (searchable() && isOpen()) {\n  <input\n    #inputSearch\n    type=\"text\"\n    class=\"ga-select__input\"\n    aria-autocomplete=\"list\"\n    [value]=\"textValue()\"\n    (input)=\"textValue.set(inputSearch.value)\"\n    (click)=\"$event.stopPropagation()\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [attr.aria-controls]=\"cdkListbox().id\"\n    [attr.aria-activedescendant]=\"activeDescendantId()\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"onInputKeyDown($event)\"\n    tabindex=\"-1\"\n  />\n} @else if (hasValue()) {\n  <div class=\"ga-select__value\">\n    @if (customSelectValue()) {\n      <ng-content select=\"ga-select-value\" />\n    } @else {\n      <ga-select-default-value />\n    }\n  </div>\n} @else {\n  <div class=\"ga-select__placeholder\">\n    {{ placeholder() }}\n  </div>\n}\n<ga-icon [icon]=\"menuStatusIcon()\" />\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayLockPosition\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"positions\"\n  (overlayOutsideClick)=\"close()\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <ng-content select=\"ga-select-dropdown\" />\n</ng-template>\n" }]
+                    }, template: "@if (leftIcon()) {\n  <ga-icon [icon]=\"leftIcon()!\" />\n}\n@if (searchable() && isOpen()) {\n  <input\n    #inputSearch\n    type=\"text\"\n    class=\"ga-select__input\"\n    aria-autocomplete=\"list\"\n    [value]=\"textValue()\"\n    (input)=\"textValue.set(inputSearch.value)\"\n    (click)=\"$event.stopPropagation()\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [attr.aria-controls]=\"cdkListbox().id\"\n    [attr.aria-activedescendant]=\"activeDescendantId()\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"onInputKeyDown($event)\"\n    tabindex=\"-1\"\n  />\n} @else if (hasValue()) {\n  <div class=\"ga-select__value\">\n    @if (customSelectValue()) {\n      <ng-content select=\"ga-select-value\" />\n    } @else {\n      <ga-select-default-value />\n    }\n  </div>\n} @else {\n  <div class=\"ga-select__placeholder\">\n    {{ placeholder() }}\n  </div>\n}\n<ga-icon [icon]=\"menuStatusIcon()\" />\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayLockPosition\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"positions\"\n  (overlayOutsideClick)=\"close()\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <ng-content select=\"ga-select-dropdown\" />\n</ng-template>\n" }]
         }], ctorParameters: () => [] });
 
 class GaOptgroupComponent {