@vsn-ux/ngx-gaia 0.9.11 → 0.9.13

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2025 Visma Software AS
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

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

@@ -18,7 +18,7 @@ import { CdkTrapFocus } from '@angular/cdk/a11y';
 import * as i1$4 from '@angular/cdk/scrolling';
 import { CdkScrollable } from '@angular/cdk/scrolling';
 import * as i1$5 from '@angular/cdk/listbox';
-import { CdkOption, CdkListbox } from '@angular/cdk/listbox';
+import { CdkOption, CdkListbox, CdkListboxModule } from '@angular/cdk/listbox';
 
 /**
  * Injection token that provides the base root font size in pixels.
@@ -1301,6 +1301,9 @@ class GaInputDirective {
             this.renderer.setAttribute(this.elementRef.nativeElement, 'placeholder', '');
         }
     }
+    focus() {
+        this.elementRef.nativeElement.focus();
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaInputDirective, deps: [{ token: 'placeholder', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.4", 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()", "attr.disabled": "disabled() ? \"\" : null" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
@@ -1326,7 +1329,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImpor
 class GaInputComponent {
     gaInput = contentChild.required(GaInputDirective);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.4", type: GaInputComponent, isStandalone: true, selector: "ga-input", host: { properties: { "class.ga-input--invalid": "gaInput().invalid()" }, classAttribute: "ga-input" }, queries: [{ propertyName: "gaInput", first: true, predicate: GaInputDirective, descendants: true, isSignal: true }], hostDirectives: [{ directive: i1$1.CdkOverlayOrigin }], ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.4", type: GaInputComponent, isStandalone: true, selector: "ga-input", host: { listeners: { "click": "gaInput().focus()" }, properties: { "class.ga-input--invalid": "gaInput().invalid()" }, classAttribute: "ga-input" }, queries: [{ propertyName: "gaInput", first: true, predicate: GaInputDirective, descendants: true, isSignal: true }], hostDirectives: [{ directive: i1$1.CdkOverlayOrigin }], ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaInputComponent, decorators: [{
             type: Component,
@@ -1338,6 +1341,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImpor
                     host: {
                         class: 'ga-input',
                         '[class.ga-input--invalid]': 'gaInput().invalid()',
+                        '(click)': 'gaInput().focus()',
                     },
                 }]
         }] });
@@ -1725,6 +1729,7 @@ class GaDatepickerInputDirective {
     updateValue(value, { updateView, emitToNgModel, } = {}) {
         this.value.set(value);
         this.lastValueValid.set(true);
+        this.lastDateChangeEmittedValue.set(this.dateStruct());
         if (updateView) {
             this.formatValue();
         }
@@ -1738,7 +1743,6 @@ class GaDatepickerInputDirective {
     // ControlValueAccessor implementation
     writeValue(value) {
         this.updateValue(value, { updateView: true });
-        this.lastDateChangeEmittedValue.set(this.dateStruct());
     }
     registerOnChange(fn) {
         this.onNgChangeFn = fn;
@@ -4005,6 +4009,17 @@ class GaSelectComponent {
                 this.connectedOverlay()?.overlayRef?.updatePosition();
             });
         });
+        effect(() => {
+            // update the overlayPosition since it may change size when selecting/deselecting options
+            this.value();
+            untracked(() => {
+                if (this.multiple()) {
+                    setTimeout(() => {
+                        this.connectedOverlay()?.overlayRef?.updatePosition();
+                    });
+                }
+            });
+        });
     }
     ngAfterContentInit() {
         effect(() => {
@@ -4106,8 +4121,9 @@ class GaSelectComponent {
             this.inputSearch()?.nativeElement !== document.activeElement) {
             this._onTouched?.();
         }
-        this.value.set(null);
-        this._onModelChanged?.(null);
+        const value = this.multiple() ? [] : null;
+        this.value.set(value);
+        this._onModelChanged?.(value);
         this.autoClose();
     }
     onInputKeyDown(event) {
@@ -4636,6 +4652,93 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImpor
                 }]
         }] });
 
+class GaChipListboxComponent {
+    cdkListbox = inject(CdkListbox, { self: true });
+    orientation = input('horizontal');
+    variant = input('default');
+    valueChange = output();
+    disabled = computed(() => this.cdkListbox.disabled);
+    constructor() {
+        effect(() => {
+            this.cdkListbox.orientation = this.orientation();
+        });
+        this.cdkListbox.valueChange
+            .pipe(takeUntilDestroyed())
+            .subscribe((event) => {
+            const value = !this.cdkListbox.multiple ? event.value[0] : event.value;
+            this.valueChange.emit(value);
+        });
+    }
+    focus() {
+        this.cdkListbox.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipListboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.4", type: GaChipListboxComponent, isStandalone: true, selector: "ga-chip-listbox", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "ga-chip-listbox" }, hostDirectives: [{ directive: i1$5.CdkListbox, inputs: ["cdkListboxMultiple", "multiple", "cdkListboxValue", "value", "cdkListboxDisabled", "disabled", "cdkListboxCompareWith", "compareWith"] }], ngImport: i0, template: "<ng-content />\n" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipListboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ga-chip-listbox', hostDirectives: [
+                        {
+                            directive: CdkListbox,
+                            inputs: [
+                                'cdkListboxMultiple: multiple',
+                                'cdkListboxValue: value',
+                                'cdkListboxDisabled: disabled',
+                                'cdkListboxCompareWith: compareWith',
+                            ],
+                        },
+                    ], host: {
+                        class: 'ga-chip-listbox',
+                    }, template: "<ng-content />\n" }]
+        }], ctorParameters: () => [] });
+
+class GaChipComponent {
+    cdkOption = inject(CdkOption, { self: true });
+    listbox = inject(GaChipListboxComponent);
+    _isSelected = signal(null);
+    selected = this._isSelected.asReadonly();
+    value = input.required();
+    disabled = input(false, { transform: booleanAttribute });
+    constructor() {
+        afterEveryRender({
+            read: () => {
+                // NOTE: currently there is no other reliable way to track the selected state,
+                // refactor once cdk will be based on signals or more appropriate events introduced
+                this._isSelected.set(this.cdkOption.isSelected());
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.4", type: GaChipComponent, isStandalone: true, selector: "ga-chip", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ga-quick-filter-button--transparent": "listbox.variant() === 'transparent'", "class.ga-quick-filter-button--disabled": "disabled() || listbox.disabled()", "class.ga-quick-filter-button--selected": "selected()" }, classAttribute: "ga-quick-filter-button" }, hostDirectives: [{ directive: i1$5.CdkOption, inputs: ["cdkOption", "value", "cdkOptionDisabled", "disabled"] }], ngImport: i0, template: "<ng-content />\n", dependencies: [{ kind: "ngmodule", type: CdkListboxModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ga-chip', imports: [CdkListboxModule], hostDirectives: [
+                        {
+                            directive: CdkOption,
+                            inputs: ['cdkOption: value', 'cdkOptionDisabled: disabled'],
+                        },
+                    ], host: {
+                        class: 'ga-quick-filter-button',
+                        '[class.ga-quick-filter-button--transparent]': "listbox.variant() === 'transparent'",
+                        '[class.ga-quick-filter-button--disabled]': 'disabled() || listbox.disabled()',
+                        '[class.ga-quick-filter-button--selected]': 'selected()',
+                    }, template: "<ng-content />\n" }]
+        }], ctorParameters: () => [] });
+
+class GaChipModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: GaChipModule, imports: [GaChipComponent, GaChipListboxComponent], exports: [GaChipComponent, GaChipListboxComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipModule, imports: [GaChipComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: GaChipModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [GaChipComponent, GaChipListboxComponent],
+                    exports: [GaChipComponent, GaChipListboxComponent],
+                }]
+        }] });
+
 /*
  * Public API Surface of ngx-gaia
  */
@@ -4644,5 +4747,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CHECKBOX_CONTROL_VALUE_ACCESSOR, DEFAULT_MODAL_OPTIONS, GA_ALERT_I18N_FACTORY, GA_BASE_FONT_SIZE, GA_BUTTON_I18N_FACTORY, GA_CHECKBOX_REQUIRED_VALIDATOR, GA_DATEPICKER_I18N_FACTORY, GA_DATEPICKER_PARSER_FORMATTER_FACTORY, GA_DATEPICKER_VALUE_ADAPTER_FACTORY, GA_DATE_PARSER_FORMATTER_CONFIG, GA_DEFAULT_DATEPICKER_FORMATS, GA_FORM_CONTROL_ADAPTER, GA_FORM_ERRORS, GA_ICON_DEFAULT_SIZE, GA_MODAL_DATA, GA_MODAL_I18N_FACTORY, GA_SELECT_I18N_FACTORY, GA_SELECT_REQUIRED_VALIDATOR, GA_TOOLTIP_DEFAULT_OFFSET, GaAlertComponent, GaAlertI18n, GaAlertI18nDefault, GaAlertModule, GaAlertTitleActionsComponent, GaAlertTitleComponent, GaBadgeComponent, GaBadgeModule, GaButtonDirective, GaButtonI18n, GaButtonI18nDefault, GaButtonModule, GaCardComponent, GaCardModule, GaCheckboxComponent, GaCheckboxModule, GaCheckboxRequiredValidator, GaDatepickerComponent, GaDatepickerI18n, GaDatepickerI18nDefault, GaDatepickerInputDirective, GaDatepickerModule, GaDatepickerNativeUtcIsoValueAdapter, GaDatepickerNativeUtcValueAdapter, GaDatepickerParserFormatter, GaDatepickerParserFormatterDefault, GaDatepickerStructValueAdapter, GaDatepickerToggleComponent, GaDatepickerValueAdapter, GaFieldErrorDirective, GaFieldInfoComponent, GaFieldLabelComponent, GaFormControlDirective, GaFormControlErrorsDirective, GaFormFieldComponent, GaFormFieldConnector, GaFormFieldModule, GaIconButtonDirective, GaIconComponent, GaIconModule, GaInputComponent, GaInputDirective, GaInputModule, GaLabelledByFormFieldDirective, GaLinkDirective, GaLinkModule, GaMenuComponent, GaMenuItemComponent, GaMenuModule, GaMenuSeparatorComponent, GaMenuTitleComponent, GaMenuTriggerDirective, GaMenuTriggerIconComponent, GaModalActionsComponent, GaModalCloseDirective, GaModalComponent, GaModalContentComponent, GaModalDescriptionComponent, GaModalDescriptionDirective, GaModalHeaderComponent, GaModalI18n, GaModalI18nDefault, GaModalLabelDirective, GaModalModule, GaModalOptions, GaModalRef, GaModalService, GaModalTitleDirective, GaOptgroupComponent, GaOptionComponent, GaRadioButtonComponent, GaRadioGroupComponent, GaRadioModule, GaSegmentedControlButtonDirective, GaSegmentedControlComponent, GaSegmentedControlIconButtonComponent, GaSegmentedControlModule, GaSegmentedControlTextButtonComponent, GaSelectComponent, GaSelectDropdownComponent, GaSelectDropdownSpinnerComponent, GaSelectI18n, GaSelectI18nDefault, GaSelectModule, GaSelectRequiredValidator, GaSelectValueComponent, GaSpinnerComponent, GaSpinnerModule, GaSwitchComponent, GaSwitchModule, GaTextAreaDirective, GaTextAreaModule, GaTooltipComponent, GaTooltipDirective, GaTooltipModule, RADIO_CONTROL_VALUE_ACCESSOR, SWITCH_CONTROL_VALUE_ACCESSOR, compareStructs, extendGaDateParserFormatter, injectNgControlState, provideGaAlertI18n, provideGaBaseFontSize, provideGaButtonI18n, provideGaDatepickerI18n, provideGaDatepickerParserFormatter, provideGaDatepickerValueAdapter, provideGaFormErrors, provideGaModalI18n, provideGaModalOptions, provideGaSelectI18n };
+export { CHECKBOX_CONTROL_VALUE_ACCESSOR, DEFAULT_MODAL_OPTIONS, GA_ALERT_I18N_FACTORY, GA_BASE_FONT_SIZE, GA_BUTTON_I18N_FACTORY, GA_CHECKBOX_REQUIRED_VALIDATOR, GA_DATEPICKER_I18N_FACTORY, GA_DATEPICKER_PARSER_FORMATTER_FACTORY, GA_DATEPICKER_VALUE_ADAPTER_FACTORY, GA_DATE_PARSER_FORMATTER_CONFIG, GA_DEFAULT_DATEPICKER_FORMATS, GA_FORM_CONTROL_ADAPTER, GA_FORM_ERRORS, GA_ICON_DEFAULT_SIZE, GA_MODAL_DATA, GA_MODAL_I18N_FACTORY, GA_SELECT_I18N_FACTORY, GA_SELECT_REQUIRED_VALIDATOR, GA_TOOLTIP_DEFAULT_OFFSET, GaAlertComponent, GaAlertI18n, GaAlertI18nDefault, GaAlertModule, GaAlertTitleActionsComponent, GaAlertTitleComponent, GaBadgeComponent, GaBadgeModule, GaButtonDirective, GaButtonI18n, GaButtonI18nDefault, GaButtonModule, GaCardComponent, GaCardModule, GaCheckboxComponent, GaCheckboxModule, GaCheckboxRequiredValidator, GaChipComponent, GaChipListboxComponent, GaChipModule, GaDatepickerComponent, GaDatepickerI18n, GaDatepickerI18nDefault, GaDatepickerInputDirective, GaDatepickerModule, GaDatepickerNativeUtcIsoValueAdapter, GaDatepickerNativeUtcValueAdapter, GaDatepickerParserFormatter, GaDatepickerParserFormatterDefault, GaDatepickerStructValueAdapter, GaDatepickerToggleComponent, GaDatepickerValueAdapter, GaFieldErrorDirective, GaFieldInfoComponent, GaFieldLabelComponent, GaFormControlDirective, GaFormControlErrorsDirective, GaFormFieldComponent, GaFormFieldConnector, GaFormFieldModule, GaIconButtonDirective, GaIconComponent, GaIconModule, GaInputComponent, GaInputDirective, GaInputModule, GaLabelledByFormFieldDirective, GaLinkDirective, GaLinkModule, GaMenuComponent, GaMenuItemComponent, GaMenuModule, GaMenuSeparatorComponent, GaMenuTitleComponent, GaMenuTriggerDirective, GaMenuTriggerIconComponent, GaModalActionsComponent, GaModalCloseDirective, GaModalComponent, GaModalContentComponent, GaModalDescriptionComponent, GaModalDescriptionDirective, GaModalHeaderComponent, GaModalI18n, GaModalI18nDefault, GaModalLabelDirective, GaModalModule, GaModalOptions, GaModalRef, GaModalService, GaModalTitleDirective, GaOptgroupComponent, GaOptionComponent, GaRadioButtonComponent, GaRadioGroupComponent, GaRadioModule, GaSegmentedControlButtonDirective, GaSegmentedControlComponent, GaSegmentedControlIconButtonComponent, GaSegmentedControlModule, GaSegmentedControlTextButtonComponent, GaSelectComponent, GaSelectDropdownComponent, GaSelectDropdownSpinnerComponent, GaSelectI18n, GaSelectI18nDefault, GaSelectModule, GaSelectRequiredValidator, GaSelectValueComponent, GaSpinnerComponent, GaSpinnerModule, GaSwitchComponent, GaSwitchModule, GaTextAreaDirective, GaTextAreaModule, GaTooltipComponent, GaTooltipDirective, GaTooltipModule, RADIO_CONTROL_VALUE_ACCESSOR, SWITCH_CONTROL_VALUE_ACCESSOR, compareStructs, extendGaDateParserFormatter, injectNgControlState, provideGaAlertI18n, provideGaBaseFontSize, provideGaButtonI18n, provideGaDatepickerI18n, provideGaDatepickerParserFormatter, provideGaDatepickerValueAdapter, provideGaFormErrors, provideGaModalI18n, provideGaModalOptions, provideGaSelectI18n };
 //# sourceMappingURL=vsn-ux-ngx-gaia.mjs.map