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

package/components/field/field.component.d.ts

@@ -0,0 +1,376 @@
+import { FocusMonitor } from '@angular/cdk/a11y';
+import { AfterViewInit, ChangeDetectorRef, DestroyRef, DoCheck, ElementRef, EventEmitter, NgZone, OnInit } from '@angular/core';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { MatIconRegistry } from '@angular/material/icon';
+import { DomSanitizer } from '@angular/platform-browser';
+import { CdkTextareaAutosize } from '@angular/cdk/text-field';
+import { FieldType } from './field.model';
+import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+import { BadgeVariant } from '@testgorilla/tgo-ui/components/badge';
+import { IconName } from '@testgorilla/tgo-ui/components/icon';
+import * as i0 from "@angular/core";
+/**
+ * A global counter used to generate unique field IDs.
+ * This variable is incremented each time a new field ID is needed.
+ *
+ * @remarks
+ * This is primarily used to ensure that each field component
+ * has a unique identifier within the application / useful for their Aria Labels.
+ */
+export declare let fieldID: number;
+export declare class FieldComponent implements OnInit, ControlValueAccessor, DoCheck, AfterViewInit {
+    private readonly defaultAppTheme;
+    private matIconRegistry;
+    private domSanitizer;
+    private cdr;
+    ngControl: NgControl;
+    private focusMonitor;
+    private ngZone;
+    private destroyRef;
+    class: string;
+    /**
+     * Indicator of the autocomplete width
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    fullWidth: boolean;
+    /**
+     * Indicator of the field height
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    fullHeight: boolean;
+    /**
+     * Form field label
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    label?: string | undefined;
+    /**
+     * Form field label from html
+     *
+     * @memberof FieldComponent
+     */
+    labelHtml: import("@angular/core").InputSignal<string | null>;
+    /**
+     * Icon to display alongside the label
+     *
+     * @type {IconName}
+     * @memberof FieldComponent
+     */
+    labelIcon?: IconName;
+    /**
+     * Input name attribute
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    fieldName?: string;
+    /**
+     * Input placeholder
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    placeholder?: string | undefined;
+    /**
+     * Input id
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    id: import("@angular/core").InputSignal<string>;
+    /**
+     * Input value
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    value: string;
+    /**
+     * Variant of badge to use
+     *
+     * @type {BadgeVariant}
+     * @memberof FieldComponent
+     */
+    badgeVariant?: BadgeVariant | undefined;
+    _errors: string[];
+    /**
+     * Input field errors
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    set errors(errors: string[]);
+    /**
+     * Determines if input is disabled
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    disabled: boolean;
+    /**
+     * Input is required or not
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    required: boolean;
+    /**
+     * Input is readonly or not
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    readOnly: boolean;
+    /**
+     * Hint text
+     *
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    hintMessage: string;
+    /**
+     * Input type
+     *
+     * @type {FieldType}
+     * @memberof FieldComponent
+     */
+    type: FieldType;
+    /**
+     * Input is update only on blur
+     *
+     * @type {Boolean}
+     * @memberof FieldComponent
+     */
+    updateOnBlur: boolean;
+    /**
+     * allow only digits in input
+     *
+     * @type {Boolean}
+     * @memberof FieldComponent
+     */
+    allowOnlyDigits: boolean;
+    /**
+     * allow autocomplete off in input
+     *
+     * @type {Boolean}
+     * @memberof FieldComponent
+     */
+    isAutocompleteOff: boolean;
+    /**
+     * allow negative numbers
+     *
+     * @type {Boolean}
+     * @memberof FieldComponent
+     */
+    allowNegative: boolean;
+    /**
+     * Show reserved content below form field
+     * @property showBottomContent
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    showBottomContent: boolean;
+    /**
+     *
+     * Defines the application theme
+     *
+     * @type {ApplicationTheme}
+     * @memberof FieldComponent
+     */
+    applicationTheme: ApplicationTheme;
+    /**
+     * A string representing the ARIA label for accessibility.
+     * This label is used to provide an accessible name for the input element.
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    ariaLabel: string;
+    /**
+     * Show loading button. Only for text
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    loading: boolean;
+    /**
+     * Show icon when field is valid
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    isValid: boolean;
+    /**
+     * Max characters number
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    maxCharacters: number;
+    /**
+     * Trim text on blur
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    trimOnBlur: boolean;
+    /**
+     * Trim text on submit
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    trimOnSubmit: boolean;
+    /**
+     * Max rows for multi-line type
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    maxRows: number;
+    /**
+     * has text area counter
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    hasTextAreaCounter: boolean;
+    /**
+     * Hide in build errors for Reactive Forms
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    hideBuiltInErrors: boolean;
+    /**
+     * Hide label in errors
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    hideLabelInErrors: boolean;
+    /**
+     * Set maximum number
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    max: number | undefined;
+    /**
+     * Set minimum number
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    min: number | undefined;
+    /**
+     * Sets textarea height. Default 110
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    textareaHeight: number;
+    /**
+     * Sets textarea borderless. Default false
+     *
+     * @type {number}
+     * @memberof FieldComponent
+     */
+    borderless: boolean;
+    autosizableTextarea: boolean;
+    /**
+     * Indicates if this field is filled by AI
+     *
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    isAIVariant: boolean;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used for input field Aria Labeled By Element Id.
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    protected readonly ariaLabelledbyId: import("@angular/core").Signal<string>;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used for input field Aria LabeledBy Text.
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    protected readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used for input field Aria Described By Element Id.
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    protected readonly ariaDescribedbyId: import("@angular/core").Signal<string>;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used for input field Aria DescribedBy Text.
+     * @type {string}
+     * @memberof FieldComponent
+     */
+    protected readonly ariaDescribedby: import("@angular/core").InputSignal<string | undefined>;
+    /**
+     * Show state of error
+     * @type {boolean}
+     * @memberof FieldComponent
+     */
+    hasError: boolean;
+    validateEvent: EventEmitter<string>;
+    fieldBlur: EventEmitter<void>;
+    field: ElementRef<HTMLInputElement>;
+    autosize: CdkTextareaAutosize;
+    get getPasswordIcon(): IconName;
+    isActiveField: boolean;
+    isActiveHover: boolean;
+    keyboardFocused: import("@angular/core").WritableSignal<boolean>;
+    protected readonly translationContext = "FIELD.";
+    /**
+     * @ignore
+     */
+    onChange: (_: any) => void;
+    /**
+     * @ignore
+     */
+    onTouch: () => void;
+    constructor(defaultAppTheme: ApplicationTheme, matIconRegistry: MatIconRegistry, domSanitizer: DomSanitizer, cdr: ChangeDetectorRef, ngControl: NgControl, focusMonitor: FocusMonitor, ngZone: NgZone, destroyRef: DestroyRef);
+    ngAfterViewInit(): 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;
+    showClose: boolean;
+    showPassword: boolean;
+    currentType: string;
+    errorsLength: boolean;
+    ngOnInit(): void;
+    validate(): void;
+    setSearchInput(): void;
+    getType(): string;
+    clearValue(): void;
+    showPasswordClick(): void;
+    onChangeInputSearch(): void;
+    setErrorsLength(): boolean;
+    onInput(event: any): void;
+    writeValue(value?: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    onActive(state: boolean, action: string): void;
+    onSubmit(): void;
+    private clearSpace;
+    onBlur(): void;
+    trackByFn: (index: number, value: string) => string;
+    focus(): void;
+    refocusPasswordButton(btn: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FieldComponent, [{ optional: true; }, null, null, null, { optional: true; self: true; }, null, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FieldComponent, "ui-field", never, { "fullWidth": { "alias": "fullWidth"; "required": false; }; "fullHeight": { "alias": "fullHeight"; "required": false; }; "label": { "alias": "label"; "required": false; }; "labelHtml": { "alias": "labelHtml"; "required": false; "isSignal": true; }; "labelIcon": { "alias": "labelIcon"; "required": false; }; "fieldName": { "alias": "fieldName"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "badgeVariant": { "alias": "badgeVariant"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "hintMessage": { "alias": "hintMessage"; "required": false; }; "type": { "alias": "type"; "required": false; }; "updateOnBlur": { "alias": "updateOnBlur"; "required": false; }; "allowOnlyDigits": { "alias": "allowOnlyDigits"; "required": false; }; "isAutocompleteOff": { "alias": "isAutocompleteOff"; "required": false; }; "allowNegative": { "alias": "allowNegative"; "required": false; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "isValid": { "alias": "isValid"; "required": false; }; "maxCharacters": { "alias": "maxCharacters"; "required": false; }; "trimOnBlur": { "alias": "trimOnBlur"; "required": false; }; "trimOnSubmit": { "alias": "trimOnSubmit"; "required": false; }; "maxRows": { "alias": "maxRows"; "required": false; }; "hasTextAreaCounter": { "alias": "hasTextAreaCounter"; "required": false; }; "hideBuiltInErrors": { "alias": "hideBuiltInErrors"; "required": false; }; "hideLabelInErrors": { "alias": "hideLabelInErrors"; "required": false; }; "max": { "alias": "max"; "required": false; }; "min": { "alias": "min"; "required": false; }; "textareaHeight": { "alias": "textareaHeight"; "required": false; }; "borderless": { "alias": "borderless"; "required": false; }; "autosizableTextarea": { "alias": "autosizableTextarea"; "required": false; }; "isAIVariant": { "alias": "isAIVariant"; "required": false; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; }; }, { "validateEvent": "validateEvent"; "fieldBlur": "fieldBlur"; }, never, never, false, never>;
+}

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

@@ -0,0 +1,17 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./field.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/material/form-field";
+import * as i4 from "@angular/material/input";
+import * as i5 from "@testgorilla/tgo-ui/components/icon";
+import * as i6 from "@angular/forms";
+import * as i7 from "@testgorilla/tgo-ui/components/button";
+import * as i8 from "@angular/material/icon";
+import * as i9 from "@testgorilla/tgo-ui/components/core";
+import * as i10 from "@testgorilla/tgo-ui/components/validation-error";
+import * as i11 from "@testgorilla/tgo-ui/components/badge";
+export declare class FieldComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FieldComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FieldComponentModule, [typeof i1.FieldComponent], [typeof i2.CommonModule, typeof i3.MatFormFieldModule, typeof i4.MatInputModule, typeof i5.IconComponentModule, typeof i6.FormsModule, typeof i6.ReactiveFormsModule, typeof i7.ButtonComponentModule, typeof i8.MatIconModule, typeof i9.UiTranslatePipe, typeof i10.ValidationErrorModule, typeof i9.HasValidationErrorPipe, typeof i9.DigitsOnlyDirective, typeof i11.BadgeComponentModule], [typeof i1.FieldComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<FieldComponentModule>;
+}

package/components/field/field.model.d.ts

@@ -0,0 +1 @@
+export type FieldType = 'text' | 'password' | 'email' | 'number' | 'tel' | 'search' | 'collapsed-search' | 'validation-text' | 'textarea' | 'textarea-scrollable' | 'multi-line';