@gerandon/ngx-widgets/index.d.ts

Angular widget (components) collection using CVA (ControlValueAccessor)

import * as _angular_core from '@angular/core';
import { AfterViewInit, OnDestroy, ElementRef, ChangeDetectorRef, InjectionToken, OnInit, OnChanges, SimpleChanges, QueryList } from '@angular/core';
import { ControlValueAccessor, Validator, ValidationErrors, NgControl, FormControl, ValidatorFn, AbstractControl } from '@angular/forms';
import { Observable, Subject } from 'rxjs';
import { MatFormFieldAppearance, FloatLabelType, SubscriptSizing } from '@angular/material/form-field';
import { NgxMaskDirective } from 'ngx-mask';
import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
import { MatChipInputEvent } from '@angular/material/chips';

declare class BaseValueAccessor<T> implements ControlValueAccessor, AfterViewInit, Validator, OnDestroy {
    readonly validator: _angular_core.InputSignal<Observable<ValidationErrors>>;
    inputElement: ElementRef;
    input: NgControl;
    control: FormControl;
    private onChange;
    private onTouched;
    private readonly injector;
    protected controlDir: NgControl;
    protected readonly cdr: ChangeDetectorRef;
    protected _validate: ValidatorFn;
    protected readonly _defaultValidate: ValidatorFn;
    protected readonly destroy$: Subject<void>;
    constructor();
    validate(control: AbstractControl): Observable<ValidationErrors>;
    ngAfterViewInit(): void;
    writeValue(obj: T): void;
    registerOnChange(fn: (value: T) => unknown): void;
    registerOnTouched(fn: () => unknown): void;
    protected get valueAccessor(): ControlValueAccessor | null;
    ngOnDestroy(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseValueAccessor<any>, never>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseValueAccessor<any>, never, never, { "validator": { "alias": "validator"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

interface NgxWidgetsValidationErrorTypes {
    required?: string;
    selectGlobalPlaceholder?: string;
}
declare const NGX_WIDGETS_VALIDATION_TRANSLATIONS: InjectionToken<NgxWidgetsValidationErrorTypes>;
declare const NGX_WIDGETS_FORM_FIELD_APPEARANCE: InjectionToken<MatFormFieldAppearance>;
declare class BaseInput<T> extends BaseValueAccessor<T> implements OnInit, AfterViewInit, OnChanges {
    protected readonly validationTranslations: NgxWidgetsValidationErrorTypes | any;
    protected readonly formFieldAppearance: MatFormFieldAppearance;
    protected readonly appearance: _angular_core.InputSignal<MatFormFieldAppearance | undefined>;
    protected readonly _appearance: _angular_core.WritableSignal<MatFormFieldAppearance>;
    id: string;
    name: string;
    label: string;
    readonly translateParams: _angular_core.InputSignal<unknown>;
    placeholder: string;
    readonly isDisabled: _angular_core.InputSignal<boolean | undefined>;
    readonly floatLabel: _angular_core.InputSignal<FloatLabelType>;
    prefixIcon?: string;
    suffixIcon?: string;
    suffix?: string;
    readonly formControlName: _angular_core.InputSignal<string | undefined>;
    readonly validatorMessages: _angular_core.InputSignal<{
        [key: string]: string;
    } | undefined>;
    readonly subscriptSizing: _angular_core.InputSignal<SubscriptSizing>;
    readonly hintLabel: _angular_core.InputSignal<string>;
    validatorMessagesArray: {
        key: string;
        value: unknown;
    }[];
    constructor(validationTranslations: (NgxWidgetsValidationErrorTypes | any) | undefined, formFieldAppearance: MatFormFieldAppearance);
    ngOnInit(): void;
    ngOnChanges(changes: SimpleChanges): void;
    ngAfterViewInit(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseInput<any>, [{ optional: true; }, { optional: true; }]>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseInput<any>, never, never, { "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "label": { "alias": "label"; "required": false; }; "translateParams": { "alias": "translateParams"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "prefixIcon": { "alias": "prefixIcon"; "required": false; }; "suffixIcon": { "alias": "suffixIcon"; "required": false; }; "suffix": { "alias": "suffix"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; "isSignal": true; }; "validatorMessages": { "alias": "validatorMessages"; "required": false; "isSignal": true; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; "isSignal": true; }; "hintLabel": { "alias": "hintLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

declare class BaseTextInput<T> extends BaseInput<T> {
    readonly type: _angular_core.InputSignal<"number" | "text" | "password" | "email" | "tel">;
    readonly maxLength: _angular_core.InputSignal<number | undefined>;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseTextInput<any>, never>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseTextInput<any>, never, never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

declare class BaseMaskInput extends BaseTextInput<string> implements AfterViewInit {
    readonly mask: _angular_core.InputSignal<string | undefined>;
    readonly showMaskTyped: _angular_core.InputSignal<boolean>;
    readonly dropSpecialCharacters: _angular_core.InputSignal<boolean | string[] | readonly string[] | null | undefined>;
    readonly specialCharacters: _angular_core.InputSignal<string[] | undefined>;
    readonly placeHolderCharacter: _angular_core.InputSignal<string>;
    readonly maskPrefix: _angular_core.InputSignal<string>;
    readonly maskSuffix: _angular_core.InputSignal<string>;
    maskInput: NgxMaskDirective;
    ngAfterViewInit(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseMaskInput, never>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseMaskInput, never, never, { "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "showMaskTyped": { "alias": "showMaskTyped"; "required": false; "isSignal": true; }; "dropSpecialCharacters": { "alias": "dropSpecialCharacters"; "required": false; "isSignal": true; }; "specialCharacters": { "alias": "specialCharacters"; "required": false; "isSignal": true; }; "placeHolderCharacter": { "alias": "placeHolderCharacter"; "required": false; "isSignal": true; }; "maskPrefix": { "alias": "maskPrefix"; "required": false; "isSignal": true; }; "maskSuffix": { "alias": "maskSuffix"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

/**
 * Automatically unsubscribe from an Observable when the view is destroyed
 * Tested with checking the "complete" event of a subscribe method
 * @description
 * An Annotation that should be used with an Observable typed variable to handle its subscriptions
 * @author gergo.asztalos
 */
declare function UnsubscribeOnDestroy<ObservableType>(): PropertyDecorator;

declare class BasicInputComponent extends BaseMaskInput implements OnInit {
    readonly iconClick: _angular_core.OutputEmitterRef<void>;
    ngOnInit(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BasicInputComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BasicInputComponent, "gerandon-basic-input", never, {}, { "iconClick": "iconClick"; }, never, never, true, never>;
}

interface SelectOptionType {
    label: string;
    value: string | number | null | unknown;
}
declare class SelectComponent extends BaseInput<unknown> implements OnInit {
    /**
     * In this case, an empty option appears that resets the control, to an empty value state
     */
    emptyOptionLabel?: string;
    readonly multiple: _angular_core.InputSignal<boolean | undefined>;
    options: SelectOptionType[];
    readonly asyncOptions: _angular_core.InputSignal<Observable<SelectOptionType[]> | undefined>;
    optionElements: QueryList<ElementRef>;
    /**
     * Angular Material - Select component comparsion is only '===', does not work with Array values
     * https://github.com/angular/components/blob/a07c0758a5ec2eb4de1bb822354be08178c66aa4/src/lib/select/select.ts#L242C48-L242C58
     */
    readonly _isEqual: (value: any, other: any) => boolean;
    ngOnInit(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent, "gerandon-select", never, { "emptyOptionLabel": { "alias": "emptyOptionLabel"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; }; "asyncOptions": { "alias": "asyncOptions"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

declare class TextareaInputComponent extends BaseTextInput<string> {
    readonly rows: _angular_core.InputSignal<number>;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaInputComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaInputComponent, "gerandon-textarea-input", never, { "rows": { "alias": "rows"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

declare class BasicChipsComponent<T> extends BaseInput<T[]> implements OnInit {
    readonly tsFilterInput: _angular_core.Signal<ElementRef<any> | undefined>;
    readonly asyncFilterFn: _angular_core.InputSignal<((value: string) => Observable<T[]>) | undefined>;
    readonly asyncOptions: _angular_core.InputSignal<Observable<T[]> | undefined>;
    readonly startTypingLabel: _angular_core.InputSignal<string>;
    readonly emptyListLabel: _angular_core.InputSignal<string>;
    /**
     * How much character you need to type before triggering search
     */
    readonly startAsyncFnAt: _angular_core.InputSignal<number>;
    labelProperty?: keyof T;
    readonly separatorKeysCodes: readonly [13, 188];
    filterOptions$?: Observable<T[]>;
    protected _hintLabel: string;
    private readonly inputChange;
    ngOnInit(): void;
    filter(): void;
    remove(item: T): void;
    add(event: MatChipInputEvent): void;
    selected(event: MatAutocompleteSelectedEvent): void;
    private updateValue;
    private mark;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BasicChipsComponent<any>, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BasicChipsComponent<any>, "gerandon-basic-chips", never, { "asyncFilterFn": { "alias": "asyncFilterFn"; "required": false; "isSignal": true; }; "asyncOptions": { "alias": "asyncOptions"; "required": false; "isSignal": true; }; "startTypingLabel": { "alias": "startTypingLabel"; "required": false; "isSignal": true; }; "emptyListLabel": { "alias": "emptyListLabel"; "required": false; "isSignal": true; }; "startAsyncFnAt": { "alias": "startAsyncFnAt"; "required": false; "isSignal": true; }; "labelProperty": { "alias": "labelProperty"; "required": false; }; }, {}, never, never, true, never>;
}

export { BaseInput, BaseMaskInput, BaseTextInput, BaseValueAccessor, BasicChipsComponent, BasicInputComponent, NGX_WIDGETS_FORM_FIELD_APPEARANCE, NGX_WIDGETS_VALIDATION_TRANSLATIONS, SelectComponent, TextareaInputComponent, UnsubscribeOnDestroy };
export type { NgxWidgetsValidationErrorTypes, SelectOptionType };