diff --git a/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts b/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts index 2f5ce173..600d1101 100644 --- a/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts +++ b/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts @@ -33,7 +33,7 @@ export abstract class ItAbstractFormComponent extends ItAbstractCompone /** * Internal form control */ - protected control: FormControl; + protected control: FormControl; constructor( protected readonly _translateService: TranslateService, diff --git a/projects/design-angular-kit/src/lib/components/form/input/input.component.ts b/projects/design-angular-kit/src/lib/components/form/input/input.component.ts index 3fe6a15e..0e2f442f 100644 --- a/projects/design-angular-kit/src/lib/components/form/input/input.component.ts +++ b/projects/design-angular-kit/src/lib/components/form/input/input.component.ts @@ -96,7 +96,7 @@ export class ItInputComponent extends ItAbstractFormComponent | ((search?: string) => Observable>); + @Input() autocompleteData?: Array | ((search?: string | number | null) => Observable>); /** * Time span [ms] has passed without another source emission, to delay data filtering. @@ -189,7 +189,7 @@ export class ItInputComponent extends ItAbstractFormComponent }> = new Observable(); @@ -250,7 +250,7 @@ export class ItInputComponent extends ItAbstractFormComponent }> { + private getAutocompleteResults$(): Observable<{ searchedValue: string | number | null | undefined, relatedEntries: Array }> { if (this.type !== 'search') { return of({ searchedValue: '', relatedEntries: [] }); } @@ -259,13 +259,13 @@ export class ItInputComponent extends ItAbstractFormComponent { if (!this.autocompleteData) { - return of({ searchedValue, relatedEntries: [] }); + return of({ searchedValue, relatedEntries: >[] }); } const autoCompleteData$ = Array.isArray(this.autocompleteData) ? of(this.autocompleteData) : this.autocompleteData(searchedValue); return autoCompleteData$.pipe( map(autocompleteData => { - if (!searchedValue) { + if (!searchedValue || typeof searchedValue === 'number') { return { searchedValue, relatedEntries: [] }; } diff --git a/projects/design-angular-kit/src/lib/components/form/select/select.component.html b/projects/design-angular-kit/src/lib/components/form/select/select.component.html index c98673ba..4bab74d2 100644 --- a/projects/design-angular-kit/src/lib/components/form/select/select.component.html +++ b/projects/design-angular-kit/src/lib/components/form/select/select.component.html @@ -6,21 +6,21 @@ (blur)="markAsTouched()" [attr.aria-describedby]="id + '-description'"> - - - diff --git a/projects/design-angular-kit/src/lib/interfaces/form.ts b/projects/design-angular-kit/src/lib/interfaces/form.ts index 8374d888..765254c8 100644 --- a/projects/design-angular-kit/src/lib/interfaces/form.ts +++ b/projects/design-angular-kit/src/lib/interfaces/form.ts @@ -2,16 +2,16 @@ import { IconName } from './icon'; export type InputControlType = 'text' | 'email' | 'number' | 'date' | 'time' | 'tel' | 'color' | 'url' | 'search'; -export interface SelectControlOption { - value: any, +export interface SelectControlOption { + value: T, text?: string, - selected?: boolean | ((value: any) => boolean), - disabled?: boolean | ((value: any) => boolean) + selected?: boolean | ((value: T) => boolean), + disabled?: boolean | ((value: T) => boolean) } -export interface SelectControlGroup { +export interface SelectControlGroup { label: string, - options: Array, + options: Array>, dragdrop?: boolean }