ng-components-tsi 0.0.45 → 0.0.46
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.
- package/fesm2022/ng-components-tsi.mjs +8 -2
- package/fesm2022/ng-components-tsi.mjs.map +1 -1
- package/lib/modals/general/md-generico/md-generico.component.d.ts +2 -2
- package/lib/ui/forms/inputs/autocomplete-cdk/autocomplete.component.d.ts +1 -1
- package/lib/ui/forms/inputs/check-box/check-box.component.d.ts +1 -1
- package/lib/ui/forms/inputs/input/input.component.d.ts +2 -2
- package/lib/ui/forms/inputs/input-radio/input-radio.component.d.ts +1 -1
- package/lib/ui/forms/inputs/multiselected/multiselected.component.d.ts +1 -1
- package/lib/ui/forms/lists/list-option/list-option.component.d.ts +1 -1
- package/lib/ui/forms/lists/list-situaciones/list-situaciones.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -1464,11 +1464,11 @@ class InputComponent {
|
|
|
1464
1464
|
this.changeInput.emit(encontrar);
|
|
1465
1465
|
}
|
|
1466
1466
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1467
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputComponent, isStandalone: true, selector: "app-input", inputs: { wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, withBuscar: { classPropertyName: "withBuscar", publicName: "withBuscar", isSignal: true, isRequired: false, transformFunction: null }, iconButton: { classPropertyName: "iconButton", publicName: "iconButton", isSignal: true, isRequired: false, transformFunction: null }, classButton: { classPropertyName: "classButton", publicName: "classButton", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", 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 }, position_row: { classPropertyName: "position_row", publicName: "position_row", isSignal: true, isRequired: false, transformFunction: null }, withChangeInput: { classPropertyName: "withChangeInput", publicName: "withChangeInput", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isImportant: { classPropertyName: "isImportant", publicName: "isImportant", 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 }, withTodos: { classPropertyName: "withTodos", publicName: "withTodos", isSignal: true, isRequired: false, transformFunction: null }, allDisabled: { classPropertyName: "allDisabled", publicName: "allDisabled", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, alto: { classPropertyName: "alto", publicName: "alto", isSignal: true, isRequired: false, transformFunction: null }, formatNumber: { classPropertyName: "formatNumber", publicName: "formatNumber", isSignal: true, isRequired: false, transformFunction: null }, blur: { classPropertyName: "blur", publicName: "blur", isSignal: true, isRequired: false, transformFunction: null }, enter: { classPropertyName: "enter", publicName: "enter", isSignal: true, isRequired: false, transformFunction: null }, keyup: { classPropertyName: "keyup", publicName: "keyup", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalidInput", 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 }, textoAyuda: { classPropertyName: "textoAyuda", publicName: "textoAyuda", isSignal: true, isRequired: false, transformFunction: null }, sinAyuda: { classPropertyName: "sinAyuda", publicName: "sinAyuda", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, showTopLabel: { classPropertyName: "showTopLabel", publicName: "showTopLabel", isSignal: true, isRequired: false, transformFunction: null }, topLabelText: { classPropertyName: "topLabelText", publicName: "topLabelText", isSignal: true, isRequired: false, transformFunction: null }, firstItemDefault: { classPropertyName: "firstItemDefault", publicName: "firstItemDefault", isSignal: true, isRequired: false, transformFunction: null }, typeKey: { classPropertyName: "typeKey", publicName: "typeKey", isSignal: true, isRequired: false, transformFunction: null }, validaCodigo: { classPropertyName: "validaCodigo", publicName: "validaCodigo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", value2: "value2Change", disabled: "disabledChange", allDisabled: "allDisabledChange", invalidInput: "invalidInputChange", accion: "accion", changeInput: "changeInput" }, ngImport: i0, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [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-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date','d-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"ejecutarAccion()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\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()\" [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\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 @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></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</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@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}}.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))}.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}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\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"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: DecimalDirective, selector: "[appDecimal]", inputs: ["appDecimal"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]" }, { kind: "directive", type: OnlyDayDirective, selector: "[onlyDay]" }, { kind: "component", type: SwitchActivoComponent, selector: "app-switch-activo", inputs: ["valueOn", "valueOff", "labelOn", "labelOff", "iconOn", "iconOff", "colorOn", "colorOff", "id", "model"], outputs: ["modelChange"] }, { kind: "directive", type: OnlyNumberFlexDirective, selector: "[onlyNumberFlex]" }, { kind: "directive", type: CaracteresCodigoDirective, selector: "[caracteresCodigo]", inputs: ["caracteresCodigo"] }], animations: [fadeInOut], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1467
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputComponent, isStandalone: true, selector: "app-input", inputs: { wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, withBuscar: { classPropertyName: "withBuscar", publicName: "withBuscar", isSignal: true, isRequired: false, transformFunction: null }, iconButton: { classPropertyName: "iconButton", publicName: "iconButton", isSignal: true, isRequired: false, transformFunction: null }, classButton: { classPropertyName: "classButton", publicName: "classButton", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", 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 }, position_row: { classPropertyName: "position_row", publicName: "position_row", isSignal: true, isRequired: false, transformFunction: null }, withChangeInput: { classPropertyName: "withChangeInput", publicName: "withChangeInput", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isImportant: { classPropertyName: "isImportant", publicName: "isImportant", 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 }, withTodos: { classPropertyName: "withTodos", publicName: "withTodos", isSignal: true, isRequired: false, transformFunction: null }, allDisabled: { classPropertyName: "allDisabled", publicName: "allDisabled", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, alto: { classPropertyName: "alto", publicName: "alto", isSignal: true, isRequired: false, transformFunction: null }, formatNumber: { classPropertyName: "formatNumber", publicName: "formatNumber", isSignal: true, isRequired: false, transformFunction: null }, blur: { classPropertyName: "blur", publicName: "blur", isSignal: true, isRequired: false, transformFunction: null }, enter: { classPropertyName: "enter", publicName: "enter", isSignal: true, isRequired: false, transformFunction: null }, keyup: { classPropertyName: "keyup", publicName: "keyup", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalidInput", 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 }, textoAyuda: { classPropertyName: "textoAyuda", publicName: "textoAyuda", isSignal: true, isRequired: false, transformFunction: null }, sinAyuda: { classPropertyName: "sinAyuda", publicName: "sinAyuda", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, showTopLabel: { classPropertyName: "showTopLabel", publicName: "showTopLabel", isSignal: true, isRequired: false, transformFunction: null }, topLabelText: { classPropertyName: "topLabelText", publicName: "topLabelText", isSignal: true, isRequired: false, transformFunction: null }, firstItemDefault: { classPropertyName: "firstItemDefault", publicName: "firstItemDefault", isSignal: true, isRequired: false, transformFunction: null }, typeKey: { classPropertyName: "typeKey", publicName: "typeKey", isSignal: true, isRequired: false, transformFunction: null }, validaCodigo: { classPropertyName: "validaCodigo", publicName: "validaCodigo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", value2: "value2Change", disabled: "disabledChange", allDisabled: "allDisabledChange", invalidInput: "invalidInputChange", accion: "accion", changeInput: "changeInput" }, ngImport: i0, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [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-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date','d-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"ejecutarAccion()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\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()\" [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select {{'text-' + position()}}\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\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 @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></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</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@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}}.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))}.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}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\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"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: DecimalDirective, selector: "[appDecimal]", inputs: ["appDecimal"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]" }, { kind: "directive", type: OnlyDayDirective, selector: "[onlyDay]" }, { kind: "component", type: SwitchActivoComponent, selector: "app-switch-activo", inputs: ["valueOn", "valueOff", "labelOn", "labelOff", "iconOn", "iconOff", "colorOn", "colorOff", "id", "model"], outputs: ["modelChange"] }, { kind: "directive", type: OnlyNumberFlexDirective, selector: "[onlyNumberFlex]" }, { kind: "directive", type: CaracteresCodigoDirective, selector: "[caracteresCodigo]", inputs: ["caracteresCodigo"] }], animations: [fadeInOut], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1468
1468
|
}
|
|
1469
1469
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, decorators: [{
|
|
1470
1470
|
type: Component,
|
|
1471
|
-
args: [{ selector: 'app-input', imports: [FormsModule, CommonModule, DecimalDirective, OnlyNumberDirective, OnlyDayDirective, SwitchActivoComponent, OnlyNumberFlexDirective, CaracteresCodigoDirective], animations: [fadeInOut], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [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-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date','d-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"ejecutarAccion()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\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()\" [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\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 @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></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</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@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}}.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))}.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}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\n"] }]
|
|
1471
|
+
args: [{ selector: 'app-input', imports: [FormsModule, CommonModule, DecimalDirective, OnlyNumberDirective, OnlyDayDirective, SwitchActivoComponent, OnlyNumberFlexDirective, CaracteresCodigoDirective], animations: [fadeInOut], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [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-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date','d-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"ejecutarAccion()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\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()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\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()\" [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select {{'text-' + position()}}\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\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 @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></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</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@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}}.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))}.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}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\n"] }]
|
|
1472
1472
|
}], ctorParameters: () => [] });
|
|
1473
1473
|
|
|
1474
1474
|
class InputClaseComponent {
|
|
@@ -2873,6 +2873,8 @@ class TableAdvanceOptimizadaComponent {
|
|
|
2873
2873
|
this.rowEvent.emit({ usecase: 1, data: row });
|
|
2874
2874
|
}
|
|
2875
2875
|
onDoubleClick(row) {
|
|
2876
|
+
if (window.getSelection()?.type === 'Range')
|
|
2877
|
+
return;
|
|
2876
2878
|
this.rowEvent.emit({ usecase: 2, data: row });
|
|
2877
2879
|
}
|
|
2878
2880
|
onRightClick(event, row) {
|
|
@@ -3857,6 +3859,8 @@ class TableUltimateComponent {
|
|
|
3857
3859
|
this.rowEvent.emit({ usecase: TABLE_EVENTS.CLICK, data: row });
|
|
3858
3860
|
}
|
|
3859
3861
|
onDoubleClick(row) {
|
|
3862
|
+
if (window.getSelection()?.type === 'Range')
|
|
3863
|
+
return;
|
|
3860
3864
|
this.rowEvent.emit({ usecase: TABLE_EVENTS.DOUBLE_CLICK, data: row });
|
|
3861
3865
|
}
|
|
3862
3866
|
onRightClick(event, row) {
|
|
@@ -4211,6 +4215,8 @@ class TableAgrupadaComponent {
|
|
|
4211
4215
|
this.rowEvent.emit({ usecase: 1, data: row });
|
|
4212
4216
|
}
|
|
4213
4217
|
onDoubleClick(row) {
|
|
4218
|
+
if (window.getSelection()?.type === 'Range')
|
|
4219
|
+
return;
|
|
4214
4220
|
this.rowEvent.emit({ usecase: 2, data: row });
|
|
4215
4221
|
}
|
|
4216
4222
|
onRightClick(event, row) {
|