@sumaris-net/ngx-components 2.12.13 → 2.12.15

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sumaris-net/ngx-components",
   "description": "SUMARiS Angular components",
-  "version": "2.12.13",
+  "version": "2.12.15",
   "author": "contact@e-is.pro",
   "license": "AGPL-3.0",
   "readmeFilename": "README.md",

package/public_api.d.ts

@@ -190,6 +190,7 @@ export * from './src/app/core/form/properties/properties.table';
 export * from './src/app/core/form/properties/properties.module';
 export * from './src/app/core/form/text-popover/text-popover.component';
 export * from './src/app/core/form/text-popover/text-popover.module';
+export * from './src/app/core/form/array/form-array';
 export * from './src/app/core/table/table.model';
 export * from './src/app/core/table/table.class';
 export * from './src/app/core/table/async-table.class';
@@ -299,6 +300,8 @@ export * from './src/app/core/form/properties/testing/properties-form.testing.mo
 export * from './src/app/core/menu/testing/menu.testing';
 export * from './src/app/core/menu/testing/menu.testing.module';
 export * from './src/app/core/menu/testing/menu-other.testing';
+export * from './src/app/core/form/array/testing/form-array.test';
+export * from './src/app/core/form/array/testing/form-array-test.module';
 export * from './src/app/shared/named-filter/testing/named-filter-selector.testing';
 export * from './src/app/shared/named-filter/testing/named-filter.testing.module';
 export * from './src/app/social/social.testing.module';
@@ -308,11 +311,4 @@ export * from './src/app/social/user-event/testing/user-event.testing.service';
 export * from './src/app/social/job/testing/job.testing.module';
 export * from './src/app/social/job/testing/job-progression.testing';
 export * from './src/app/social/job/testing/job-progression.testing.service';
-export { MatAutocompleteConfigHolder } from './src/app/shared/material/autocomplete/material.autocomplete.config';
-export { MatAutocompleteFieldAddOptions } from './src/app/shared/material/autocomplete/material.autocomplete.config';
-export { MatAutocompleteFieldConfig } from './src/app/shared/material/autocomplete/material.autocomplete.config';
-export { NamedFilterFilter } from './src/app/shared/named-filter/named-filter.model';
-export { INamedFilterFilter } from './src/app/shared/named-filter/named-filter.model';
-export { NamedFilter } from './src/app/shared/named-filter/named-filter.model';
-export { INamedFilter } from './src/app/shared/named-filter/named-filter.model';
-export { TableValidatorService } from './src/app/core/table/testing/table-validator.service';
+export * from './src/app/core/table/testing/table-validator.service';

package/src/app/core/core.testing.module.d.ts

@@ -6,9 +6,10 @@ import * as i3 from "@angular/router";
 import * as i4 from "./table/testing/table.testing.module";
 import * as i5 from "./form/text-popover/testing/text-popover.testing.module";
 import * as i6 from "./form/properties/testing/properties-form.testing.module";
+import * as i7 from "./form/array/testing/form-array-test.module";
 export declare const CORE_TESTING_PAGES: TestingPage[];
 export declare class CoreTestingModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<CoreTestingModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<CoreTestingModule, never, [typeof i1.CommonModule, typeof i2.TranslateModule, typeof i3.RouterModule, typeof i4.TableTestingModule, typeof i5.TextPopoverTestingModule, typeof i6.PropertiesFormTestingModule], [typeof i3.RouterModule, typeof i4.TableTestingModule, typeof i5.TextPopoverTestingModule, typeof i6.PropertiesFormTestingModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CoreTestingModule, never, [typeof i1.CommonModule, typeof i2.TranslateModule, typeof i3.RouterModule, typeof i4.TableTestingModule, typeof i5.TextPopoverTestingModule, typeof i6.PropertiesFormTestingModule, typeof i7.FormArrayTestModule], [typeof i3.RouterModule, typeof i4.TableTestingModule, typeof i5.TextPopoverTestingModule, typeof i6.PropertiesFormTestingModule, typeof i7.FormArrayTestModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<CoreTestingModule>;
 }

package/src/app/core/form/array/form-array.d.ts

@@ -0,0 +1,136 @@
+import { Entity } from '../../services/model/entity.model';
+import { AbstractControl, AbstractControlOptions, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup, ValidatorFn } from '@angular/forms';
+export interface FormArrayHelperOptions {
+    allowEmptyArray: boolean;
+    allowManyNullValues?: boolean;
+    allowDuplicatedValues?: boolean;
+    validators?: ValidatorFn[];
+}
+export declare class FormArrayHelper<T = Entity<any>, C extends AbstractControl = AbstractControl> {
+    private readonly _formArray;
+    private createControl;
+    private equals;
+    private isEmpty;
+    static getOrCreateArray(formBuilder: UntypedFormBuilder, form: UntypedFormGroup, arrayName: string): UntypedFormArray;
+    private _allowEmptyArray;
+    private _allowManyNullValues;
+    private _allowDuplicatedValues;
+    private readonly _validators;
+    get allowEmptyArray(): boolean;
+    set allowEmptyArray(value: boolean);
+    get allowManyNullValues(): boolean;
+    set allowManyNullValues(value: boolean);
+    get allowDuplicatedValues(): boolean;
+    set allowDuplicatedValues(value: boolean);
+    get formArray(): UntypedFormArray;
+    constructor(_formArray: UntypedFormArray, createControl: (value?: T) => C, equals: (v1: T, v2: T) => boolean, isEmpty: (value: T) => boolean, options?: FormArrayHelperOptions);
+    /**
+     * @param value
+     * @param options
+     */
+    add(value?: T, options?: {
+        emitEvent: boolean;
+        insertAt?: number;
+    }): boolean;
+    removeAt(index: number): boolean;
+    resize(length: number, options?: {
+        emitEvent?: boolean;
+    }): boolean;
+    clearAt(index: number): boolean;
+    isLast(index: number): boolean;
+    removeAllEmpty(): void;
+    size(): number;
+    at(index: number): C;
+    /**
+     * Resize the FormArray, then set values
+     *
+     * @param values
+     * @param options
+     */
+    setValue(values: T[], options?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    /**
+     * Resize the FormArray, then patch values
+     *
+     * @param values
+     * @param options
+     */
+    patchValue(values: T[], options?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    disable(opts?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    enable(opts?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    forEach(ite: (control: C) => void): void;
+    protected setAllowEmptyArray(value: boolean): void;
+}
+export declare interface AppFormArrayOptions extends AbstractControlOptions {
+    allowEmptyArray?: boolean;
+    allowReuseControls?: boolean;
+    allowManyNullValues?: boolean;
+    allowDuplicateValue?: boolean;
+}
+export declare class AppFormArray<T extends Entity<T>, C extends AbstractControl> extends UntypedFormArray {
+    createControl: (value?: T) => C;
+    private equals;
+    private isEmpty;
+    private readonly options;
+    get allowEmptyArray(): boolean;
+    set allowEmptyArray(value: boolean);
+    get allowManyNullValues(): boolean;
+    set allowManyNullValues(value: boolean);
+    get allowDuplicateValue(): boolean;
+    set allowDuplicateValue(value: boolean);
+    constructor(createControl: (value?: T) => C, equals: (v1: T, v2: T) => boolean, isEmpty: (value: T) => boolean, options?: AppFormArrayOptions | undefined | null);
+    /**
+     * WIll rebuild the array, using the given values
+     *
+     * @param values
+     * @param options
+     */
+    setValue(values: any[], options?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    patchValue(values: any[] | null | undefined, options?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    resize(length: number, options?: {
+        emitEvent?: boolean;
+    }): boolean;
+    disable(opts?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    enable(opts?: {
+        onlySelf?: boolean;
+        emitEvent?: boolean;
+    }): void;
+    forEach(ite: (control: C) => void): void;
+    /**
+     * @param value
+     * @param options
+     */
+    add(value?: T, options?: {
+        emitEvent: boolean;
+        insertAt?: number;
+    }): void;
+    removeAt(index: number, options?: {
+        emitEvent: boolean;
+    }): boolean;
+    clearAt(index: number, options?: {
+        emitEvent: boolean;
+    }): void;
+    isLast(index: number): boolean;
+    removeAllEmpty(): void;
+    protected setAllowEmptyArray(value: boolean): void;
+}

package/src/app/core/form/array/testing/form-array-test.module.d.ts

@@ -0,0 +1,12 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./form-array.test";
+import * as i2 from "@angular/common";
+import * as i3 from "../../../../shared/shared.module";
+import * as i4 from "../../../core.module";
+import * as i5 from "@ngx-translate/core";
+import * as i6 from "@angular/router";
+export declare class FormArrayTestModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormArrayTestModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FormArrayTestModule, [typeof i1.ArrayFormTestPage], [typeof i2.CommonModule, typeof i3.SharedModule, typeof i4.CoreModule, typeof i5.TranslateModule], [typeof i1.ArrayFormTestPage, typeof i6.RouterModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<FormArrayTestModule>;
+}

package/src/app/core/form/array/testing/form-array.test.d.ts

@@ -0,0 +1,26 @@
+import { ChangeDetectorRef, Injector, OnDestroy, OnInit } from '@angular/core';
+import { UntypedFormBuilder, UntypedFormControl } from '@angular/forms';
+import { PlatformService } from '../../../services/platform.service';
+import { AppForm } from '../../form.class';
+import { AppFormArray } from '../form-array';
+import * as i0 from "@angular/core";
+export declare class ArrayFormTestPage extends AppForm<any> implements OnInit, OnDestroy {
+    protected formBuilder: UntypedFormBuilder;
+    protected platform: PlatformService;
+    protected injection: Injector;
+    protected cd: ChangeDetectorRef;
+    private subscription;
+    get defaultFormArray(): AppFormArray<any, any>;
+    get notEmptyFormArray(): AppFormArray<any, any>;
+    get nullValuesFormArray(): AppFormArray<any, any>;
+    get duplicatedValuesFormArray(): AppFormArray<any, any>;
+    get valueToAddControl(): UntypedFormControl;
+    constructor(formBuilder: UntypedFormBuilder, platform: PlatformService, injection: Injector, cd: ChangeDetectorRef);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    loadData(): Promise<void>;
+    protected setFormArrayValue(formArray: AppFormArray<any, any>, values: string | string[]): void;
+    protected markForCheck(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ArrayFormTestPage, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArrayFormTestPage, "app-array-test", never, {}, {}, never, never, false, never>;
+}

package/src/app/core/form/form.utils.d.ts

@@ -1,5 +1,4 @@
-import { AbstractControl, AbstractControlOptions, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup, ValidatorFn } from '@angular/forms';
-import { Entity } from '../services/model/entity.model';
+import { AbstractControl } from '@angular/forms';
 import { filterNumberInput, selectInputContent } from '../../shared/inputs';
 import { WaitForOptions } from '../../shared/observables';
 import { addValueInArray, clearValueInArray, copyEntity2Form, disableControls, filterFormErrors, filterFormErrorsByPath, filterFormErrorsByPrefix, getControlFromPath, getFormErrors, getFormValueFromEntity, logFormErrors, markAllAsTouched, markAsUntouched, removeValueInArray, resizeArray, updateValueAndValidity, waitIdle, waitWhilePending } from '../../shared/forms';
@@ -201,126 +200,6 @@ export declare class AppFormProvider<F extends IAppForm = IAppForm> implements I
     }): void;
     save(): Promise<boolean>;
 }
-export interface FormArrayHelperOptions {
-    allowEmptyArray: boolean;
-    validators?: ValidatorFn[];
-}
-export declare class FormArrayHelper<T = Entity<any>, C extends AbstractControl = AbstractControl> {
-    private readonly _formArray;
-    private createControl;
-    private equals;
-    private isEmpty;
-    static getOrCreateArray(formBuilder: UntypedFormBuilder, form: UntypedFormGroup, arrayName: string): UntypedFormArray;
-    private _allowEmptyArray;
-    private readonly _validators;
-    get allowEmptyArray(): boolean;
-    set allowEmptyArray(value: boolean);
-    get formArray(): UntypedFormArray;
-    constructor(_formArray: UntypedFormArray, createControl: (value?: T) => C, equals: (v1: T, v2: T) => boolean, isEmpty: (value: T) => boolean, options?: FormArrayHelperOptions);
-    /**
-     * @param value
-     * @param options
-     */
-    add(value?: T, options?: {
-        emitEvent: boolean;
-        insertAt?: number;
-    }): boolean;
-    removeAt(index: number): boolean;
-    resize(length: number, options?: {
-        emitEvent?: boolean;
-    }): boolean;
-    clearAt(index: number): boolean;
-    isLast(index: number): boolean;
-    removeAllEmpty(): void;
-    size(): number;
-    at(index: number): C;
-    /**
-     * Resize the FormArray, then set values
-     *
-     * @param values
-     * @param options
-     */
-    setValue(values: T[], options?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    /**
-     * Resize the FormArray, then patch values
-     *
-     * @param values
-     * @param options
-     */
-    patchValue(values: T[], options?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    disable(opts?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    enable(opts?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    forEach(ite: (control: C) => void): void;
-    protected setAllowEmptyArray(value: boolean): void;
-}
-export declare interface AppFormArrayOptions extends AbstractControlOptions {
-    allowEmptyArray?: boolean;
-    allowReuseControls?: boolean;
-}
-export declare class AppFormArray<T extends Entity<T>, C extends AbstractControl> extends UntypedFormArray {
-    createControl: (value?: T) => C;
-    private equals;
-    private isEmpty;
-    private options?;
-    get allowEmptyArray(): boolean;
-    set allowEmptyArray(value: boolean);
-    constructor(createControl: (value?: T) => C, equals: (v1: T, v2: T) => boolean, isEmpty: (value: T) => boolean, options?: AppFormArrayOptions | undefined | null);
-    /**
-     * WIll rebuild the array, using the given values
-     *
-     * @param values
-     * @param options
-     */
-    setValue(values: any[], options?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    patchValue(values: any[] | null | undefined, options?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    resize(length: number, options?: {
-        emitEvent?: boolean;
-    }): void;
-    disable(opts?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    enable(opts?: {
-        onlySelf?: boolean;
-        emitEvent?: boolean;
-    }): void;
-    forEach(ite: (control: C) => void): void;
-    /**
-     * @param value
-     * @param options
-     */
-    add(value?: T, options?: {
-        emitEvent: boolean;
-        insertAt?: number;
-    }): void;
-    removeAt(index: number, options?: {
-        emitEvent: boolean;
-    }): boolean;
-    clearAt(index: number, options?: {
-        emitEvent: boolean;
-    }): void;
-    isLast(index: number): boolean;
-    removeAllEmpty(): void;
-    protected setAllowEmptyArray(value: boolean): void;
-}
 /**
  * Helper class, for angular forms
  */

package/src/app/core/form/list/list.form.d.ts

@@ -1,13 +1,13 @@
 import { ChangeDetectorRef, EventEmitter, Injector, OnInit } from '@angular/core';
-import { AbstractControl, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup, FormGroupDirective } from '@angular/forms';
+import { AbstractControl, FormGroupDirective, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
 import { DateAdapter } from '@angular/material/core';
 import { Moment } from 'moment';
 import { LocalSettingsService } from '../../services/local-settings.service';
 import { AppForm } from '../form.class';
-import { FormArrayHelper, FormArrayHelperOptions } from '../form.utils';
 import { SelectionModel } from '@angular/cdk/collections';
 import { Observable } from 'rxjs';
 import { Color } from '@ionic/core';
+import { FormArrayHelper, FormArrayHelperOptions } from '../array/form-array';
 import * as i0 from "@angular/core";
 export declare interface ItemButton<T = any> {
     title?: string;

package/src/app/core/form/properties/properties.form.d.ts

@@ -1,14 +1,14 @@
 import { ChangeDetectorRef, Injector, OnInit } from '@angular/core';
-import { UntypedFormArray, UntypedFormBuilder, UntypedFormGroup, FormGroupDirective } from '@angular/forms';
+import { FormGroupDirective, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
 import { FormFieldDefinition, FormFieldDefinitionMap } from '../../../shared/form/field.model';
 import { DateAdapter, ThemePalette } from '@angular/material/core';
 import { Moment } from 'moment';
 import { LocalSettingsService } from '../../services/local-settings.service';
 import { AppForm } from '../form.class';
-import { FormArrayHelper, FormArrayHelperOptions } from '../form.utils';
 import { Property } from '../../../shared/types';
 import { PropertyValidator } from './property.validator';
 import { PredefinedColors } from '@ionic/core';
+import { FormArrayHelper, FormArrayHelperOptions } from '../array/form-array';
 import * as i0 from "@angular/core";
 export declare class AppPropertiesForm<T = Property> extends AppForm<T[]> implements OnInit {
     protected formBuilder: UntypedFormBuilder;

package/src/app/core/settings/settings.page.d.ts

@@ -3,7 +3,7 @@ import { AccountService } from '../services/account.service';
 import { LocaleConfig, LocalSettings, UsageMode } from '../services/model/settings.model';
 import { UntypedFormArray, UntypedFormBuilder } from '@angular/forms';
 import { AppForm } from '../form/form.class';
-import { CanLeave, FormArrayHelper } from '../form/form.utils';
+import { CanLeave } from '../form/form.utils';
 import { TranslateService } from '@ngx-translate/core';
 import { LocalSettingsValidatorService } from '../services/validator/local-settings.validator';
 import { PlatformService } from '../services/platform.service';
@@ -14,6 +14,7 @@ import { AlertController, NavController } from '@ionic/angular';
 import { Property } from '../../shared/types';
 import { ISelectPeerModalOptions } from '../peer/select-peer.modal';
 import { IMenuItem } from '../menu/menu.model';
+import { FormArrayHelper } from '../form/array/form-array';
 import * as i0 from "@angular/core";
 export declare const APP_SETTINGS_MENU_ITEMS: InjectionToken<IMenuItem[]>;
 export declare class SettingsPage extends AppForm<LocalSettings> implements OnInit, OnDestroy, CanLeave {

package/src/app/shared/forms.d.ts

@@ -40,6 +40,8 @@ export declare function disableControls(form: UntypedFormGroup, paths: string[],
 export declare function addValueInArray(arrayControl: UntypedFormArray, createControl: (value?: any) => AbstractControl, equals: (v1: any, v2: any) => boolean, isEmpty: (value: any) => boolean, value: any, options?: {
     emitEvent: boolean;
     insertAt?: number;
+    allowManyNullValues?: boolean;
+    allowDuplicateValue?: boolean;
 }): boolean;
 /**
  * Set an array using given default values. Each default value will be pass to the 'createControl()' function

package/src/app/shared/material/autocomplete/material.autocomplete.d.ts

@@ -73,6 +73,11 @@ export declare class MatAutocompleteField implements OnInit, AfterViewInit, OnDe
     applyImplicitValue: boolean | ((value: any) => boolean);
     dropButtonTitle: string;
     clearButtonTitle: string;
+    /**
+     * @deprecated Use panelClass instead
+     */
+    set classList(value: string);
+    get classList(): string;
     clicked: EventEmitter<MouseEvent>;
     blurred: EventEmitter<FocusEvent>;
     focused: EventEmitter<FocusEvent>;
@@ -142,7 +147,7 @@ export declare class MatAutocompleteField implements OnInit, AfterViewInit, OnDe
      */
     private _fixSearchbarOverlay;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatAutocompleteField, [null, null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatAutocompleteField, "mat-autocomplete-field", never, { "equals": { "alias": "equals"; "required": false; }; "logPrefix": { "alias": "logPrefix"; "required": false; }; "formControl": { "alias": "formControl"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; }; "floatLabel": { "alias": "floatLabel"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "suggestFn": { "alias": "suggestFn"; "required": false; }; "required": { "alias": "required"; "required": false; }; "mobile": { "alias": "mobile"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "displayWith": { "alias": "displayWith"; "required": false; }; "displayAttributes": { "alias": "displayAttributes"; "required": false; }; "displayColumnSizes": { "alias": "displayColumnSizes"; "required": false; }; "displayColumnNames": { "alias": "displayColumnNames"; "required": false; }; "highlightAccent": { "alias": "highlightAccent"; "required": false; }; "showAllOnFocus": { "alias": "showAllOnFocus"; "required": false; }; "showPanelOnFocus": { "alias": "showPanelOnFocus"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "config": { "alias": "config"; "required": false; }; "i18nPrefix": { "alias": "i18nPrefix"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "panelWidth": { "alias": "panelWidth"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "matAutocompletePosition": { "alias": "matAutocompletePosition"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "fetchMoreThreshold": { "alias": "fetchMoreThreshold"; "required": false; }; "suggestLengthThreshold": { "alias": "suggestLengthThreshold"; "required": false; }; "showLoadingSpinner": { "alias": "showLoadingSpinner"; "required": false; }; "debug": { "alias": "debug"; "required": false; }; "showSearchBar": { "alias": "showSearchBar"; "required": false; }; "stickySearchBar": { "alias": "stickySearchBar"; "required": false; }; "applyImplicitValue": { "alias": "applyImplicitValue"; "required": false; }; "dropButtonTitle": { "alias": "dropButtonTitle"; "required": false; }; "clearButtonTitle": { "alias": "clearButtonTitle"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "clicked": "click"; "blurred": "blur"; "focused": "focus"; "dropButtonClick": "dropButtonClick"; "keydownEscape": "keydown.escape"; "keyupEnter": "keyup.enter"; "optionSelected": "optionSelected"; }, never, ["[matAfter]", "[matPrefix]", "[matSuffix]", "mat-error,[matError]", "mat-hint:not([align='end']),[matHint]", "mat-hint[align='end']"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatAutocompleteField, "mat-autocomplete-field", never, { "equals": { "alias": "equals"; "required": false; }; "logPrefix": { "alias": "logPrefix"; "required": false; }; "formControl": { "alias": "formControl"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; }; "floatLabel": { "alias": "floatLabel"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "suggestFn": { "alias": "suggestFn"; "required": false; }; "required": { "alias": "required"; "required": false; }; "mobile": { "alias": "mobile"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "displayWith": { "alias": "displayWith"; "required": false; }; "displayAttributes": { "alias": "displayAttributes"; "required": false; }; "displayColumnSizes": { "alias": "displayColumnSizes"; "required": false; }; "displayColumnNames": { "alias": "displayColumnNames"; "required": false; }; "highlightAccent": { "alias": "highlightAccent"; "required": false; }; "showAllOnFocus": { "alias": "showAllOnFocus"; "required": false; }; "showPanelOnFocus": { "alias": "showPanelOnFocus"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "config": { "alias": "config"; "required": false; }; "i18nPrefix": { "alias": "i18nPrefix"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "panelWidth": { "alias": "panelWidth"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "matAutocompletePosition": { "alias": "matAutocompletePosition"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "fetchMoreThreshold": { "alias": "fetchMoreThreshold"; "required": false; }; "suggestLengthThreshold": { "alias": "suggestLengthThreshold"; "required": false; }; "showLoadingSpinner": { "alias": "showLoadingSpinner"; "required": false; }; "debug": { "alias": "debug"; "required": false; }; "showSearchBar": { "alias": "showSearchBar"; "required": false; }; "stickySearchBar": { "alias": "stickySearchBar"; "required": false; }; "applyImplicitValue": { "alias": "applyImplicitValue"; "required": false; }; "dropButtonTitle": { "alias": "dropButtonTitle"; "required": false; }; "clearButtonTitle": { "alias": "clearButtonTitle"; "required": false; }; "classList": { "alias": "class"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "clicked": "click"; "blurred": "blur"; "focused": "focus"; "dropButtonClick": "dropButtonClick"; "keydownEscape": "keydown.escape"; "keyupEnter": "keyup.enter"; "optionSelected": "optionSelected"; }, never, ["[matAfter]", "[matPrefix]", "[matSuffix]", "mat-error,[matError]", "mat-hint:not([align='end']),[matHint]", "mat-hint[align='end']"], false, never>;
     static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_mobile: unknown;
     static ngAcceptInputType_clearable: unknown;

package/src/app/shared/material/chips/material.chips.d.ts

@@ -66,6 +66,11 @@ export declare class MatChipsField implements OnInit, OnDestroy, InputElement, C
     applyImplicitValue: boolean | ((value: any) => boolean);
     dropButtonTitle: string;
     clearButtonTitle: string;
+    /**
+     * @deprecated Use panelClass instead
+     */
+    set classList(value: string);
+    get classList(): string;
     clicked: EventEmitter<MouseEvent>;
     blurred: EventEmitter<FocusEvent>;
     focused: EventEmitter<FocusEvent>;
@@ -126,7 +131,7 @@ export declare class MatChipsField implements OnInit, OnDestroy, InputElement, C
     private markForCheck;
     private markAsLoading;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatChipsField, [null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatChipsField, "mat-chips-field", never, { "equals": { "alias": "equals"; "required": false; }; "logPrefix": { "alias": "logPrefix"; "required": false; }; "formControl": { "alias": "formControl"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; }; "floatLabel": { "alias": "floatLabel"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "suggestFn": { "alias": "suggestFn"; "required": false; }; "required": { "alias": "required"; "required": false; }; "mobile": { "alias": "mobile"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "displayWith": { "alias": "displayWith"; "required": false; }; "displayAttributes": { "alias": "displayAttributes"; "required": false; }; "displayColumnSizes": { "alias": "displayColumnSizes"; "required": false; }; "displayColumnNames": { "alias": "displayColumnNames"; "required": false; }; "highlightAccent": { "alias": "highlightAccent"; "required": false; }; "showAllOnFocus": { "alias": "showAllOnFocus"; "required": false; }; "showPanelOnFocus": { "alias": "showPanelOnFocus"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "config": { "alias": "config"; "required": false; }; "i18nPrefix": { "alias": "i18nPrefix"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "panelWidth": { "alias": "panelWidth"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "matAutocompletePosition": { "alias": "matAutocompletePosition"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "fetchMoreThreshold": { "alias": "fetchMoreThreshold"; "required": false; }; "suggestLengthThreshold": { "alias": "suggestLengthThreshold"; "required": false; }; "showLoadingSpinner": { "alias": "showLoadingSpinner"; "required": false; }; "chipColor": { "alias": "chipColor"; "required": false; }; "debug": { "alias": "debug"; "required": false; }; "applyImplicitValue": { "alias": "applyImplicitValue"; "required": false; }; "dropButtonTitle": { "alias": "dropButtonTitle"; "required": false; }; "clearButtonTitle": { "alias": "clearButtonTitle"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "clicked": "click"; "blurred": "blur"; "focused": "focus"; "dropButtonClick": "dropButtonClick"; "keydownEscape": "keydown.escape"; "keyupEnter": "keyup.enter"; }, never, ["[matAfter]", "[matPrefix]", "[matSuffix]", "mat-error,[matError]", "mat-hint:not([align='end']),[matHint]", "mat-hint[align='end']"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatChipsField, "mat-chips-field", never, { "equals": { "alias": "equals"; "required": false; }; "logPrefix": { "alias": "logPrefix"; "required": false; }; "formControl": { "alias": "formControl"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; }; "floatLabel": { "alias": "floatLabel"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "suggestFn": { "alias": "suggestFn"; "required": false; }; "required": { "alias": "required"; "required": false; }; "mobile": { "alias": "mobile"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "displayWith": { "alias": "displayWith"; "required": false; }; "displayAttributes": { "alias": "displayAttributes"; "required": false; }; "displayColumnSizes": { "alias": "displayColumnSizes"; "required": false; }; "displayColumnNames": { "alias": "displayColumnNames"; "required": false; }; "highlightAccent": { "alias": "highlightAccent"; "required": false; }; "showAllOnFocus": { "alias": "showAllOnFocus"; "required": false; }; "showPanelOnFocus": { "alias": "showPanelOnFocus"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "config": { "alias": "config"; "required": false; }; "i18nPrefix": { "alias": "i18nPrefix"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "panelWidth": { "alias": "panelWidth"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "matAutocompletePosition": { "alias": "matAutocompletePosition"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "fetchMoreThreshold": { "alias": "fetchMoreThreshold"; "required": false; }; "suggestLengthThreshold": { "alias": "suggestLengthThreshold"; "required": false; }; "showLoadingSpinner": { "alias": "showLoadingSpinner"; "required": false; }; "chipColor": { "alias": "chipColor"; "required": false; }; "debug": { "alias": "debug"; "required": false; }; "applyImplicitValue": { "alias": "applyImplicitValue"; "required": false; }; "dropButtonTitle": { "alias": "dropButtonTitle"; "required": false; }; "clearButtonTitle": { "alias": "clearButtonTitle"; "required": false; }; "classList": { "alias": "class"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, { "clicked": "click"; "blurred": "blur"; "focused": "focus"; "dropButtonClick": "dropButtonClick"; "keydownEscape": "keydown.escape"; "keyupEnter": "keyup.enter"; }, never, ["[matAfter]", "[matPrefix]", "[matSuffix]", "mat-error,[matError]", "mat-hint:not([align='end']),[matHint]", "mat-hint[align='end']"], false, never>;
     static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_mobile: unknown;
     static ngAcceptInputType_readonly: unknown;

package/src/assets/manifest.json

@@ -2,7 +2,7 @@
   "name": "ngx-sumaris-components",
   "short_name": "ngx-sumaris-components",
   "manifest_version": 1,
-  "version": "2.12.13",
+  "version": "2.12.15",
   "default_locale": "fr",
   "description": "Angular components for building beautiful and responsive Apps",
   "icons": [{

package/src/theme/_ngx-components.scss

@@ -208,7 +208,12 @@ mat-option:not(:last-of-type) {
   min-width: var(--min-width) !important;
   max-width: var(--max-width) !important;
 
-  div.mat-mdc-select-panel {
+  // FIXME : This is a workaround find at : https://github.com/angular/components/issues/26000#issuecomment-1563107933
+  &:has(.mat-select-panel-fit-content) {
+    --min-width: fit-content !important;
+  }
+
+  .mat-mdc-select-panel {
     --mat-switch-visible-track-transition: transform 75ms 50ms cubic-bezier(0, 0, 0.2, 1);
     transition: --mat-switch-visible-track-transition;
     transform: scaleY(1) !important;
@@ -224,15 +229,23 @@ mat-option:not(:last-of-type) {
       }
     }
   }
+
 }
-.mat-mdc-autocomplete-panel {
+
+
+.cdk-overlay-pane:has(.mat-mdc-autocomplete-panel) {
   --min-width: 200px;
   --max-width: calc(min(100%, 100vw - 64px));
   min-width: var(--min-width) !important;
   max-width: var(--max-width) !important;
-  width: var(--max-width) !important;
+
+  // FIXME : This is a workaround find at : https://github.com/angular/components/issues/26000#issuecomment-1563107933
+  &:has(.mat-select-panel-fit-content) {
+    --min-width: fit-content !important;
+  }
 }
 
+
 .mat-mdc-autocomplete-panel-medium-size .mat-mdc-autocomplete-panel,
 .mat-mdc-autocomplete-panel-medium-size.mat-mdc-autocomplete-panel,
 .min-width-medium .mat-mdc-autocomplete-panel,
@@ -259,15 +272,6 @@ mat-option:not(:last-of-type) {
   --min-width: 80vw;
 }
 
-
-// FIXME : This is a workaround find at : https://github.com/angular/components/issues/26000#issuecomment-1563107933
-.cdk-overlay-pane.mat-select-panel-fit-content {
-  --min-width: fit-content;
-  --max-width: calc(100vw - 64px);
-  min-width: var(--min-width);
-  max-width: var(--max-width);
-}
-
 .mat-mdc-autocomplete-panel-center .mat-mdc-autocomplete-panel,
 .mat-mdc-autocomplete-panel-center.mat-mdc-autocomplete-panel {
   margin-left: calc(var(--min-width, 200px) / -2 + 50%) !important;