ng-components-tsi 0.0.16 → 0.0.17

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.
@@ -886,9 +886,10 @@ class DobleInputComponent {
886
886
  typeKey = input('number');
887
887
  withAdicionalInfo = input(false);
888
888
  validaLista = input(false);
889
- get joinInfoReal() {
890
- const isSmallScreen = window.innerWidth < 443;
891
- return isSmallScreen ? true : this.joinInfo();
889
+ isSmallScreen = signal(false);
890
+ joinInfoReal = computed(() => this.isSmallScreen() ? true : this.joinInfo());
891
+ onResize() {
892
+ this.isSmallScreen.set(window.innerWidth < 443);
892
893
  }
893
894
  constructor() {
894
895
  effect(() => {
@@ -940,12 +941,15 @@ class DobleInputComponent {
940
941
  this.value.set(firstItem ? firstItem[this.keyCodigo()] : null);
941
942
  }
942
943
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DobleInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
943
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DobleInputComponent, isStandalone: true, selector: "app-doble-input", inputs: { wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, withBuscar: { classPropertyName: "withBuscar", publicName: "withBuscar", isSignal: true, isRequired: false, transformFunction: null }, withBuscar2: { classPropertyName: "withBuscar2", publicName: "withBuscar2", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, tipoInput2: { classPropertyName: "tipoInput2", publicName: "tipoInput2", isSignal: true, isRequired: false, transformFunction: null }, lista: { classPropertyName: "lista", publicName: "lista", isSignal: true, isRequired: false, transformFunction: null }, keyCodigo: { classPropertyName: "keyCodigo", publicName: "keyCodigo", isSignal: true, isRequired: false, transformFunction: null }, keyDescri: { classPropertyName: "keyDescri", publicName: "keyDescri", isSignal: true, isRequired: false, transformFunction: null }, joinInfo: { classPropertyName: "joinInfo", publicName: "joinInfo", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, withTodos: { classPropertyName: "withTodos", publicName: "withTodos", isSignal: true, isRequired: false, transformFunction: null }, firstItemDefault: { classPropertyName: "firstItemDefault", publicName: "firstItemDefault", isSignal: true, isRequired: false, transformFunction: null }, disabled1: { classPropertyName: "disabled1", publicName: "disabled1", isSignal: true, isRequired: false, transformFunction: null }, disabled2: { classPropertyName: "disabled2", publicName: "disabled2", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, value2: { classPropertyName: "value2", publicName: "value2", isSignal: true, isRequired: false, transformFunction: null }, activeFocus: { classPropertyName: "activeFocus", publicName: "activeFocus", isSignal: true, isRequired: false, transformFunction: null }, customBorderColor: { classPropertyName: "customBorderColor", publicName: "customBorderColor", isSignal: true, isRequired: false, transformFunction: null }, customBoxShadow: { classPropertyName: "customBoxShadow", publicName: "customBoxShadow", isSignal: true, isRequired: false, transformFunction: null }, customTransition: { classPropertyName: "customTransition", publicName: "customTransition", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, listName: { classPropertyName: "listName", publicName: "listName", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalidInput", isSignal: true, isRequired: false, transformFunction: null }, blur1: { classPropertyName: "blur1", publicName: "blur1", isSignal: true, isRequired: false, transformFunction: null }, enter1: { classPropertyName: "enter1", publicName: "enter1", isSignal: true, isRequired: false, transformFunction: null }, blur2: { classPropertyName: "blur2", publicName: "blur2", isSignal: true, isRequired: false, transformFunction: null }, enter2: { classPropertyName: "enter2", publicName: "enter2", isSignal: true, isRequired: false, transformFunction: null }, typeKey: { classPropertyName: "typeKey", publicName: "typeKey", isSignal: true, isRequired: false, transformFunction: null }, withAdicionalInfo: { classPropertyName: "withAdicionalInfo", publicName: "withAdicionalInfo", isSignal: true, isRequired: false, transformFunction: null }, validaLista: { classPropertyName: "validaLista", publicName: "validaLista", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled1: "disabled1Change", disabled2: "disabled2Change", value: "valueChange", value2: "value2Change", changeInput: "changeInput", invalidInput: "invalidInputChange", accion1: "accion1", accion2: "accion2" }, ngImport: i0, template: "@if (isVertical()) {\r\n<label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-center\">\r\n @if (!isVertical()) {\r\n <label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"content-1 me-1\">\r\n <input type=\"text\" class=\"form-control show-input\"\r\n (blur)=\"blur1()?.(); validaItem()\" (keyup.enter)=\"enter1()?.()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled1()\" [(ngModel)]=\"value\"\r\n id=\"{{'id_' + label()}}\" name=\"{{'id_' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion1.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n }\r\n </div>\r\n\r\n <div class=\"w-100\">\r\n <div class=\"content-2 position-relative me-2\">\r\n @if (tipoInput2() == 2) {\r\n <select class=\"form-select\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [(ngModel)]=\"value\" [disabled]=\"disabled2()\"\r\n id=\"{{'id_content' + label()}}\" name=\"{{'id_content' + label()}}\" (change)=\"emitirChange()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfoReal ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n </select>\r\n }\r\n @if (tipoInput2() == 1) {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"blur2()?.()\" (keyup.enter)=\"enter2()?.()\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled2()\" id=\"{{'id_content' + label()}}\"\r\n [(ngModel)]=\"value2\"\r\n name=\"{{'id_content' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n @if (withBuscar2()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion2.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n } \r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n \r\n</div>", styles: [".content-1{flex-basis:30%;display:flex;align-items:center}.content-2{flex-basis:70%;display:flex;align-items:center}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}}.show-input{display:none}@media (min-width: 443px){.show-input{display:block}}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.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: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [fadeInOut] });
944
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DobleInputComponent, isStandalone: true, selector: "app-doble-input", inputs: { wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, withBuscar: { classPropertyName: "withBuscar", publicName: "withBuscar", isSignal: true, isRequired: false, transformFunction: null }, withBuscar2: { classPropertyName: "withBuscar2", publicName: "withBuscar2", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, tipoInput2: { classPropertyName: "tipoInput2", publicName: "tipoInput2", isSignal: true, isRequired: false, transformFunction: null }, lista: { classPropertyName: "lista", publicName: "lista", isSignal: true, isRequired: false, transformFunction: null }, keyCodigo: { classPropertyName: "keyCodigo", publicName: "keyCodigo", isSignal: true, isRequired: false, transformFunction: null }, keyDescri: { classPropertyName: "keyDescri", publicName: "keyDescri", isSignal: true, isRequired: false, transformFunction: null }, joinInfo: { classPropertyName: "joinInfo", publicName: "joinInfo", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, withTodos: { classPropertyName: "withTodos", publicName: "withTodos", isSignal: true, isRequired: false, transformFunction: null }, firstItemDefault: { classPropertyName: "firstItemDefault", publicName: "firstItemDefault", isSignal: true, isRequired: false, transformFunction: null }, disabled1: { classPropertyName: "disabled1", publicName: "disabled1", isSignal: true, isRequired: false, transformFunction: null }, disabled2: { classPropertyName: "disabled2", publicName: "disabled2", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, value2: { classPropertyName: "value2", publicName: "value2", isSignal: true, isRequired: false, transformFunction: null }, activeFocus: { classPropertyName: "activeFocus", publicName: "activeFocus", isSignal: true, isRequired: false, transformFunction: null }, customBorderColor: { classPropertyName: "customBorderColor", publicName: "customBorderColor", isSignal: true, isRequired: false, transformFunction: null }, customBoxShadow: { classPropertyName: "customBoxShadow", publicName: "customBoxShadow", isSignal: true, isRequired: false, transformFunction: null }, customTransition: { classPropertyName: "customTransition", publicName: "customTransition", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, listName: { classPropertyName: "listName", publicName: "listName", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalidInput", isSignal: true, isRequired: false, transformFunction: null }, blur1: { classPropertyName: "blur1", publicName: "blur1", isSignal: true, isRequired: false, transformFunction: null }, enter1: { classPropertyName: "enter1", publicName: "enter1", isSignal: true, isRequired: false, transformFunction: null }, blur2: { classPropertyName: "blur2", publicName: "blur2", isSignal: true, isRequired: false, transformFunction: null }, enter2: { classPropertyName: "enter2", publicName: "enter2", isSignal: true, isRequired: false, transformFunction: null }, typeKey: { classPropertyName: "typeKey", publicName: "typeKey", isSignal: true, isRequired: false, transformFunction: null }, withAdicionalInfo: { classPropertyName: "withAdicionalInfo", publicName: "withAdicionalInfo", isSignal: true, isRequired: false, transformFunction: null }, validaLista: { classPropertyName: "validaLista", publicName: "validaLista", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled1: "disabled1Change", disabled2: "disabled2Change", value: "valueChange", value2: "value2Change", changeInput: "changeInput", invalidInput: "invalidInputChange", accion1: "accion1", accion2: "accion2" }, host: { listeners: { "window:resize": "onResize()" } }, ngImport: i0, template: "@if (isVertical()) {\r\n<label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-center\">\r\n @if (!isVertical()) {\r\n <label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"content-1 me-1\">\r\n <input type=\"text\" class=\"form-control show-input\"\r\n (blur)=\"blur1()?.(); validaItem()\" (keyup.enter)=\"enter1()?.()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled1()\" [(ngModel)]=\"value\"\r\n id=\"{{'id_' + label()}}\" name=\"{{'id_' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion1.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n }\r\n </div>\r\n\r\n <div class=\"w-100\">\r\n <div class=\"content-2 position-relative me-2\">\r\n @if (tipoInput2() == 2) {\r\n <select class=\"form-select\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [(ngModel)]=\"value\" [disabled]=\"disabled2()\"\r\n id=\"{{'id_content' + label()}}\" name=\"{{'id_content' + label()}}\" (change)=\"emitirChange()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfoReal() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n </select>\r\n }\r\n @if (tipoInput2() == 1) {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"blur2()?.()\" (keyup.enter)=\"enter2()?.()\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled2()\" id=\"{{'id_content' + label()}}\"\r\n [(ngModel)]=\"value2\"\r\n name=\"{{'id_content' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n @if (withBuscar2()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion2.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n } \r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n \r\n</div>", styles: [".content-1{flex-basis:30%;display:flex;align-items:center}.content-2{flex-basis:70%;display:flex;align-items:center}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}}.show-input{display:none}@media (min-width: 443px){.show-input{display:block}}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.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: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [fadeInOut] });
944
945
  }
945
946
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DobleInputComponent, decorators: [{
946
947
  type: Component,
947
- args: [{ selector: 'app-doble-input', imports: [FormsModule], animations: [fadeInOut], template: "@if (isVertical()) {\r\n<label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-center\">\r\n @if (!isVertical()) {\r\n <label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"content-1 me-1\">\r\n <input type=\"text\" class=\"form-control show-input\"\r\n (blur)=\"blur1()?.(); validaItem()\" (keyup.enter)=\"enter1()?.()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled1()\" [(ngModel)]=\"value\"\r\n id=\"{{'id_' + label()}}\" name=\"{{'id_' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion1.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n }\r\n </div>\r\n\r\n <div class=\"w-100\">\r\n <div class=\"content-2 position-relative me-2\">\r\n @if (tipoInput2() == 2) {\r\n <select class=\"form-select\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [(ngModel)]=\"value\" [disabled]=\"disabled2()\"\r\n id=\"{{'id_content' + label()}}\" name=\"{{'id_content' + label()}}\" (change)=\"emitirChange()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfoReal ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n </select>\r\n }\r\n @if (tipoInput2() == 1) {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"blur2()?.()\" (keyup.enter)=\"enter2()?.()\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled2()\" id=\"{{'id_content' + label()}}\"\r\n [(ngModel)]=\"value2\"\r\n name=\"{{'id_content' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n @if (withBuscar2()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion2.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n } \r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n \r\n</div>", styles: [".content-1{flex-basis:30%;display:flex;align-items:center}.content-2{flex-basis:70%;display:flex;align-items:center}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}}.show-input{display:none}@media (min-width: 443px){.show-input{display:block}}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}\n"] }]
948
- }], ctorParameters: () => [] });
948
+ args: [{ selector: 'app-doble-input', imports: [FormsModule], animations: [fadeInOut], template: "@if (isVertical()) {\r\n<label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-center\">\r\n @if (!isVertical()) {\r\n <label for=\"{{'id_' + label()}}\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"content-1 me-1\">\r\n <input type=\"text\" class=\"form-control show-input\"\r\n (blur)=\"blur1()?.(); validaItem()\" (keyup.enter)=\"enter1()?.()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled1()\" [(ngModel)]=\"value\"\r\n id=\"{{'id_' + label()}}\" name=\"{{'id_' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion1.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n }\r\n </div>\r\n\r\n <div class=\"w-100\">\r\n <div class=\"content-2 position-relative me-2\">\r\n @if (tipoInput2() == 2) {\r\n <select class=\"form-select\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [(ngModel)]=\"value\" [disabled]=\"disabled2()\"\r\n id=\"{{'id_content' + label()}}\" name=\"{{'id_content' + label()}}\" (change)=\"emitirChange()\" (focus)=\"invalidInput.set(false)\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfoReal() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n </select>\r\n }\r\n @if (tipoInput2() == 1) {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"blur2()?.()\" (keyup.enter)=\"enter2()?.()\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [disabled]=\"disabled2()\" id=\"{{'id_content' + label()}}\"\r\n [(ngModel)]=\"value2\"\r\n name=\"{{'id_content' + label()}}\" [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n @if (withBuscar2()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" (click)=\"accion2.emit()\">\r\n <i class=\"fa fa-search\"></i>\r\n </button>\r\n } \r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n \r\n</div>", styles: [".content-1{flex-basis:30%;display:flex;align-items:center}.content-2{flex-basis:70%;display:flex;align-items:center}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}}.show-input{display:none}@media (min-width: 443px){.show-input{display:block}}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}\n"] }]
949
+ }], ctorParameters: () => [], propDecorators: { onResize: [{
950
+ type: HostListener,
951
+ args: ['window:resize']
952
+ }] } });
949
953
 
950
954
  class DecimalDirective {
951
955
  appDecimal = input('1.2-2');