@testgorilla/tgo-ui 7.0.0-beta.0 → 7.0.0

package/components/autocomplete/autocomplete.component.d.ts

@@ -0,0 +1,324 @@
+import { FocusMonitor } from '@angular/cdk/a11y';
+import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import { AfterViewInit, ChangeDetectorRef, DestroyRef, DoCheck, ElementRef, EventEmitter, NgZone, OnChanges, OnDestroy, SimpleChanges, OnInit } from '@angular/core';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { MatAutocomplete, MatAutocompleteSelectedEvent, MatAutocompleteTrigger } from '@angular/material/autocomplete';
+import { BehaviorSubject, ReplaySubject, Subscription } from 'rxjs';
+import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+import { AutocompleteUtils } from '@testgorilla/tgo-ui/components/core';
+import { Autocomplete, AutocompleteSize, AutocompleteType, DropdownVariationType } from './autocomplete.model';
+import * as i0 from "@angular/core";
+export declare class AutocompleteComponent implements ControlValueAccessor, OnChanges, AfterViewInit, DoCheck, OnDestroy, OnInit {
+    private readonly defaultAppTheme;
+    private readonly cdr;
+    ngControl: NgControl;
+    private readonly platformId;
+    private readonly el;
+    private readonly focusMonitor;
+    private readonly destroyRef;
+    private readonly ngZone;
+    /**
+     * @property itemsList
+     * @description The list of items to display in the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    itemsList: any[] | {
+        groupName: string;
+        items: any[];
+        isGroup: boolean;
+    }[];
+    /**
+     * @property suggestionsList
+     * @description The list of suggestions to display in the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    suggestionsList: any[];
+    /**
+     * @property disabled
+     * @description If `true`, the autocomplete is disabled.
+     * @memberof AutocompleteComponent
+     */
+    disabled: boolean;
+    /**
+     * @property allowAdd
+     * @description If `true`, allows adding new values to the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    allowAdd: boolean;
+    /**
+     * @property textField
+     * @description The field to be used as the display text in the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    textField: string;
+    /**
+     * @property valueField
+     * @description The field to be used as the value in the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    valueField: string;
+    /**
+     * @property label
+     * @description The label for the autocomplete input.
+     * @memberof AutocompleteComponent
+     */
+    label: string;
+    /**
+     * @property placeholder
+     * @description The placeholder for the autocomplete input.
+     * @memberof AutocompleteComponent
+     */
+    placeholder: string;
+    /**
+     * @property value
+     * @description The selected value(s) in the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    set itemValue(v: any);
+    /**
+     * @property type
+     * @description The type of the autocomplete ('single', 'multi', etc.).
+     * @memberof AutocompleteComponent
+     */
+    type: AutocompleteType;
+    /**
+     * @property minCharactersSearch
+     * @description The minimum characters to trigger search.
+     * @memberof AutocompleteComponent
+     */
+    minCharactersSearch: number;
+    /**
+     * @property variant
+     * @description The variant of Autocomplete
+     * @memberof AutocompleteComponent
+     */
+    variant: DropdownVariationType;
+    /**
+     * Show reserved content below form field
+     * @property showBottomContent
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    showBottomContent: boolean;
+    /**
+     * Return full object if true
+     * @property valuePrimitive
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    valuePrimitive: boolean;
+    /**
+     * Indicator of the autocomplete width
+     * @property fullWidth
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    fullWidth: boolean;
+    /**
+     *
+     * Defines the application theme
+     *
+     * @type {ApplicationTheme}
+     * @memberof AutocompleteComponent
+     */
+    applicationTheme: ApplicationTheme;
+    /**
+     * Autocomplete is required or not
+     *
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    required: boolean;
+    /**
+     * Input field errors
+     *
+     * @type {string[]}
+     * @memberof AutocompleteComponent
+     */
+    set errors(errors: string[]);
+    /**
+     * Color of the option hover.
+     * Defaults to Test Gorilla primary color.
+     *
+     * @type {string}
+     * @memberof AutocompleteComponent
+     */
+    companyColor: string | null;
+    /**
+     * Hide in-build errors for Reactive Forms
+     *
+     * @type {number}
+     * @memberof AutocompleteComponent
+     */
+    hideBuiltInErrors: boolean;
+    /**
+     * Hide label in errors
+     *
+     * @type {number}
+     * @memberof AutocompleteComponent
+     */
+    hideLabelInErrors: boolean;
+    /**
+     * Sets dropdown list to virtual scroll mode
+     *
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    virtualScroll: boolean;
+    /**
+     * @property compareWith
+     * @description Custom comparison logic for the autocomplete.
+     * @memberof AutocompleteComponent
+     */
+    compareWith: (a: any, b: any) => boolean;
+    /**
+     * @property dropdownPanelClass
+     * @description Sets class on autocomplete dropdown
+     * @memberof AutocompleteComponent
+     */
+    dropdownPanelClass: string;
+    /**
+     * @property closeOnScroll
+     * @description Defines if dropdown should be closed on page scroll
+     * @memberof AutocompleteComponent
+     */
+    closeOnScroll: boolean;
+    /**
+     * @property AutocompleteSize
+     * @description Defines the size of the autocomplete. Small changes the tags to counter; medium is default.
+     * @memberof AutocompleteComponent
+     */
+    size: AutocompleteSize;
+    /**
+     * @property allowUserInput
+     * @description If `true`, allows the user to input custom values in the autocomplete.
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    allowUserInput: boolean;
+    /**
+     * @property clearable
+     * @description If `true`, allows the user to clear the input values
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    clearable: boolean;
+    /**
+     * @property exactMatchSelect
+     * @description If `true`, allows to select the exact match from the suggestions list
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    exactMatchSelect: boolean;
+    /**
+     * @property maxItemSelected
+     * @description Sets the maximum number of items that can be selected in the autocomplete
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    maxItemSelected: number;
+    /**
+     * @property maxItemSelected
+     * @description Sets the maximum length of the autocomplete input
+     * @type {boolean}
+     * @memberof AutocompleteComponent
+     */
+    maxLength?: number;
+    isDynamicFilteringEnabled: boolean;
+    dynamicFilterLoading: boolean;
+    dynamicFilteredList: any[] | null;
+    infiniteScroll: boolean;
+    hasMoreOptionsForInfiniteScroll: boolean;
+    selectionChange: EventEmitter<any>;
+    searchTextChange: EventEmitter<string>;
+    blur: EventEmitter<void>;
+    focus: EventEmitter<void>;
+    /**
+     * @property scrollViewportBottomReached
+     * @description Emits when the bottom of the unfiltered list is reached during infinite scroll
+     * @memberof AutocompleteComponent
+     */
+    scrollViewportBottomReached: EventEmitter<void>;
+    /**
+     * @property scrollViewportBottomReachedFiltered
+     * @description Emits when the bottom of the filtered list is reached during infinite scroll
+     * @memberof AutocompleteComponent
+     */
+    scrollViewportBottomReachedFiltered: EventEmitter<void>;
+    formFieldElement: ElementRef<HTMLElement>;
+    tagContainer: ElementRef<HTMLElement>;
+    autocomplete: MatAutocompleteTrigger;
+    set cdkVirtualScrollViewport(viewport: CdkVirtualScrollViewport);
+    matAutocomplete: MatAutocomplete;
+    matInput: ElementRef<HTMLInputElement>;
+    protected safeErrors: string[];
+    protected value: any;
+    protected inputValue: any;
+    protected isInputFocus: boolean;
+    protected autocompleteType: typeof Autocomplete;
+    protected isOverLapping: boolean;
+    protected isOverlapChecking: boolean;
+    protected overlapIndex: number;
+    protected inputOpacity: number;
+    protected firstTagMaxWidth: number;
+    protected inputValueSearch$: BehaviorSubject<string>;
+    protected userInput$: ReplaySubject<string>;
+    protected dynamicFilteredList$: BehaviorSubject<any[] | null>;
+    protected filteredItemsList$: import("rxjs").Observable<any>;
+    protected filteredSuggestionList$: import("rxjs").Observable<any>;
+    protected savedVirtualScrollViewport: CdkVirtualScrollViewport;
+    protected savedVirtualScrollSubscription: Subscription;
+    protected isFilteredViewport: boolean;
+    scrollEvent: (event: any) => void;
+    protected searchResult$: import("rxjs").Observable<boolean>;
+    protected translationContext: string;
+    protected readonly AutocompleteUtils: typeof AutocompleteUtils;
+    private readonly isPlatform;
+    private observer;
+    protected keyboardFocused: import("@angular/core").WritableSignal<boolean>;
+    isAlreadyAdded: boolean;
+    constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, ngControl: NgControl, platformId: any, el: ElementRef, focusMonitor: FocusMonitor, destroyRef: DestroyRef, ngZone: NgZone);
+    ngOnInit(): void;
+    /**
+     * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors
+     * to display validation errors that might happen (e.g. required)
+     */
+    ngDoCheck(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    onChange: (_: any) => void;
+    onTouch: () => void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    writeValue(value: any): void;
+    protected get isGrouped(): boolean;
+    protected onOptionSelected(event: MatAutocompleteSelectedEvent): void;
+    protected onOptionRemoved(option: any): void;
+    protected onInputChange(event: Event): void;
+    protected onClear(): void;
+    protected refillInput(): void;
+    protected gotoUp(): void;
+    protected onFocus(): void;
+    private checkOverlap;
+    private onUpdate;
+    private updateControlMaxLengthValidity;
+    private initValue;
+    private addNewValue;
+    protected get isDropdown(): boolean;
+    protected onChevronClick(autocomplete: MatAutocomplete): void;
+    protected get inputWidth(): number;
+    protected trackByFn: (index: number, value: string) => string;
+    /**
+     * Adding company color variable to the body to style overlay container that's out of the component scope.
+     */
+    private setCompanyColorVariable;
+    private subscriberDisplayChange;
+    protected get hasObjectValue(): boolean;
+    onKeydown($event: KeyboardEvent): void;
+    protected getVirtualScrollHeight(itemCount: number): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, [{ optional: true; }, null, { optional: true; self: true; }, null, null, null, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteComponent, "ui-autocomplete", never, { "itemsList": { "alias": "itemsList"; "required": false; }; "suggestionsList": { "alias": "suggestionsList"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "allowAdd": { "alias": "allowAdd"; "required": false; }; "textField": { "alias": "textField"; "required": false; }; "valueField": { "alias": "valueField"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "itemValue": { "alias": "itemValue"; "required": false; }; "type": { "alias": "type"; "required": false; }; "minCharactersSearch": { "alias": "minCharactersSearch"; "required": false; }; "variant": { "alias": "variant"; "required": true; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "valuePrimitive": { "alias": "valuePrimitive"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "hideBuiltInErrors": { "alias": "hideBuiltInErrors"; "required": false; }; "hideLabelInErrors": { "alias": "hideLabelInErrors"; "required": false; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "dropdownPanelClass": { "alias": "dropdownPanelClass"; "required": false; }; "closeOnScroll": { "alias": "closeOnScroll"; "required": false; }; "size": { "alias": "size"; "required": false; }; "allowUserInput": { "alias": "allowUserInput"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "exactMatchSelect": { "alias": "exactMatchSelect"; "required": false; }; "maxItemSelected": { "alias": "maxItemSelected"; "required": false; }; "maxLength": { "alias": "maxLength"; "required": false; }; "isDynamicFilteringEnabled": { "alias": "isDynamicFilteringEnabled"; "required": false; }; "dynamicFilterLoading": { "alias": "dynamicFilterLoading"; "required": false; }; "dynamicFilteredList": { "alias": "dynamicFilteredList"; "required": false; }; "infiniteScroll": { "alias": "infiniteScroll"; "required": false; }; "hasMoreOptionsForInfiniteScroll": { "alias": "hasMoreOptionsForInfiniteScroll"; "required": false; }; }, { "selectionChange": "selectionChange"; "searchTextChange": "searchTextChange"; "blur": "blur"; "focus": "focus"; "scrollViewportBottomReached": "scrollViewportBottomReached"; "scrollViewportBottomReachedFiltered": "scrollViewportBottomReachedFiltered"; }, never, never, false, never>;
+    static ngAcceptInputType_virtualScroll: unknown;
+}

package/components/autocomplete/autocomplete.component.module.d.ts

@@ -0,0 +1,23 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./autocomplete.component";
+import * as i2 from "./transform-Item.pipe";
+import * as i3 from "./includes.pipe";
+import * as i4 from "./select-text.directive";
+import * as i5 from "@angular/common";
+import * as i6 from "@angular/material/form-field";
+import * as i7 from "@angular/material/autocomplete";
+import * as i8 from "@angular/material/input";
+import * as i9 from "@angular/forms";
+import * as i10 from "@testgorilla/tgo-ui/components/tag";
+import * as i11 from "@angular/material/chips";
+import * as i12 from "@testgorilla/tgo-ui/components/icon";
+import * as i13 from "@testgorilla/tgo-ui/components/core";
+import * as i14 from "@testgorilla/tgo-ui/components/validation-error";
+import * as i15 from "@angular/cdk/scrolling";
+import * as i16 from "./prevent-input.directive";
+import * as i17 from "@testgorilla/tgo-ui/components/spinner";
+export declare class AutocompleteComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AutocompleteComponentModule, [typeof i1.AutocompleteComponent, typeof i2.TransformItemPipe, typeof i3.IncludesPipe, typeof i4.SelectTextDirective], [typeof i5.CommonModule, typeof i6.MatFormFieldModule, typeof i7.MatAutocompleteModule, typeof i8.MatInputModule, typeof i9.FormsModule, typeof i10.TagComponentModule, typeof i11.MatChipsModule, typeof i12.IconComponentModule, typeof i13.UiTranslatePipe, typeof i14.ValidationErrorModule, typeof i13.HasValidationErrorPipe, typeof i15.CdkVirtualForOf, typeof i15.CdkVirtualScrollViewport, typeof i15.CdkFixedSizeVirtualScroll, typeof i16.PreventInputDirective, typeof i17.SpinnerComponentModule], [typeof i1.AutocompleteComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AutocompleteComponentModule>;
+}

package/components/autocomplete/autocomplete.model.d.ts

@@ -0,0 +1,23 @@
+export type AutocompleteType = 'single' | 'multi' | 'large';
+export declare enum Autocomplete {
+    SINGLE = "single",
+    MULTI = "multi",
+    LARGE = "large"
+}
+export declare enum Padding {
+    AUTOCOMPLETE_CONTAINER = 40,
+    DROPDOWN_CONTAINER = 60,
+    AUTOCOMPLETE_SPACE_CONTAINER = 65,
+    DROPDOWN_SPACE_CONTAINER = 85
+}
+export declare const AMOUNT_TAG_WIDTH = 33;
+export declare enum Timeout {
+    VIEW_INITIALIZED_AFTER_ACTION = 150,
+    VIEW_INITIALIZED_COMPONENT_LOAD = 600
+}
+export declare enum DropdownVariation {
+    AUTOCOMPLETE = "autocomplete",
+    DROPDOWN = "dropdown"
+}
+export type DropdownVariationType = `${DropdownVariation}`;
+export type AutocompleteSize = 'small' | 'medium';

package/components/autocomplete/includes.pipe.d.ts

@@ -0,0 +1,12 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * The purpose of this pipe is to determine if the value is present in the values array.
+ * If values is an array, the method uses the includes method to check for inclusion.
+ * If values is not an array, it checks for strict equality between value and values.
+ */
+export declare class IncludesPipe implements PipeTransform {
+    transform(value: any, values: any, valueField?: string): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IncludesPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<IncludesPipe, "includes", false>;
+}