npm - @progressio_resources/gravity-design-system - Versions diffs - 1.0.9 → 1.0.10 - Mend

@progressio_resources/gravity-design-system 1.0.9 → 1.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/esm2020/lib/components/gravity-text-field/gravity-text-field.component.mjs CHANGED Viewed

@@ -2,6 +2,7 @@ import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core
 import * as i0 from "@angular/core";
 import * as i1 from "angular-svg-icon";
 import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
 export class GravityTextFieldComponent {
     constructor() {
         this.textFieldValueResponse = new EventEmitter();
@@ -46,12 +47,16 @@ export class GravityTextFieldComponent {
         this.inputValue = this.inputElement.nativeElement.value;
         this.textFieldValueResponse.emit(this.inputValue);
     }
+    clearInput() {
+        this.inputValue = null;
+        this.textFieldValueResponse.emit(this.inputValue);
+    }
 }
 GravityTextFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GravityTextFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-GravityTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: GravityTextFieldComponent, selector: "gravity-text-field", inputs: { data: "data" }, outputs: { textFieldValueResponse: "textFieldValueResponse" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"], dependencies: [{ kind: "component", type: i1.SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+GravityTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: GravityTextFieldComponent, selector: "gravity-text-field", inputs: { data: "data" }, outputs: { textFieldValueResponse: "textFieldValueResponse" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [ngModel]=\"data.ngModel ? data.ngModel : null\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"], dependencies: [{ kind: "component", type: i1.SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GravityTextFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-text-field', template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"] }]
+            args: [{ selector: 'gravity-text-field', template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [ngModel]=\"data.ngModel ? data.ngModel : null\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"] }]
         }], propDecorators: { textFieldValueResponse: [{
                 type: Output
             }], data: [{
@@ -60,4 +65,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImpor
                 type: ViewChild,
                 args: ['inputElement', { static: false }]
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3Jhdml0eS10ZXh0LWZpZWxkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2dyYXZpdHktZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvZ3Jhdml0eS10ZXh0LWZpZWxkL2dyYXZpdHktdGV4dC1maWVsZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9ncmF2aXR5LWRlc2lnbi1zeXN0ZW0vc3JjL2xpYi9jb21wb25lbnRzL2dyYXZpdHktdGV4dC1maWVsZC9ncmF2aXR5LXRleHQtZmllbGQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFnQixTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsU0FBUyxFQUFDLE1BQU0sZUFBZSxDQUFDOzs7O0FBT3ZHLE1BQU0sT0FBTyx5QkFBeUI7SUFMdEM7UUFNbUIsMkJBQXNCLEdBQXlCLElBQUksWUFBWSxFQUFFLENBQUM7UUF1QjVFLGVBQVUsR0FBWSxLQUFLLENBQUM7UUFDNUIsZUFBVSxHQUFXLEVBQUUsQ0FBQztRQXVCZCxpQkFBWSxHQUFHO1lBQzlCLE9BQU8sRUFBRSxnQkFBZ0I7WUFDekIsS0FBSyxFQUFFLHNCQUFzQjtTQUM5QixDQUFBO0tBa0JGO0lBMUNDLFFBQVE7UUFDTixJQUFJLENBQUMsSUFBSSxDQUFDLFlBQVksR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQztRQUNqRixJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQztRQUM3RSxJQUFJLENBQUMsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxlQUFlLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQztRQUM5RixJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQztRQUNyRSxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQztRQUNoRSxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQztRQUUxRCxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxFQUFFO1lBQ3pCLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDO1NBQ2pHO1FBRUQsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRTtZQUNsQixJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQztTQUN6RjtJQUNILENBQUM7SUFFRCxlQUFlO1FBQ2IsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7SUFDMUIsQ0FBQztJQU9NLGNBQWM7UUFDbkIsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLGlCQUFpQixJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsaUJBQWlCLElBQUksRUFBRSxFQUFFO1lBQ3BFLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQztTQUNwQzthQUFNO1lBQ0wsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLGVBQWUsSUFBSSxTQUFTLEVBQUU7Z0JBQzFDLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUM7YUFDeEI7aUJBQU07Z0JBQ0wsT0FBTyxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsZUFBZSxDQUFDLENBQUM7YUFDckQ7U0FDRjtJQUNILENBQUM7SUFFTSxnQkFBZ0I7UUFDckIsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUM7UUFDeEQsSUFBSSxDQUFDLHNCQUFzQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDcEQsQ0FBQzs7c0hBcEVVLHlCQUF5QjswR0FBekIseUJBQXlCLGlRQ1B0Qyw4OEVBa0RBOzJGRDNDYSx5QkFBeUI7a0JBTHJDLFNBQVM7K0JBQ0Usb0JBQW9COzhCQUtiLHNCQUFzQjtzQkFBdEMsTUFBTTtnQkFDUyxJQUFJO3NCQUFuQixLQUFLO2dCQW9COEMsWUFBWTtzQkFBL0QsU0FBUzt1QkFBQyxjQUFjLEVBQUUsRUFBQyxNQUFNLEVBQUUsS0FBSyxFQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtBZnRlclZpZXdJbml0LCBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0LCBWaWV3Q2hpbGR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdncmF2aXR5LXRleHQtZmllbGQnLFxuICB0ZW1wbGF0ZVVybDogJy4vZ3Jhdml0eS10ZXh0LWZpZWxkLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZ3Jhdml0eS10ZXh0LWZpZWxkLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgR3Jhdml0eVRleHRGaWVsZENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIE9uSW5pdCB7XG4gIEBPdXRwdXQoKSBwdWJsaWMgdGV4dEZpZWxkVmFsdWVSZXNwb25zZTogRXZlbnRFbWl0dGVyPHN0cmluZz4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIEBJbnB1dCgpIHB1YmxpYyBkYXRhOiB7XG4gICAgYXV0b2NvbXBsZXRlPzogc3RyaW5nO1xuICAgIGN1cnJlbnRMYW5nPzogc3RyaW5nO1xuICAgIGN1c3RvbVBsYWNlaG9sZGVyPzogc3RyaW5nO1xuICAgIGN1c3RvbUlucHV0VmFsdWU/OiBzdHJpbmc7XG4gICAgY3lwcmVzc1RhZz86IHN0cmluZztcbiAgICBpY29uPzoge1xuICAgICAgbmFtZXM6IHN0cmluZ1tdO1xuICAgICAgcGxhY2VtZW50PzogJ2xlZnQnIHwgJ3JpZ2h0JztcbiAgICB9XG4gICAgbGFiZWw6IHN0cmluZztcbiAgICBwbGFjZWhvbGRlclR5cGU/OiAnZGVmYXVsdCcgfCAnZW1haWwnIHwgJ3VybCc7XG4gICAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICAgIHN0YXRlPzogJ3JlYWRvbmx5JyB8ICdkaXNhYmxlZCcgfCAnZW5hYmxlZCc7XG4gICAgc3VwcG9ydFRleHQ/OiB7XG4gICAgICBjb250ZW50OiBzdHJpbmc7XG4gICAgICB0eXBlOiAnbmV1dHJvJyB8ICduZWdhdGl2ZScgfCAncG9zaXRpdmUnO1xuICAgIH07XG4gICAgdHlwZT86ICdlbWFpbCcgfCAncGFzc3dvcmQnIHwgJ3RleHQnO1xuICB9O1xuICBAVmlld0NoaWxkKCdpbnB1dEVsZW1lbnQnLCB7c3RhdGljOiBmYWxzZX0pIHByaXZhdGUgaW5wdXRFbGVtZW50OiBhbnk7XG5cbiAgcHVibGljIGZvY3VzSW5wdXQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgcHVibGljIGlucHV0VmFsdWU6IHN0cmluZyA9ICcnO1xuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMuZGF0YS5hdXRvY29tcGxldGUgPSB0aGlzLmRhdGEuYXV0b2NvbXBsZXRlID8gdGhpcy5kYXRhLmF1dG9jb21wbGV0ZSA6IFwib2ZmXCI7XG4gICAgdGhpcy5kYXRhLmN1cnJlbnRMYW5nID0gdGhpcy5kYXRhLmN1cnJlbnRMYW5nID8gdGhpcy5kYXRhLmN1cnJlbnRMYW5nIDogXCJlblwiO1xuICAgIHRoaXMuZGF0YS5wbGFjZWhvbGRlclR5cGUgPSB0aGlzLmRhdGEucGxhY2Vob2xkZXJUeXBlID8gdGhpcy5kYXRhLnBsYWNlaG9sZGVyVHlwZSA6IFwiZGVmYXVsdFwiO1xuICAgIHRoaXMuZGF0YS5yZXF1aXJlZCA9IHRoaXMuZGF0YS5yZXF1aXJlZCA/IHRoaXMuZGF0YS5yZXF1aXJlZCA6IGZhbHNlO1xuICAgIHRoaXMuZGF0YS5zdGF0ZSA9IHRoaXMuZGF0YS5zdGF0ZSA/IHRoaXMuZGF0YS5zdGF0ZSA6IFwiZW5hYmxlZFwiO1xuICAgIHRoaXMuZGF0YS50eXBlID0gdGhpcy5kYXRhLnR5cGUgPyB0aGlzLmRhdGEudHlwZSA6IFwidGV4dFwiO1xuXG4gICAgaWYgKHRoaXMuZGF0YS5zdXBwb3J0VGV4dCkge1xuICAgICAgdGhpcy5kYXRhLnN1cHBvcnRUZXh0LnR5cGUgPSB0aGlzLmRhdGEuc3VwcG9ydFRleHQudHlwZSA/IHRoaXMuZGF0YS5zdXBwb3J0VGV4dC50eXBlIDogXCJuZXV0cm9cIjtcbiAgICB9XG5cbiAgICBpZiAodGhpcy5kYXRhLmljb24pIHtcbiAgICAgIHRoaXMuZGF0YS5pY29uLnBsYWNlbWVudCA9IHRoaXMuZGF0YS5pY29uLnBsYWNlbWVudCA/IHRoaXMuZGF0YS5pY29uLnBsYWNlbWVudCA6ICdsZWZ0JztcbiAgICB9XG4gIH1cblxuICBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgdGhpcy5jaGFuZ2VJbnB1dFZhbHVlKCk7XG4gIH1cblxuICBwcml2YXRlIHJlYWRvbmx5IHBsYWNlaG9sZGVycyA9IHtcbiAgICAnZW1haWwnOiAndGVzdEBlbWFpbC5jb20nLFxuICAgICd1cmwnOiAnaHR0cHM6Ly93d3cudGVzdC5jb20nXG4gIH1cblxuICBwdWJsaWMgZ2V0UGxhY2Vob2xkZXIoKTogc3RyaW5nIHtcbiAgICBpZiAodGhpcy5kYXRhLmN1c3RvbVBsYWNlaG9sZGVyICYmIHRoaXMuZGF0YS5jdXN0b21QbGFjZWhvbGRlciAhPSAnJykge1xuICAgICAgcmV0dXJuIHRoaXMuZGF0YS5jdXN0b21QbGFjZWhvbGRlcjtcbiAgICB9IGVsc2Uge1xuICAgICAgaWYgKHRoaXMuZGF0YS5wbGFjZWhvbGRlclR5cGUgPT0gJ2RlZmF1bHQnKSB7XG4gICAgICAgIHJldHVybiB0aGlzLmRhdGEubGFiZWw7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICByZXR1cm4gdGhpcy5wbGFjZWhvbGRlcnNbdGhpcy5kYXRhLnBsYWNlaG9sZGVyVHlwZV07XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgcHVibGljIGNoYW5nZUlucHV0VmFsdWUoKTogdm9pZCB7XG4gICAgdGhpcy5pbnB1dFZhbHVlID0gdGhpcy5pbnB1dEVsZW1lbnQubmF0aXZlRWxlbWVudC52YWx1ZTtcbiAgICB0aGlzLnRleHRGaWVsZFZhbHVlUmVzcG9uc2UuZW1pdCh0aGlzLmlucHV0VmFsdWUpO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiZ3Jhdml0eS10ZXh0LWZpZWxkXCI+XG4gIDxsYWJlbCBjbGFzcz1cImhyLWJvZHktdGV4dCBtZC1yZWd1bGFyIHt7ZGF0YS5zdGF0ZX19XCIgW2NsYXNzLmVtcHR5XT1cImlucHV0VmFsdWUgPT0gJycgJiYgIWZvY3VzSW5wdXRcIlxuICAgICAgICAgW2NsYXNzLmZvY3VzZWRdPVwiZm9jdXNJbnB1dFwiIFtjbGFzcy5mdWxsXT1cImlucHV0VmFsdWUgIT0gJycgJiYgIWZvY3VzSW5wdXRcIj5cbiAgICB7e2RhdGEubGFiZWx9fVxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLnJlcXVpcmVkXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5jdXJyZW50TGFuZyA9PSAnZXMnXCI+LSBSZXF1ZXJpZG8gPHNwYW4gY2xhc3M9XCJ0ZXh0LW5lZ2F0aXZlXCI+Kjwvc3Bhbj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmN1cnJlbnRMYW5nID09ICdlbidcIj4tIFJlcXVpcmVkIDxzcGFuIGNsYXNzPVwidGV4dC1uZWdhdGl2ZVwiPio8L3NwYW4+PC9uZy1jb250YWluZXI+XG4gICAgPC9uZy1jb250YWluZXI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRhdGEuc3RhdGUgPT0gJ3JlYWRvbmx5J1wiPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRhdGEuY3VycmVudExhbmcgPT0gJ2VzJ1wiPi0gU8OzbG8gbGVjdHVyYTwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRhdGEuY3VycmVudExhbmcgPT0gJ2VuJ1wiPi0gUmVhZG9ubHk8L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5zdGF0ZSA9PSAnZGlzYWJsZWQnXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5jdXJyZW50TGFuZyA9PSAnZXMnXCI+LSBEZXNoYWJpbGl0YWRvPC9uZy1jb250YWluZXI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5jdXJyZW50TGFuZyA9PSAnZW4nXCI+LSBEaXNhYmxlZDwvbmctY29udGFpbmVyPlxuICAgIDwvbmctY29udGFpbmVyPlxuICA8L2xhYmVsPlxuICA8ZGl2IGNsYXNzPVwiaW5wdXQtZmllbGQge3tkYXRhLnN0YXRlfX1cIiBbY2xhc3MuZW1wdHldPVwiaW5wdXRWYWx1ZSA9PSAnJyAmJiAhZm9jdXNJbnB1dFwiIFtjbGFzcy5mb2N1c2VkXT1cImZvY3VzSW5wdXRcIlxuICAgICAgIFtjbGFzcy5mdWxsXT1cImlucHV0VmFsdWUgIT0gJycgJiYgIWZvY3VzSW5wdXRcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5pY29uPy5wbGFjZW1lbnQgPT0gJ2xlZnQnXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiaWNvbnNcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8aW5wdXQgW2F0dHIuZGF0YS1jeV09XCJkYXRhLmN5cHJlc3NUYWdcIlxuICAgICAgICAgICBbYXR0ci5kaXNhYmxlZF09XCJkYXRhLnN0YXRlID09ICdkaXNhYmxlZCcgPyB0cnVlIDogbnVsbFwiXG4gICAgICAgICAgIFthdHRyLnJlYWRvbmx5XT1cImRhdGEuc3RhdGUgPT0gJ3JlYWRvbmx5JyA/IHRydWUgOiBudWxsXCJcbiAgICAgICAgICAgW2F0dHIudmFsdWVdPVwiZGF0YS5jdXN0b21JbnB1dFZhbHVlID8gZGF0YS5jdXN0b21JbnB1dFZhbHVlIDogbnVsbFwiXG4gICAgICAgICAgIFthdXRvY29tcGxldGVdPVwiZGF0YS5hdXRvY29tcGxldGVcIlxuICAgICAgICAgICBbcGxhY2Vob2xkZXJdPVwiZ2V0UGxhY2Vob2xkZXIoKVwiXG4gICAgICAgICAgIFt0eXBlXT1cImRhdGEudHlwZVwiXG5cbiAgICAgICAgICAgKGJsdXIpPVwiZm9jdXNJbnB1dCA9IGZhbHNlXCJcbiAgICAgICAgICAgKGZvY3VzKT1cImZvY3VzSW5wdXQgPSB0cnVlXCJcbiAgICAgICAgICAgKGtleXVwKT1cImNoYW5nZUlucHV0VmFsdWUoKVwiXG5cbiAgICAgICAgICAgY2xhc3M9XCJoci1sYWJlbCBtZC1yZWd1bGFyXCJcblxuICAgICAgICAgICAjaW5wdXRFbGVtZW50PlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmljb24/LnBsYWNlbWVudCA9PSAncmlnaHQnXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiaWNvbnNcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgPC9kaXY+XG4gIDxwIGNsYXNzPVwiaHItYm9keS10ZXh0IHNtLXJlZ3VsYXIgc3VwcG9ydC10ZXh0IHRleHQte3tkYXRhLnN1cHBvcnRUZXh0LnR5cGV9fVwiICpuZ0lmPVwiZGF0YS5zdXBwb3J0VGV4dFwiPlxuICAgIHt7ZGF0YS5zdXBwb3J0VGV4dC5jb250ZW50fX1cbiAgPC9wPlxuPC9kaXY+XG5cbjxuZy10ZW1wbGF0ZSAjaWNvbnM+XG4gIDxzdmctaWNvbiBjbGFzcz1cInBsYWNlbWVudC17e2RhdGEuaWNvbi5wbGFjZW1lbnR9fVwiIFtuYW1lXT1cImljb25OYW1lXCJcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBpY29uTmFtZSBvZiBkYXRhLmljb24ubmFtZXNcIj48L3N2Zy1pY29uPlxuPC9uZy10ZW1wbGF0ZT5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3Jhdml0eS10ZXh0LWZpZWxkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2dyYXZpdHktZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvZ3Jhdml0eS10ZXh0LWZpZWxkL2dyYXZpdHktdGV4dC1maWVsZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9ncmF2aXR5LWRlc2lnbi1zeXN0ZW0vc3JjL2xpYi9jb21wb25lbnRzL2dyYXZpdHktdGV4dC1maWVsZC9ncmF2aXR5LXRleHQtZmllbGQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFnQixTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsU0FBUyxFQUFDLE1BQU0sZUFBZSxDQUFDOzs7OztBQU92RyxNQUFNLE9BQU8seUJBQXlCO0lBTHRDO1FBTW1CLDJCQUFzQixHQUF5QixJQUFJLFlBQVksRUFBRSxDQUFDO1FBd0I1RSxlQUFVLEdBQVksS0FBSyxDQUFDO1FBQzVCLGVBQVUsR0FBVyxFQUFFLENBQUM7UUF1QmQsaUJBQVksR0FBRztZQUM5QixPQUFPLEVBQUUsZ0JBQWdCO1lBQ3pCLEtBQUssRUFBRSxzQkFBc0I7U0FDOUIsQ0FBQTtLQXVCRjtJQS9DQyxRQUFRO1FBQ04sSUFBSSxDQUFDLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7UUFDakYsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7UUFDN0UsSUFBSSxDQUFDLElBQUksQ0FBQyxlQUFlLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxlQUFlLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7UUFDOUYsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7UUFDckUsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7UUFDaEUsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUM7UUFFMUQsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUN6QixJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQztTQUNqRztRQUVELElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUU7WUFDbEIsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUM7U0FDekY7SUFDSCxDQUFDO0lBRUQsZUFBZTtRQUNiLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO0lBQzFCLENBQUM7SUFPTSxjQUFjO1FBQ25CLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxpQkFBaUIsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLGlCQUFpQixJQUFJLEVBQUUsRUFBRTtZQUNwRSxPQUFPLElBQUksQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUM7U0FDcEM7YUFBTTtZQUNMLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxlQUFlLElBQUksU0FBUyxFQUFFO2dCQUMxQyxPQUFPLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDO2FBQ3hCO2lCQUFNO2dCQUNMLE9BQU8sSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxDQUFDO2FBQ3JEO1NBQ0Y7SUFDSCxDQUFDO0lBRU0sZ0JBQWdCO1FBQ3JCLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDO1FBQ3hELElBQUksQ0FBQyxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQ3BELENBQUM7SUFFTSxVQUFVO1FBQ2YsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUM7UUFDdkIsSUFBSSxDQUFDLHNCQUFzQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDcEQsQ0FBQzs7c0hBMUVVLHlCQUF5QjswR0FBekIseUJBQXlCLGlRQ1B0QywyZ0ZBbURBOzJGRDVDYSx5QkFBeUI7a0JBTHJDLFNBQVM7K0JBQ0Usb0JBQW9COzhCQUtiLHNCQUFzQjtzQkFBdEMsTUFBTTtnQkFDUyxJQUFJO3NCQUFuQixLQUFLO2dCQXFCOEMsWUFBWTtzQkFBL0QsU0FBUzt1QkFBQyxjQUFjLEVBQUUsRUFBQyxNQUFNLEVBQUUsS0FBSyxFQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtBZnRlclZpZXdJbml0LCBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0LCBWaWV3Q2hpbGR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdncmF2aXR5LXRleHQtZmllbGQnLFxuICB0ZW1wbGF0ZVVybDogJy4vZ3Jhdml0eS10ZXh0LWZpZWxkLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZ3Jhdml0eS10ZXh0LWZpZWxkLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgR3Jhdml0eVRleHRGaWVsZENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIE9uSW5pdCB7XG4gIEBPdXRwdXQoKSBwdWJsaWMgdGV4dEZpZWxkVmFsdWVSZXNwb25zZTogRXZlbnRFbWl0dGVyPHN0cmluZz4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIEBJbnB1dCgpIHB1YmxpYyBkYXRhOiB7XG4gICAgYXV0b2NvbXBsZXRlPzogc3RyaW5nO1xuICAgIGN1cnJlbnRMYW5nPzogc3RyaW5nO1xuICAgIGN1c3RvbVBsYWNlaG9sZGVyPzogc3RyaW5nO1xuICAgIGN1c3RvbUlucHV0VmFsdWU/OiBzdHJpbmc7XG4gICAgY3lwcmVzc1RhZz86IHN0cmluZztcbiAgICBpY29uPzoge1xuICAgICAgbmFtZXM6IHN0cmluZ1tdO1xuICAgICAgcGxhY2VtZW50PzogJ2xlZnQnIHwgJ3JpZ2h0JztcbiAgICB9XG4gICAgbGFiZWw6IHN0cmluZztcbiAgICBuZ01vZGVsPzogYW55O1xuICAgIHBsYWNlaG9sZGVyVHlwZT86ICdkZWZhdWx0JyB8ICdlbWFpbCcgfCAndXJsJztcbiAgICByZXF1aXJlZD86IGJvb2xlYW47XG4gICAgc3RhdGU/OiAncmVhZG9ubHknIHwgJ2Rpc2FibGVkJyB8ICdlbmFibGVkJztcbiAgICBzdXBwb3J0VGV4dD86IHtcbiAgICAgIGNvbnRlbnQ6IHN0cmluZztcbiAgICAgIHR5cGU6ICduZXV0cm8nIHwgJ25lZ2F0aXZlJyB8ICdwb3NpdGl2ZSc7XG4gICAgfTtcbiAgICB0eXBlPzogJ2VtYWlsJyB8ICdwYXNzd29yZCcgfCAndGV4dCc7XG4gIH07XG4gIEBWaWV3Q2hpbGQoJ2lucHV0RWxlbWVudCcsIHtzdGF0aWM6IGZhbHNlfSkgcHJpdmF0ZSBpbnB1dEVsZW1lbnQ6IGFueTtcblxuICBwdWJsaWMgZm9jdXNJbnB1dDogYm9vbGVhbiA9IGZhbHNlO1xuICBwdWJsaWMgaW5wdXRWYWx1ZTogc3RyaW5nID0gJyc7XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5kYXRhLmF1dG9jb21wbGV0ZSA9IHRoaXMuZGF0YS5hdXRvY29tcGxldGUgPyB0aGlzLmRhdGEuYXV0b2NvbXBsZXRlIDogXCJvZmZcIjtcbiAgICB0aGlzLmRhdGEuY3VycmVudExhbmcgPSB0aGlzLmRhdGEuY3VycmVudExhbmcgPyB0aGlzLmRhdGEuY3VycmVudExhbmcgOiBcImVuXCI7XG4gICAgdGhpcy5kYXRhLnBsYWNlaG9sZGVyVHlwZSA9IHRoaXMuZGF0YS5wbGFjZWhvbGRlclR5cGUgPyB0aGlzLmRhdGEucGxhY2Vob2xkZXJUeXBlIDogXCJkZWZhdWx0XCI7XG4gICAgdGhpcy5kYXRhLnJlcXVpcmVkID0gdGhpcy5kYXRhLnJlcXVpcmVkID8gdGhpcy5kYXRhLnJlcXVpcmVkIDogZmFsc2U7XG4gICAgdGhpcy5kYXRhLnN0YXRlID0gdGhpcy5kYXRhLnN0YXRlID8gdGhpcy5kYXRhLnN0YXRlIDogXCJlbmFibGVkXCI7XG4gICAgdGhpcy5kYXRhLnR5cGUgPSB0aGlzLmRhdGEudHlwZSA/IHRoaXMuZGF0YS50eXBlIDogXCJ0ZXh0XCI7XG5cbiAgICBpZiAodGhpcy5kYXRhLnN1cHBvcnRUZXh0KSB7XG4gICAgICB0aGlzLmRhdGEuc3VwcG9ydFRleHQudHlwZSA9IHRoaXMuZGF0YS5zdXBwb3J0VGV4dC50eXBlID8gdGhpcy5kYXRhLnN1cHBvcnRUZXh0LnR5cGUgOiBcIm5ldXRyb1wiO1xuICAgIH1cblxuICAgIGlmICh0aGlzLmRhdGEuaWNvbikge1xuICAgICAgdGhpcy5kYXRhLmljb24ucGxhY2VtZW50ID0gdGhpcy5kYXRhLmljb24ucGxhY2VtZW50ID8gdGhpcy5kYXRhLmljb24ucGxhY2VtZW50IDogJ2xlZnQnO1xuICAgIH1cbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmNoYW5nZUlucHV0VmFsdWUoKTtcbiAgfVxuXG4gIHByaXZhdGUgcmVhZG9ubHkgcGxhY2Vob2xkZXJzID0ge1xuICAgICdlbWFpbCc6ICd0ZXN0QGVtYWlsLmNvbScsXG4gICAgJ3VybCc6ICdodHRwczovL3d3dy50ZXN0LmNvbSdcbiAgfVxuXG4gIHB1YmxpYyBnZXRQbGFjZWhvbGRlcigpOiBzdHJpbmcge1xuICAgIGlmICh0aGlzLmRhdGEuY3VzdG9tUGxhY2Vob2xkZXIgJiYgdGhpcy5kYXRhLmN1c3RvbVBsYWNlaG9sZGVyICE9ICcnKSB7XG4gICAgICByZXR1cm4gdGhpcy5kYXRhLmN1c3RvbVBsYWNlaG9sZGVyO1xuICAgIH0gZWxzZSB7XG4gICAgICBpZiAodGhpcy5kYXRhLnBsYWNlaG9sZGVyVHlwZSA9PSAnZGVmYXVsdCcpIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuZGF0YS5sYWJlbDtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHJldHVybiB0aGlzLnBsYWNlaG9sZGVyc1t0aGlzLmRhdGEucGxhY2Vob2xkZXJUeXBlXTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBwdWJsaWMgY2hhbmdlSW5wdXRWYWx1ZSgpOiB2b2lkIHtcbiAgICB0aGlzLmlucHV0VmFsdWUgPSB0aGlzLmlucHV0RWxlbWVudC5uYXRpdmVFbGVtZW50LnZhbHVlO1xuICAgIHRoaXMudGV4dEZpZWxkVmFsdWVSZXNwb25zZS5lbWl0KHRoaXMuaW5wdXRWYWx1ZSk7XG4gIH1cblxuICBwdWJsaWMgY2xlYXJJbnB1dCgpOiB2b2lkIHtcbiAgICB0aGlzLmlucHV0VmFsdWUgPSBudWxsO1xuICAgIHRoaXMudGV4dEZpZWxkVmFsdWVSZXNwb25zZS5lbWl0KHRoaXMuaW5wdXRWYWx1ZSk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJncmF2aXR5LXRleHQtZmllbGRcIj5cbiAgPGxhYmVsIGNsYXNzPVwiaHItYm9keS10ZXh0IG1kLXJlZ3VsYXIge3tkYXRhLnN0YXRlfX1cIiBbY2xhc3MuZW1wdHldPVwiaW5wdXRWYWx1ZSA9PSAnJyAmJiAhZm9jdXNJbnB1dFwiXG4gICAgICAgICBbY2xhc3MuZm9jdXNlZF09XCJmb2N1c0lucHV0XCIgW2NsYXNzLmZ1bGxdPVwiaW5wdXRWYWx1ZSAhPSAnJyAmJiAhZm9jdXNJbnB1dFwiPlxuICAgIHt7ZGF0YS5sYWJlbH19XG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRhdGEucmVxdWlyZWRcIj5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmN1cnJlbnRMYW5nID09ICdlcydcIj4tIFJlcXVlcmlkbyA8c3BhbiBjbGFzcz1cInRleHQtbmVnYXRpdmVcIj4qPC9zcGFuPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRhdGEuY3VycmVudExhbmcgPT0gJ2VuJ1wiPi0gUmVxdWlyZWQgPHNwYW4gY2xhc3M9XCJ0ZXh0LW5lZ2F0aXZlXCI+Kjwvc3Bhbj48L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5zdGF0ZSA9PSAncmVhZG9ubHknXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5jdXJyZW50TGFuZyA9PSAnZXMnXCI+LSBTw7NsbyBsZWN0dXJhPC9uZy1jb250YWluZXI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZGF0YS5jdXJyZW50TGFuZyA9PSAnZW4nXCI+LSBSZWFkb25seTwvbmctY29udGFpbmVyPlxuICAgIDwvbmctY29udGFpbmVyPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLnN0YXRlID09ICdkaXNhYmxlZCdcIj5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmN1cnJlbnRMYW5nID09ICdlcydcIj4tIERlc2hhYmlsaXRhZG88L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmN1cnJlbnRMYW5nID09ICdlbidcIj4tIERpc2FibGVkPC9uZy1jb250YWluZXI+XG4gICAgPC9uZy1jb250YWluZXI+XG4gIDwvbGFiZWw+XG4gIDxkaXYgY2xhc3M9XCJpbnB1dC1maWVsZCB7e2RhdGEuc3RhdGV9fVwiIFtjbGFzcy5lbXB0eV09XCJpbnB1dFZhbHVlID09ICcnICYmICFmb2N1c0lucHV0XCIgW2NsYXNzLmZvY3VzZWRdPVwiZm9jdXNJbnB1dFwiXG4gICAgICAgW2NsYXNzLmZ1bGxdPVwiaW5wdXRWYWx1ZSAhPSAnJyAmJiAhZm9jdXNJbnB1dFwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmljb24/LnBsYWNlbWVudCA9PSAnbGVmdCdcIj5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJpY29uc1wiPjwvbmctY29udGFpbmVyPlxuICAgIDwvbmctY29udGFpbmVyPlxuICAgIDxpbnB1dCBbYXR0ci5kYXRhLWN5XT1cImRhdGEuY3lwcmVzc1RhZ1wiXG4gICAgICAgICAgIFthdHRyLmRpc2FibGVkXT1cImRhdGEuc3RhdGUgPT0gJ2Rpc2FibGVkJyA/IHRydWUgOiBudWxsXCJcbiAgICAgICAgICAgW2F0dHIucmVhZG9ubHldPVwiZGF0YS5zdGF0ZSA9PSAncmVhZG9ubHknID8gdHJ1ZSA6IG51bGxcIlxuICAgICAgICAgICBbYXR0ci52YWx1ZV09XCJkYXRhLmN1c3RvbUlucHV0VmFsdWUgPyBkYXRhLmN1c3RvbUlucHV0VmFsdWUgOiBudWxsXCJcbiAgICAgICAgICAgW2F1dG9jb21wbGV0ZV09XCJkYXRhLmF1dG9jb21wbGV0ZVwiXG4gICAgICAgICAgIFtuZ01vZGVsXT1cImRhdGEubmdNb2RlbCA/IGRhdGEubmdNb2RlbCA6IG51bGxcIlxuICAgICAgICAgICBbcGxhY2Vob2xkZXJdPVwiZ2V0UGxhY2Vob2xkZXIoKVwiXG4gICAgICAgICAgIFt0eXBlXT1cImRhdGEudHlwZVwiXG5cbiAgICAgICAgICAgKGJsdXIpPVwiZm9jdXNJbnB1dCA9IGZhbHNlXCJcbiAgICAgICAgICAgKGZvY3VzKT1cImZvY3VzSW5wdXQgPSB0cnVlXCJcbiAgICAgICAgICAgKGtleXVwKT1cImNoYW5nZUlucHV0VmFsdWUoKVwiXG5cbiAgICAgICAgICAgY2xhc3M9XCJoci1sYWJlbCBtZC1yZWd1bGFyXCJcblxuICAgICAgICAgICAjaW5wdXRFbGVtZW50PlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJkYXRhLmljb24/LnBsYWNlbWVudCA9PSAncmlnaHQnXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiaWNvbnNcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgPC9kaXY+XG4gIDxwIGNsYXNzPVwiaHItYm9keS10ZXh0IHNtLXJlZ3VsYXIgc3VwcG9ydC10ZXh0IHRleHQte3tkYXRhLnN1cHBvcnRUZXh0LnR5cGV9fVwiICpuZ0lmPVwiZGF0YS5zdXBwb3J0VGV4dFwiPlxuICAgIHt7ZGF0YS5zdXBwb3J0VGV4dC5jb250ZW50fX1cbiAgPC9wPlxuPC9kaXY+XG5cbjxuZy10ZW1wbGF0ZSAjaWNvbnM+XG4gIDxzdmctaWNvbiBjbGFzcz1cInBsYWNlbWVudC17e2RhdGEuaWNvbi5wbGFjZW1lbnR9fVwiIFtuYW1lXT1cImljb25OYW1lXCJcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBpY29uTmFtZSBvZiBkYXRhLmljb24ubmFtZXNcIj48L3N2Zy1pY29uPlxuPC9uZy10ZW1wbGF0ZT5cbiJdfQ==

package/fesm2015/progressio_resources-gravity-design-system.mjs CHANGED Viewed

@@ -115,12 +115,16 @@ class GravityTextFieldComponent {
         this.inputValue = this.inputElement.nativeElement.value;
         this.textFieldValueResponse.emit(this.inputValue);
     }
+    clearInput() {
+        this.inputValue = null;
+        this.textFieldValueResponse.emit(this.inputValue);
+    }
 }
 GravityTextFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GravityTextFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-GravityTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: GravityTextFieldComponent, selector: "gravity-text-field", inputs: { data: "data" }, outputs: { textFieldValueResponse: "textFieldValueResponse" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"], dependencies: [{ kind: "component", type: i1.SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+GravityTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: GravityTextFieldComponent, selector: "gravity-text-field", inputs: { data: "data" }, outputs: { textFieldValueResponse: "textFieldValueResponse" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [ngModel]=\"data.ngModel ? data.ngModel : null\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"], dependencies: [{ kind: "component", type: i1.SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GravityTextFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-text-field', template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"] }]
+            args: [{ selector: 'gravity-text-field', template: "<div class=\"gravity-text-field\">\n  <label class=\"hr-body-text md-regular {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\"\n         [class.focused]=\"focusInput\" [class.full]=\"inputValue != '' && !focusInput\">\n    {{data.label}}\n    <ng-container *ngIf=\"data.required\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'readonly'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Readonly</ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"data.state == 'disabled'\">\n      <ng-container *ngIf=\"data.currentLang == 'es'\">- Deshabilitado</ng-container>\n      <ng-container *ngIf=\"data.currentLang == 'en'\">- Disabled</ng-container>\n    </ng-container>\n  </label>\n  <div class=\"input-field {{data.state}}\" [class.empty]=\"inputValue == '' && !focusInput\" [class.focused]=\"focusInput\"\n       [class.full]=\"inputValue != '' && !focusInput\">\n    <ng-container *ngIf=\"data.icon?.placement == 'left'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n    <input [attr.data-cy]=\"data.cypressTag\"\n           [attr.disabled]=\"data.state == 'disabled' ? true : null\"\n           [attr.readonly]=\"data.state == 'readonly' ? true : null\"\n           [attr.value]=\"data.customInputValue ? data.customInputValue : null\"\n           [autocomplete]=\"data.autocomplete\"\n           [ngModel]=\"data.ngModel ? data.ngModel : null\"\n           [placeholder]=\"getPlaceholder()\"\n           [type]=\"data.type\"\n\n           (blur)=\"focusInput = false\"\n           (focus)=\"focusInput = true\"\n           (keyup)=\"changeInputValue()\"\n\n           class=\"hr-label md-regular\"\n\n           #inputElement>\n    <ng-container *ngIf=\"data.icon?.placement == 'right'\">\n      <ng-container *ngTemplateOutlet=\"icons\"></ng-container>\n    </ng-container>\n  </div>\n  <p class=\"hr-body-text sm-regular support-text text-{{data.supportText.type}}\" *ngIf=\"data.supportText\">\n    {{data.supportText.content}}\n  </p>\n</div>\n\n<ng-template #icons>\n  <svg-icon class=\"placement-{{data.icon.placement}}\" [name]=\"iconName\"\n            *ngFor=\"let iconName of data.icon.names\"></svg-icon>\n</ng-template>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-input-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;max-height:3rem;min-height:1.5rem;padding:.625rem 1rem}.gravity-input-field svg-icon{height:1rem;line-height:0;width:1rem}.gravity-input-field svg-icon.placement-left{margin-right:.5rem}.gravity-input-field svg-icon.placement-right{margin-left:.5rem}.gravity-input-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-input-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-input-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-input-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-input-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.empty.disabled svg-icon ::ng-deep svg{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-input-field.full.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-input-field.full.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-input-field.full.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-input-field.full.disabled svg-icon ::ng-deep svg{--icon-color: var(--input-text-full-disabled-primary)}.gravity-input-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-input-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"] }]
         }], propDecorators: { textFieldValueResponse: [{
                 type: Output
             }], data: [{