ng-components-tsi 0.0.62 → 0.0.64

package/fesm2022/ng-components-tsi.mjs

@@ -1553,15 +1553,16 @@ class InputClaseComponent {
     wlabel = input(350);
     tipoInput = computed(() => this.item() ? this.getClase(this.item()) : '');
     value = model('');
+    disabled = model(false);
     getClase(data) {
         return obtenerTipoClases(data);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputClaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputClaseComponent, isStandalone: true, selector: "app-input-clase", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onBlur: "onBlur", value: "valueChange" }, ngImport: i0, template: "\r\n<div class=\"col-md-8 pt-1\">\r\n    @switch (tipoInput()) {\r\n        @case ('vchar') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"1\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" />\r\n        }\r\n        @case ('vstrg') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"80\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('ventero') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-integer\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vreal') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-format-decimal\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vdate') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vtime') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vglosa') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"text-area\" [alto]=\"5\" [maxLength]=\"500\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('codigo') {\r\n            <app-doble-input [label]=\"title()\" [isRequired]=\"required()\" [tipoInput2]=\"2\" [withTodos]=\"false\" keyCodigo=\"codigo\" keyDescri=\"descri\" [lista]=\"item().codigos\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"></app-doble-input>\r\n        }\r\n    }\r\n    \r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "app-input", inputs: ["wlabel", "label", "placeholder", "withBuscar", "iconButton", "classButton", "isRequired", "type", "position", "value", "value2", "position_row", "withChangeInput", "disabled", "isImportant", "lista", "keyCodigo", "keyDescri", "joinInfo", "withTodos", "allDisabled", "isVertical", "alto", "formatNumber", "blur", "enter", "keyup", "invalidInput", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "textoAyuda", "sinAyuda", "maxWidth", "showTopLabel", "topLabelText", "firstItemDefault", "typeKey", "validaCodigo", "inputErrorFn"], outputs: ["valueChange", "value2Change", "disabledChange", "allDisabledChange", "invalidInputChange", "accion", "changeInput"] }, { kind: "component", type: DobleInputComponent, selector: "app-doble-input", inputs: ["wlabel", "label", "withBuscar", "withBuscar2", "isRequired", "tipoInput2", "lista", "keyCodigo", "keyDescri", "joinInfo", "isVertical", "withTodos", "firstItemDefault", "disabled1", "disabled2", "value", "value2", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "listName", "invalidInput", "blur1", "enter1", "blur2", "enter2", "typeKey", "withAdicionalInfo", "validaLista"], outputs: ["disabled1Change", "disabled2Change", "valueChange", "value2Change", "changeInput", "invalidInputChange", "accion1", "accion2"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputClaseComponent, isStandalone: true, selector: "app-input-clase", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onBlur: "onBlur", value: "valueChange", disabled: "disabledChange" }, ngImport: i0, template: "\r\n<div class=\"col-md-8 pt-1\">\r\n    @switch (tipoInput()) {\r\n        @case ('vchar') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"1\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\" />\r\n        }\r\n        @case ('vstrg') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"80\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('ventero') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-integer\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vreal') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-format-decimal\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vdate') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vtime') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vglosa') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"text-area\" [alto]=\"5\" [maxLength]=\"500\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('codigo') {\r\n            <app-doble-input [label]=\"title()\" [isRequired]=\"required()\" [tipoInput2]=\"2\" [withTodos]=\"false\" keyCodigo=\"codigo\" keyDescri=\"descri\" [lista]=\"item().codigos\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled1)]=\"disabled\" [(disabled2)]=\"disabled\" ></app-doble-input>\r\n        }\r\n    }\r\n    \r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "app-input", inputs: ["wlabel", "label", "placeholder", "withBuscar", "iconButton", "classButton", "isRequired", "type", "position", "value", "value2", "position_row", "withChangeInput", "disabled", "isImportant", "lista", "keyCodigo", "keyDescri", "joinInfo", "withTodos", "allDisabled", "isVertical", "alto", "formatNumber", "blur", "enter", "keyup", "invalidInput", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "textoAyuda", "sinAyuda", "maxWidth", "showTopLabel", "topLabelText", "firstItemDefault", "typeKey", "validaCodigo", "inputErrorFn"], outputs: ["valueChange", "value2Change", "disabledChange", "allDisabledChange", "invalidInputChange", "accion", "changeInput"] }, { kind: "component", type: DobleInputComponent, selector: "app-doble-input", inputs: ["wlabel", "label", "withBuscar", "withBuscar2", "isRequired", "tipoInput2", "lista", "keyCodigo", "keyDescri", "joinInfo", "isVertical", "withTodos", "firstItemDefault", "disabled1", "disabled2", "value", "value2", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "listName", "invalidInput", "blur1", "enter1", "blur2", "enter2", "typeKey", "withAdicionalInfo", "validaLista"], outputs: ["disabled1Change", "disabled2Change", "valueChange", "value2Change", "changeInput", "invalidInputChange", "accion1", "accion2"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputClaseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-input-clase', imports: [InputComponent, DobleInputComponent], template: "\r\n<div class=\"col-md-8 pt-1\">\r\n    @switch (tipoInput()) {\r\n        @case ('vchar') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"1\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" />\r\n        }\r\n        @case ('vstrg') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"80\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('ventero') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-integer\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vreal') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-format-decimal\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vdate') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vtime') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('vglosa') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"text-area\" [alto]=\"5\" [maxLength]=\"500\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n        }\r\n        @case ('codigo') {\r\n            <app-doble-input [label]=\"title()\" [isRequired]=\"required()\" [tipoInput2]=\"2\" [withTodos]=\"false\" keyCodigo=\"codigo\" keyDescri=\"descri\" [lista]=\"item().codigos\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"></app-doble-input>\r\n        }\r\n    }\r\n    \r\n</div>\r\n" }]
+            args: [{ selector: 'app-input-clase', imports: [InputComponent, DobleInputComponent], template: "\r\n<div class=\"col-md-8 pt-1\">\r\n    @switch (tipoInput()) {\r\n        @case ('vchar') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"1\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\" />\r\n        }\r\n        @case ('vstrg') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"80\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('ventero') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-integer\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vreal') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-format-decimal\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vdate') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vtime') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('vglosa') {\r\n            <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"text-area\" [alto]=\"5\" [maxLength]=\"500\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled)]=\"disabled\"/>\r\n        }\r\n        @case ('codigo') {\r\n            <app-doble-input [label]=\"title()\" [isRequired]=\"required()\" [tipoInput2]=\"2\" [withTodos]=\"false\" keyCodigo=\"codigo\" keyDescri=\"descri\" [lista]=\"item().codigos\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" [(disabled1)]=\"disabled\" [(disabled2)]=\"disabled\" ></app-doble-input>\r\n        }\r\n    }\r\n    \r\n</div>\r\n" }]
         }] });
 
 class InputDinamicoComponent {
@@ -3553,6 +3554,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
                 args: ['customActions', { static: false }]
             }] } });
 
+class TsiColumnDefDirective {
+    fieldname = input.required({ alias: 'tsiColumn' });
+    template = inject((TemplateRef));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TsiColumnDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: TsiColumnDefDirective, isStandalone: true, selector: "[tsiColumn]", inputs: { fieldname: { classPropertyName: "fieldname", publicName: "tsiColumn", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TsiColumnDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tsiColumn]',
+                    standalone: true
+                }]
+        }] });
+
 class FormateadorService {
     decimalPipe = inject(DecimalPipe);
     datePipe = inject(DatePipe);
@@ -3627,6 +3642,8 @@ class TableUltimateComponent {
     // @ViewChild('scrollContainer') scrollContainer!: ElementRef<HTMLDivElement>;
     scrollContainer = viewChild('scrollContainer');
     customActions = contentChild('customActions');
+    columnDefs = contentChildren(TsiColumnDefDirective);
+    columnDefMap = computed(() => new Map(this.columnDefs().map(d => [d.fieldname(), d.template])));
     formateador = inject(FormateadorService);
     // ── Inputs ──────────────────────────────────────────────────────────────────
     rows = input([]);
@@ -3644,6 +3661,7 @@ class TableUltimateComponent {
     withTotal = input(false);
     withHeight = input(false);
     withAttachment = input(false);
+    variante = input('standard');
     rendered = input([]);
     dragOverRowId = signal(null); // dropzone para adjuntos
     titleTabla = input('Contrato');
@@ -4007,11 +4025,13 @@ class TableUltimateComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableUltimateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TableUltimateComponent, isStandalone: true, selector: "app-table-ultimate", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, footerRows: { classPropertyName: "footerRows", publicName: "footerRows", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, buffer: { classPropertyName: "buffer", publicName: "buffer", isSignal: true, isRequired: false, transformFunction: null }, altoContainer: { classPropertyName: "altoContainer", publicName: "altoContainer", isSignal: true, isRequired: false, transformFunction: null }, altoContenedor: { classPropertyName: "altoContenedor", publicName: "altoContenedor", isSignal: true, isRequired: false, transformFunction: null }, minAlto: { classPropertyName: "minAlto", publicName: "minAlto", isSignal: true, isRequired: false, transformFunction: null }, identifier: { classPropertyName: "identifier", publicName: "identifier", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, withDetails: { classPropertyName: "withDetails", publicName: "withDetails", isSignal: true, isRequired: false, transformFunction: null }, withCheckbox: { classPropertyName: "withCheckbox", publicName: "withCheckbox", isSignal: true, isRequired: false, transformFunction: null }, withTotal: { classPropertyName: "withTotal", publicName: "withTotal", isSignal: true, isRequired: false, transformFunction: null }, withHeight: { classPropertyName: "withHeight", publicName: "withHeight", isSignal: true, isRequired: false, transformFunction: null }, withAttachment: { classPropertyName: "withAttachment", publicName: "withAttachment", isSignal: true, isRequired: false, transformFunction: null }, rendered: { classPropertyName: "rendered", publicName: "rendered", isSignal: true, isRequired: false, transformFunction: null }, titleTabla: { classPropertyName: "titleTabla", publicName: "titleTabla", isSignal: true, isRequired: false, transformFunction: null }, activeMobileMode: { classPropertyName: "activeMobileMode", publicName: "activeMobileMode", isSignal: true, isRequired: false, transformFunction: null }, selectedRow: { classPropertyName: "selectedRow", publicName: "selectedRow", isSignal: true, isRequired: false, transformFunction: null }, rowClassFn: { classPropertyName: "rowClassFn", publicName: "rowClassFn", isSignal: true, isRequired: false, transformFunction: null }, rowDisabledFn: { classPropertyName: "rowDisabledFn", publicName: "rowDisabledFn", isSignal: true, isRequired: false, transformFunction: null }, selectItems: { classPropertyName: "selectItems", publicName: "selectItems", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowEvent: "rowEvent", selectedRow: "selectedRowChange", selectItems: "selectItemsChange" }, host: { listeners: { "window:resize": "onResize($event)" } }, queries: [{ propertyName: "customActions", first: true, predicate: ["customActions"], descendants: true, isSignal: true }, { propertyName: "contentFilter", first: true, predicate: ["header"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (withFiltro()) {\r\n<div class=\"ll-search-bar\">\r\n\r\n    <div class=\"ll-search-bar__left\">\r\n        <ng-container *ngTemplateOutlet=\"contentFilter();\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"ll-search-bar__right\">\r\n\r\n        <div class=\"ll-search-group\">\r\n\r\n            <label class=\"form-label mb-0 ll-search-label\">Buscar:</label>\r\n            <div class=\"ll-search-input-wrap\">\r\n\r\n                <input type=\"text\" class=\"form-control cw-250\" [value]=\"busqueda()\" (input)=\"textoDigitado($event)\" />\r\n                <app-dropdown-cdk>\r\n                    <ng-template #trigger>\r\n                        <button class=\"btn btn-dark boton-buscar fs-7\">\r\n                            <i class=\"fas fa-cog\"></i>\r\n                        </button>\r\n                    </ng-template>\r\n\r\n                    <ng-template #content>\r\n                        <div class=\"popover-menu-filter bg-white shadow\" @dropdownAnimation>\r\n                            <div class=\"popover-title fs-7 bg-white\">\r\n                                Filtros\r\n                            </div>\r\n\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input class=\"form-check-input py-0 my-0 cw-25 ch-15\" type=\"checkbox\" [checked]=\"true\"\r\n                                    (change)=\"toggleFiltros($event)\" id=\"filter_table_lazy_todos\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 mb-0 cursor-pointer\"\r\n                                    for=\"filter_table_lazy_todos\">\r\n                                    Todos\r\n                                </label>\r\n                            </div>\r\n\r\n                            @for (col of columns(); track col.caption) {\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                    id=\"{{ 'filter_' + col.caption }}\" [(ngModel)]=\"filtrarColumnas()[col.fieldname]\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 cursor-pointer mb-0\"\r\n                                    for=\"{{ 'filter_' + col.caption }}\">\r\n                                    {{ col.caption }}\r\n                                </label>\r\n                            </div>\r\n                            }\r\n                        </div>\r\n                    </ng-template>\r\n                </app-dropdown-cdk>\r\n\r\n            </div>\r\n\r\n        </div>\r\n\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n}\r\n\r\n@if (activeMobileMode()) {\r\n@if (isLoadingResponsive()) {\r\n<div class=\"d-flex flex-column justify-content-center align-items-center py-2\">\r\n    <div class=\"spinner-border text-secondary mb-2\" role=\"status\"></div>\r\n    <span class=\"ms-2 fs-6\">Cargando...</span>\r\n</div>\r\n}\r\n\r\n@if (!isLoadingResponsive()) {\r\n@if (isMobile()) {\r\n<app-card-mobile [data]=\"rowFilter()\" [columns]=\"columns()\" [actions]=\"customActions()\" [identifier]=\"identifier()\"\r\n    [titleTabla]=\"titleTabla()\" [altoContainer]=\"altoContainer()\" />\r\n}\r\n@if (!isMobile()) {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n}\r\n}\r\n@else {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n\r\n<ng-template #table>\r\n    <!-- Contenedor scrolleable \u2014 solo el BODY hace scroll; header y footer son sticky -->\r\n    <div #scrollContainer class=\"ll-scroll-container\" [style.height]=\"withHeight() ? heightStyle() : ''\"\r\n        [style.max-height]=\"heightStyle()\" (scroll)=\"onScroll($event)\">\r\n        <table class=\"ll-table\">\r\n\r\n            <!-- \u2500\u2500 HEADER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <thead class=\"ll-thead\">\r\n                <tr>\r\n                    @if (withDetails()) {\r\n                    <th class=\"cw-25\"></th>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <th class=\"cw-20\">\r\n                        <label>\r\n                            <input type=\"checkbox\" name=\"check_box_select_table_main\" id=\"check_box_select_table_main\"\r\n                                animatedCheckbox [checked]=\"validaAllCheck()\" (change)=\"allCheck($event)\">\r\n                        </label>\r\n                    </th>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <th class=\"cw-40\">\r\n                        <app-dropdown-cdk>\r\n                            <ng-template #trigger>\r\n                                <button class=\"btn p-0 text-dark d-flex mx-auto border-0\">\r\n                                    <i class=\"fas fa-cog\"></i>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #content>\r\n                                <div class=\"popover-menu-column bg-white shadow mt-2\" @dropdownAnimation>\r\n                                    <div class=\"popover-title fs-7 bg-white\">Columnas</div>\r\n                                    @for (col of columns(); track col.caption) {\r\n                                    @if (col.caption) {\r\n                                    <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                        <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                            id=\"{{ 'switch_' + col.caption }}\"\r\n                                            [(ngModel)]=\"visibilidadColumn()[col.fieldname]\" />\r\n                                        <label class=\"form-check-label ps-2 fs-6 cursor-pointer font-label mb-0\"\r\n                                            for=\"{{ 'switch_' + col.caption }}\">\r\n                                            {{ col.caption }}\r\n                                        </label>\r\n                                    </div>\r\n                                    }\r\n                                    }\r\n                                </div>\r\n                            </ng-template>\r\n                        </app-dropdown-cdk>\r\n                    </th>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    <th [title]=\"col.caption\" [style.width.px]=\"col.width || null\"\r\n                        [style.min-width.px]=\"col.width || null\" [style.max-width.px]=\"col.width || null\"\r\n                        class=\"ll-th-sortable\" (click)=\"toggleSort(col.fieldname)\">\r\n                        <span class=\"ll-th-content\">\r\n                            <span class=\"ll-th-caption\">{{ col.caption }}</span>\r\n                            @if (sortField() === col.fieldname) {\r\n                            <i class=\"ms-1\"\r\n                                [ngClass]=\"sortDir() === 'asc' ? 'fas fa-angle-up fs-6':'fas fa-angle-down fs-6'\"></i>\r\n                            } @else {\r\n                            <i class=\"fas fa-sort ms-1 ll-sort-idle\"></i>\r\n                            }\r\n                        </span>\r\n                    </th>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </thead>\r\n\r\n            <!-- \u2500\u2500 BODY virtual \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <tbody>\r\n                <!-- Spacer superior: ocupa el espacio de las filas NO renderizadas arriba -->\r\n                @if (paddingTop() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingTop()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Filas visibles -->\r\n                @for (row of visibleRows(); track row.idListTsi) {\r\n                @let idList = row.idListTsi;\r\n                <tr class=\"ll-row\" [class.ll-row--selected]=\"isSelected(row, idList)\"\r\n                    [class.ll-row--drag-over]=\"withAttachment() && dragOverRowId() === idList\"\r\n                    (click)=\"selectRow(row, idList)\" (dblclick)=\"onDoubleClick(row)\"\r\n                    (contextmenu)=\"onRightClick($event,row)\"\r\n                    (dragover)=\"withAttachment() && onDragOver($event, idList)\"\r\n                    (dragleave)=\"withAttachment() && onDragLeave()\" (drop)=\"withAttachment() && onDrop($event, row)\">\r\n\r\n                    @if (withDetails()) {\r\n                    <td class=\"b-table text-center mwp-25\">\r\n                        <a (click)=\"toggleExpandRow(idList)\" class=\"text-dark cursor-pointer fs-6\">\r\n                            <i class=\"fa-solid\" [class.fa-chevron-right]=\"expandedRows() != idList\"\r\n                                [class.fa-chevron-down]=\"expandedRows() == idList\"></i>\r\n                        </a>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <td scope=\"col\" class=\"text-center b-table\">\r\n                        <label>\r\n                            <input type=\"checkbox\" [name]=\"'check_box_select_table_' + idList\"\r\n                                [id]=\"'check_box_select_table_' + idList\" animatedCheckbox\r\n                                [checked]=\"isItemSelected(idList)\" (click)=\"$event.stopPropagation()\"\r\n                                (change)=\"toogleItem(idList , $event)\" [disabled]=\"isCheckboxDisabled(row)\">\r\n                        </label>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <td class=\"text-center\">\r\n                        <ng-container *ngTemplateOutlet=\"customActions(); context: { $implicit: row }\"></ng-container>\r\n                    </td>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    @if (col.template) {\r\n                    <td>\r\n                        <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row, column: col }\">\r\n                        </ng-container>\r\n                    </td>\r\n                    } @else {\r\n                    @switch (col.tipo) {\r\n\r\n                    @case ('cell-render') {\r\n                    @let resolverItem = resolveCell(col.fieldname, row);\r\n                    @if (resolverItem) {\r\n                    <td [title]=\"resolverItem.text\" [class.text-center]=\"resolverItem.icon\">\r\n                        @if (resolverItem.icon) {\r\n                        <i class=\"fs-5\" [ngClass]=\"resolverItem.icon\"></i>\r\n                        } @else if (resolverItem.class) {\r\n                        <span [ngClass]=\"row.situac == 'J' ? 'text-error' : resolverItem.class\">\r\n                            {{ resolverItem.text }}\r\n                        </span>\r\n                        } @else {\r\n                        {{ resolverItem.text }}\r\n                        }\r\n                    </td>\r\n                    }\r\n                    }\r\n\r\n                    @default {\r\n                    <td [innerHTML]=\"getHighlight(row._format?.[col.fieldname] ?? row[col.fieldname], col.fieldname)\"\r\n                        [style.width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [style.max-width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [attr.title]=\"row[col.fieldname] || null\"\r\n                        [ngClass]=\"rowClassFn() ? rowClassFn()(row) : getRowClass(row)\" class=\"{{getPosition(col)}}\">\r\n                    </td>\r\n                    }\r\n\r\n                    }\r\n                    }\r\n                    }\r\n                    }\r\n                </tr>\r\n\r\n                @if (idList == expandedRows()) {\r\n                <tr @fadeInOut>\r\n                    <td [attr.colspan]=\"columns().length + (withDetails() ? 1 : 0) + (customActions() ? 1 : 0) + (withCheckbox() ? 1 : 0)\"\r\n                        class=\"table-blank\">\r\n                        <div class=\"d-flex flex-column auditoria\">\r\n                            <span class=\"fw-bold fs-7 text-dark\">Datos de auditor\u00EDa</span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Creaci\u00F3n: {{ row.nomucreac }} el {{ row._format?.fcreac ?? row.fcreac }} a las {{\r\n                                row.hcreac }}\r\n                            </span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Actualizaci\u00F3n: {{ row.nomuactua }} el {{ row._format?.factua ?? row.factua }} a las\r\n                                {{\r\n                                row.hactua }}\r\n                            </span>\r\n                        </div>\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                }\r\n\r\n                <!-- Fila vac\u00EDa si no hay datos -->\r\n                @if (rowFilter().length === 0) {\r\n                <tr>\r\n                    <td [attr.colspan]=\"columns().length\" class=\"ll-empty\">\r\n                        Sin datos\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Spacer inferior: ocupa el espacio de las filas NO renderizadas abajo -->\r\n                @if (paddingBottom() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingBottom()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n            </tbody>\r\n\r\n            <!-- \u2500\u2500 FOOTER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            @if (withTotal() && rowFilter().length > 0) {\r\n            <tfoot class=\"ll-tfoot\">\r\n\r\n                <tr>\r\n                    <td [attr.colspan]=\"getColspanBeforeTotals()\" class=\"fw-5 fs-6 ps-2 py-2\">Totales:</td>\r\n                    @for (col of columns() ; track $index) {\r\n                    @if (col.totalizable) {\r\n                    <td class=\"ll-footer-cell fw-5 text-end fs-6\">\r\n                        {{ getTotals(col.fieldname)}}\r\n                    </td>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </tfoot>\r\n            }\r\n\r\n        </table>\r\n    </div>\r\n</ng-template>", styles: [".ll-search-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.ll-search-bar__left{display:flex;align-items:center;gap:6px;flex:1;flex-wrap:wrap}.ll-search-bar__right{display:flex;align-items:center;gap:4px;flex-shrink:0}.ll-search-bar__right .ll-search-group{display:flex;align-items:center;gap:4px}.ll-search-bar__right .ll-search-group .ll-search-label{white-space:nowrap}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{display:flex;align-items:center}@media (max-width: 576px){.ll-search-bar__right{width:100%;justify-content:space-between}.ll-search-bar__right .ll-search-group{flex-direction:column;align-items:flex-start;width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap input{flex:1}}.ll-scroll-container{width:100%;overflow-y:auto;overflow-x:auto;display:block;position:relative;border:var(--border-table-header);border-radius:4px;overflow-anchor:none}.ll-table{width:100%;border-collapse:collapse;table-layout:auto;white-space:nowrap}.ll-thead{position:sticky;top:0;z-index:3;background-color:var(--background-header-table)}.ll-thead tr th{font-size:11px;font-weight:700;color:var(--text-color);text-align:start;padding:6px 8px;border:var(--border-table-header);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:var(--background-header-table);box-shadow:0 2px 2px -1px #0000001a}.ll-th-sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.ll-th-sortable:hover{background-color:var(--bs-table-header-hover-bg)!important}.ll-th-content{display:flex;align-items:center;gap:2px}.ll-th-caption{overflow:hidden;text-overflow:ellipsis}.ll-sort-idle{opacity:.25}.ll-tfoot{position:sticky;bottom:0;z-index:3;background-color:var(--background-card)}.ll-tfoot .ll-footer-cell{font-size:11px;color:var(--text-color);padding:10px 8px;border:var(--border-table-header);background-color:var(--background-card);box-shadow:0 -2px 2px -1px #0000001a}.ll-row{height:30px;cursor:pointer}.ll-row:nth-child(odd){background-color:#00000010}.ll-row:hover{background-color:#00000015}.ll-row--selected{background:var(--table-active-bg)!important;color:var(--table-active-color)!important}.ll-row--drag-over{background-color:#5b8dee1f!important;outline:2px dashed #5b8dee;outline-offset:-2px;cursor:copy}.ll-row--drag-over td{color:#5b8dee!important}.ll-row td{font-size:11px;font-weight:500;color:var(--text-color);vertical-align:middle;padding:0 8px;border:var(--border-table-header);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ll-spacer td{padding:0;border:none}.ll-empty{text-align:center;padding:16px;color:#6c757d;font-size:12px}@media (max-width: 1600px){.ll-thead tr th,.ll-row td,.ll-tfoot .ll-footer-cell{font-size:9px}}.popover-menu-column{position:absolute;top:100%;left:0;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto}.popover-title{font-weight:700;margin-bottom:.7rem;margin-left:-.75rem;margin-right:-.75rem;padding:.4rem .75rem;border-bottom:1px solid #7e7e7e;position:sticky;top:0;text-align:center}.popover-menu-column::-webkit-scrollbar{width:5px}.popover-menu-column::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-column::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.popover-menu-filter{position:absolute;top:85%;right:0;background-color:#fff;border:1px solid #ddd;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto;z-index:2}.popover-menu-filter::-webkit-scrollbar{width:5px}.popover-menu-filter::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-filter::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.table-blank{background:var(--background-card)}.auditoria{padding-left:35px;padding-top:8px;padding-bottom:10px}.cw-25{min-width:40px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DropdownCdkComponent, selector: "app-dropdown-cdk", inputs: ["inline", "altoContainer"] }, { kind: "directive", type: AnimatedCheckboxDirective, selector: "input[type=checkbox][animatedCheckbox]", inputs: ["cbClass"] }, { kind: "component", type: CardMobileComponent, selector: "app-card-mobile", inputs: ["data", "columns", "identifier", "titleTabla", "actions", "altoContainer", "rendered"] }], animations: [fadeInOut, dropdownAnimation] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TableUltimateComponent, isStandalone: true, selector: "app-table-ultimate", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, footerRows: { classPropertyName: "footerRows", publicName: "footerRows", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, buffer: { classPropertyName: "buffer", publicName: "buffer", isSignal: true, isRequired: false, transformFunction: null }, altoContainer: { classPropertyName: "altoContainer", publicName: "altoContainer", isSignal: true, isRequired: false, transformFunction: null }, altoContenedor: { classPropertyName: "altoContenedor", publicName: "altoContenedor", isSignal: true, isRequired: false, transformFunction: null }, minAlto: { classPropertyName: "minAlto", publicName: "minAlto", isSignal: true, isRequired: false, transformFunction: null }, identifier: { classPropertyName: "identifier", publicName: "identifier", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, withDetails: { classPropertyName: "withDetails", publicName: "withDetails", isSignal: true, isRequired: false, transformFunction: null }, withCheckbox: { classPropertyName: "withCheckbox", publicName: "withCheckbox", isSignal: true, isRequired: false, transformFunction: null }, withTotal: { classPropertyName: "withTotal", publicName: "withTotal", isSignal: true, isRequired: false, transformFunction: null }, withHeight: { classPropertyName: "withHeight", publicName: "withHeight", isSignal: true, isRequired: false, transformFunction: null }, withAttachment: { classPropertyName: "withAttachment", publicName: "withAttachment", isSignal: true, isRequired: false, transformFunction: null }, variante: { classPropertyName: "variante", publicName: "variante", isSignal: true, isRequired: false, transformFunction: null }, rendered: { classPropertyName: "rendered", publicName: "rendered", isSignal: true, isRequired: false, transformFunction: null }, titleTabla: { classPropertyName: "titleTabla", publicName: "titleTabla", isSignal: true, isRequired: false, transformFunction: null }, activeMobileMode: { classPropertyName: "activeMobileMode", publicName: "activeMobileMode", isSignal: true, isRequired: false, transformFunction: null }, selectedRow: { classPropertyName: "selectedRow", publicName: "selectedRow", isSignal: true, isRequired: false, transformFunction: null }, rowClassFn: { classPropertyName: "rowClassFn", publicName: "rowClassFn", isSignal: true, isRequired: false, transformFunction: null }, rowDisabledFn: { classPropertyName: "rowDisabledFn", publicName: "rowDisabledFn", isSignal: true, isRequired: false, transformFunction: null }, selectItems: { classPropertyName: "selectItems", publicName: "selectItems", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowEvent: "rowEvent", selectedRow: "selectedRowChange", selectItems: "selectItemsChange" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.ll-variant--modern": "variante() === \"modern\"" } }, queries: [{ propertyName: "customActions", first: true, predicate: ["customActions"], descendants: true, isSignal: true }, { propertyName: "columnDefs", predicate: TsiColumnDefDirective, isSignal: true }, { propertyName: "contentFilter", first: true, predicate: ["header"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (withFiltro()) {\r\n<div class=\"ll-search-bar\">\r\n\r\n    <div class=\"ll-search-bar__left\">\r\n        <ng-container *ngTemplateOutlet=\"contentFilter();\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"ll-search-bar__right\">\r\n\r\n        <div class=\"ll-search-group\">\r\n\r\n            <label class=\"form-label mb-0 ll-search-label\">Buscar:</label>\r\n            <div class=\"ll-search-input-wrap\">\r\n\r\n                <input type=\"text\" class=\"form-control cw-250\" placeholder=\"Buscar...\" [value]=\"busqueda()\" (input)=\"textoDigitado($event)\" />\r\n                <app-dropdown-cdk>\r\n                    <ng-template #trigger>\r\n                        <button class=\"btn btn-dark boton-buscar fs-7\">\r\n                            <i class=\"fas fa-cog\"></i>\r\n                        </button>\r\n                    </ng-template>\r\n\r\n                    <ng-template #content>\r\n                        <div class=\"popover-menu-filter bg-white shadow\" @dropdownAnimation>\r\n                            <div class=\"popover-title fs-7 bg-white\">\r\n                                Filtros\r\n                            </div>\r\n\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input class=\"form-check-input py-0 my-0 cw-25 ch-15\" type=\"checkbox\" [checked]=\"true\"\r\n                                    (change)=\"toggleFiltros($event)\" id=\"filter_table_lazy_todos\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 mb-0 cursor-pointer\"\r\n                                    for=\"filter_table_lazy_todos\">\r\n                                    Todos\r\n                                </label>\r\n                            </div>\r\n\r\n                            @for (col of columns(); track col.caption) {\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                    id=\"{{ 'filter_' + col.caption }}\" [(ngModel)]=\"filtrarColumnas()[col.fieldname]\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 cursor-pointer mb-0\"\r\n                                    for=\"{{ 'filter_' + col.caption }}\">\r\n                                    {{ col.caption }}\r\n                                </label>\r\n                            </div>\r\n                            }\r\n                        </div>\r\n                    </ng-template>\r\n                </app-dropdown-cdk>\r\n\r\n            </div>\r\n\r\n        </div>\r\n\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n}\r\n\r\n@if (activeMobileMode()) {\r\n@if (isLoadingResponsive()) {\r\n<div class=\"d-flex flex-column justify-content-center align-items-center py-2\">\r\n    <div class=\"spinner-border text-secondary mb-2\" role=\"status\"></div>\r\n    <span class=\"ms-2 fs-6\">Cargando...</span>\r\n</div>\r\n}\r\n\r\n@if (!isLoadingResponsive()) {\r\n@if (isMobile()) {\r\n<app-card-mobile [data]=\"rowFilter()\" [columns]=\"columns()\" [actions]=\"customActions()\" [identifier]=\"identifier()\"\r\n    [titleTabla]=\"titleTabla()\" [altoContainer]=\"altoContainer()\" />\r\n}\r\n@if (!isMobile()) {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n}\r\n}\r\n@else {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n\r\n<ng-template #table>\r\n    <!-- Contenedor scrolleable \u2014 solo el BODY hace scroll; header y footer son sticky -->\r\n    <div #scrollContainer class=\"ll-scroll-container\"\r\n        [style.height]=\"withHeight() ? heightStyle() : ''\"\r\n        [style.max-height]=\"heightStyle()\" (scroll)=\"onScroll($event)\">\r\n        <table class=\"ll-table\">\r\n\r\n            <!-- \u2500\u2500 HEADER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <thead class=\"ll-thead\">\r\n                <tr>\r\n                    @if (withDetails()) {\r\n                    <th class=\"cw-25\"></th>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <th class=\"cw-20\">\r\n                        <label>\r\n                            <input type=\"checkbox\" name=\"check_box_select_table_main\" id=\"check_box_select_table_main\"\r\n                                animatedCheckbox [checked]=\"validaAllCheck()\" (change)=\"allCheck($event)\">\r\n                        </label>\r\n                    </th>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <th class=\"cw-40\">\r\n                        <app-dropdown-cdk>\r\n                            <ng-template #trigger>\r\n                                <button class=\"btn p-0 text-dark d-flex mx-auto border-0\">\r\n                                    <i class=\"fas fa-cog\"></i>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #content>\r\n                                <div class=\"popover-menu-column bg-white shadow mt-2\" @dropdownAnimation>\r\n                                    <div class=\"popover-title fs-7 bg-white\">Columnas</div>\r\n                                    @for (col of columns(); track col.caption) {\r\n                                    @if (col.caption) {\r\n                                    <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                        <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                            id=\"{{ 'switch_' + col.caption }}\"\r\n                                            [(ngModel)]=\"visibilidadColumn()[col.fieldname]\" />\r\n                                        <label class=\"form-check-label ps-2 fs-6 cursor-pointer font-label mb-0\"\r\n                                            for=\"{{ 'switch_' + col.caption }}\">\r\n                                            {{ col.caption }}\r\n                                        </label>\r\n                                    </div>\r\n                                    }\r\n                                    }\r\n                                </div>\r\n                            </ng-template>\r\n                        </app-dropdown-cdk>\r\n                    </th>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    <th [title]=\"col.caption\" [style.width.px]=\"col.width || null\"\r\n                        [style.min-width.px]=\"col.width || null\" [style.max-width.px]=\"col.width || null\"\r\n                        class=\"ll-th-sortable\" (click)=\"toggleSort(col.fieldname)\">\r\n                        <span class=\"ll-th-content\">\r\n                            <span class=\"ll-th-caption\">{{ col.caption }}</span>\r\n                            @if (sortField() === col.fieldname) {\r\n                            <i class=\"ms-1\"\r\n                                [ngClass]=\"sortDir() === 'asc' ? 'fas fa-angle-up fs-6':'fas fa-angle-down fs-6'\"></i>\r\n                            } @else {\r\n                            <i class=\"fas fa-sort ms-1 ll-sort-idle\"></i>\r\n                            }\r\n                        </span>\r\n                    </th>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </thead>\r\n\r\n            <!-- \u2500\u2500 BODY virtual \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <tbody>\r\n                <!-- Spacer superior: ocupa el espacio de las filas NO renderizadas arriba -->\r\n                @if (paddingTop() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingTop()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Filas visibles -->\r\n                @for (row of visibleRows(); track row.idListTsi) {\r\n                @let idList = row.idListTsi;\r\n                <tr class=\"ll-row\" [class.ll-row--selected]=\"isSelected(row, idList)\"\r\n                    [class.ll-row--drag-over]=\"withAttachment() && dragOverRowId() === idList\"\r\n                    (click)=\"selectRow(row, idList)\" (dblclick)=\"onDoubleClick(row)\"\r\n                    (contextmenu)=\"onRightClick($event,row)\"\r\n                    (dragover)=\"withAttachment() && onDragOver($event, idList)\"\r\n                    (dragleave)=\"withAttachment() && onDragLeave()\" (drop)=\"withAttachment() && onDrop($event, row)\">\r\n\r\n                    @if (withDetails()) {\r\n                    <td class=\"b-table text-center mwp-25\">\r\n                        <a (click)=\"toggleExpandRow(idList)\" class=\"text-dark cursor-pointer fs-6\">\r\n                            <i class=\"fa-solid\" [class.fa-chevron-right]=\"expandedRows() != idList\"\r\n                                [class.fa-chevron-down]=\"expandedRows() == idList\"></i>\r\n                        </a>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <td scope=\"col\" class=\"text-center b-table\">\r\n                        <label>\r\n                            <input type=\"checkbox\" [name]=\"'check_box_select_table_' + idList\"\r\n                                [id]=\"'check_box_select_table_' + idList\" animatedCheckbox\r\n                                [checked]=\"isItemSelected(idList)\" (click)=\"$event.stopPropagation()\"\r\n                                (change)=\"toogleItem(idList , $event)\" [disabled]=\"isCheckboxDisabled(row)\">\r\n                        </label>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <td class=\"text-center\">\r\n                        <ng-container *ngTemplateOutlet=\"customActions(); context: { $implicit: row }\"></ng-container>\r\n                    </td>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    @if (columnDefMap().has(col.fieldname)) {\r\n                    <td>\r\n                        <ng-container *ngTemplateOutlet=\"columnDefMap().get(col.fieldname)!; context: { $implicit: row, column: col }\">\r\n                        </ng-container>\r\n                    </td>\r\n                    } @else if (col.template) {\r\n                    <td>\r\n                        <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row, column: col }\">\r\n                        </ng-container>\r\n                    </td>\r\n                    } @else {\r\n                    @switch (col.tipo) {\r\n\r\n                    @case ('cell-render') {\r\n                    @let resolverItem = resolveCell(col.fieldname, row);\r\n                    @if (resolverItem) {\r\n                    <td [title]=\"resolverItem.text\" [class.text-center]=\"resolverItem.icon\">\r\n                        @if (resolverItem.icon) {\r\n                        <i class=\"fs-5\" [ngClass]=\"resolverItem.icon\"></i>\r\n                        } @else if (resolverItem.class) {\r\n                        <span [ngClass]=\"row.situac == 'J' ? 'text-error' : resolverItem.class\">\r\n                            {{ resolverItem.text }}\r\n                        </span>\r\n                        } @else {\r\n                        {{ resolverItem.text }}\r\n                        }\r\n                    </td>\r\n                    }\r\n                    }\r\n\r\n                    @default {\r\n                    <td [innerHTML]=\"getHighlight(row._format?.[col.fieldname] ?? row[col.fieldname], col.fieldname)\"\r\n                        [style.width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [style.max-width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [attr.title]=\"row[col.fieldname] || null\"\r\n                        [ngClass]=\"rowClassFn() ? rowClassFn()(row) : getRowClass(row)\" class=\"{{getPosition(col)}}\">\r\n                    </td>\r\n                    }\r\n\r\n                    }\r\n                    }\r\n                    }\r\n                    }\r\n                </tr>\r\n\r\n                @if (idList == expandedRows()) {\r\n                <tr @fadeInOut>\r\n                    <td [attr.colspan]=\"columns().length + (withDetails() ? 1 : 0) + (customActions() ? 1 : 0) + (withCheckbox() ? 1 : 0)\"\r\n                        class=\"table-blank\">\r\n                        <div class=\"d-flex flex-column auditoria\">\r\n                            <span class=\"fw-bold fs-7 text-dark\">Datos de auditor\u00EDa</span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Creaci\u00F3n: {{ row.nomucreac }} el {{ row._format?.fcreac ?? row.fcreac }} a las {{\r\n                                row.hcreac }}\r\n                            </span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Actualizaci\u00F3n: {{ row.nomuactua }} el {{ row._format?.factua ?? row.factua }} a las\r\n                                {{\r\n                                row.hactua }}\r\n                            </span>\r\n                        </div>\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                }\r\n\r\n                <!-- Fila vac\u00EDa si no hay datos -->\r\n                @if (rowFilter().length === 0) {\r\n                <tr>\r\n                    <td [attr.colspan]=\"columns().length\" class=\"ll-empty\">\r\n                        Sin datos\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Spacer inferior: ocupa el espacio de las filas NO renderizadas abajo -->\r\n                @if (paddingBottom() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingBottom()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n            </tbody>\r\n\r\n            <!-- \u2500\u2500 FOOTER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            @if (withTotal() && rowFilter().length > 0) {\r\n            <tfoot class=\"ll-tfoot\">\r\n\r\n                <tr>\r\n                    <td [attr.colspan]=\"getColspanBeforeTotals()\" class=\"fw-5 fs-6 ps-2 py-2\">Totales:</td>\r\n                    @for (col of columns() ; track $index) {\r\n                    @if (col.totalizable) {\r\n                    <td class=\"ll-footer-cell fw-5 text-end fs-6\">\r\n                        {{ getTotals(col.fieldname)}}\r\n                    </td>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </tfoot>\r\n            }\r\n\r\n        </table>\r\n    </div>\r\n</ng-template>", styles: [":host(.ll-variant--modern) .ll-search-bar .ll-search-label{display:none}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap input.form-control{width:250px!important;min-width:250px!important;border-radius:5px!important;border:1px solid rgba(0,0,0,.12);background-color:#fff;font-size:12px;padding-left:34px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:10px center;background-size:14px 14px;transition:border-color .15s ease,box-shadow .15s ease;height:30px!important;font-weight:400}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap input.form-control::placeholder{color:#9ca3af}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap input.form-control:focus{border-color:#1e293b;box-shadow:0 0 0 3px #1e293b14;outline:none}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap .boton-buscar{border-radius:5px;height:30px!important;width:30px!important;min-width:30px!important;background-color:#fff!important;border:1px solid rgba(0,0,0,.12)!important;color:#546074!important}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap .boton-buscar:hover{background-color:#f3f4f6!important;border-color:#0003!important}:host(.ll-variant--modern) .ll-scroll-container{border-radius:10px!important;border:1px solid rgba(0,0,0,.08);box-shadow:0 1px 3px #0000000f,0 4px 16px #0000000a;background:#fff}:host(.ll-variant--modern) .ll-table{border-collapse:separate;border-spacing:0;background:#fff}:host(.ll-variant--modern) .ll-thead tr th{background-color:#1e293b;color:#f1f5f9!important;border:none;border-right:1px solid white;border-bottom:none;padding:10px 14px;letter-spacing:.06em;font-size:10px!important;font-weight:600;box-shadow:none}:host(.ll-variant--modern) .ll-thead tr th:first-child{border-top-left-radius:10px}:host(.ll-variant--modern) .ll-thead tr th:last-child{border-top-right-radius:10px;border-right:none}:host(.ll-variant--modern) .ll-th-sortable:hover{background-color:#334155!important}:host(.ll-variant--modern) .ll-sort-idle{opacity:.4;color:#f1f5f9}:host(.ll-variant--modern) .ll-row{transition:background-color .1s ease}:host(.ll-variant--modern) .ll-row:nth-child(odd),:host(.ll-variant--modern) .ll-row:nth-child(2n){background-color:#fff}:host(.ll-variant--modern) .ll-row:hover:not(:host(.ll-variant--modern) .ll-row--selected){background-color:#f9fafb!important}:host(.ll-variant--modern) .ll-row--selected{background:var(--table-active-bg)!important;color:var(--table-active-color)!important;box-shadow:inset 4px 0 #334155}:host(.ll-variant--modern) .ll-row--drag-over{background-color:#5b8dee14!important;outline:2px dashed rgba(91,141,238,.5);outline-offset:-2px}:host(.ll-variant--modern) .ll-row td{border-left:none;border-right:none;border-top:none;border-bottom:1px solid rgba(0,0,0,.06);padding:0 14px}:host(.ll-variant--modern) .ll-tfoot tr td:first-child{border-bottom-left-radius:10px}:host(.ll-variant--modern) .ll-tfoot tr td:last-child{border-bottom-right-radius:10px}:host(.ll-variant--modern) .ll-tfoot .ll-footer-cell{background-color:var(--background-card);color:var(--text-color);border:none;border-top:1px solid rgba(0,0,0,.08);padding:10px 14px;box-shadow:none}:host(.ll-variant--modern) .ll-empty{padding:28px;color:#9ca3af;font-size:13px}.ll-search-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.ll-search-bar__left{display:flex;align-items:center;gap:6px;flex:1;flex-wrap:wrap}.ll-search-bar__right{display:flex;align-items:center;gap:4px;flex-shrink:0}.ll-search-bar__right .ll-search-group{display:flex;align-items:center;gap:4px}.ll-search-bar__right .ll-search-group .ll-search-label{white-space:nowrap}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{display:flex;align-items:center}@media (max-width: 576px){.ll-search-bar__right{width:100%;justify-content:space-between}.ll-search-bar__right .ll-search-group{flex-direction:column;align-items:flex-start;width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap input{flex:1}}.ll-scroll-container{width:100%;overflow-y:auto;overflow-x:auto;display:block;position:relative;border:var(--border-table-header);border-radius:4px;overflow-anchor:none}.ll-table{width:100%;border-collapse:collapse;table-layout:auto;white-space:nowrap}.ll-thead{position:sticky;top:0;z-index:3;background-color:var(--background-header-table)}.ll-thead tr th{font-size:11px;font-weight:700;color:var(--text-color);text-align:start;padding:6px 8px;border:var(--border-table-header);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:var(--background-header-table);box-shadow:0 2px 2px -1px #0000001a}.ll-th-sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.ll-th-sortable:hover{background-color:var(--bs-table-header-hover-bg)!important}.ll-th-content{display:flex;align-items:center;gap:2px}.ll-th-caption{overflow:hidden;text-overflow:ellipsis}.ll-sort-idle{opacity:.25}.ll-tfoot{position:sticky;bottom:0;z-index:3;background-color:var(--background-card)}.ll-tfoot .ll-footer-cell{font-size:11px;color:var(--text-color);padding:10px 8px;border:var(--border-table-header);background-color:var(--background-card);box-shadow:0 -2px 2px -1px #0000001a}.ll-row{height:30px;cursor:pointer}.ll-row:nth-child(odd){background-color:#00000010}.ll-row:hover{background-color:#00000015}.ll-row--selected{background:var(--table-active-bg)!important;color:var(--table-active-color)!important}.ll-row--drag-over{background-color:#5b8dee1f!important;outline:2px dashed #5b8dee;outline-offset:-2px;cursor:copy}.ll-row--drag-over td{color:#5b8dee!important}.ll-row td{font-size:11px;font-weight:500;color:var(--text-color);vertical-align:middle;padding:0 8px;border:var(--border-table-header);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ll-spacer td{padding:0;border:none}.ll-empty{text-align:center;padding:16px;color:#6c757d;font-size:12px}@media (max-width: 1600px){.ll-thead tr th,.ll-row td,.ll-tfoot .ll-footer-cell{font-size:9px}}.popover-menu-column{position:absolute;top:100%;left:0;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto}.popover-title{font-weight:700;margin-bottom:.7rem;margin-left:-.75rem;margin-right:-.75rem;padding:.4rem .75rem;border-bottom:1px solid #7e7e7e;position:sticky;top:0;text-align:center}.popover-menu-column::-webkit-scrollbar{width:5px}.popover-menu-column::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-column::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.popover-menu-filter{position:absolute;top:85%;right:0;background-color:#fff;border:1px solid #ddd;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto;z-index:2}.popover-menu-filter::-webkit-scrollbar{width:5px}.popover-menu-filter::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-filter::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.table-blank{background:var(--background-card)}.auditoria{padding-left:35px;padding-top:8px;padding-bottom:10px}.cw-25{min-width:40px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DropdownCdkComponent, selector: "app-dropdown-cdk", inputs: ["inline", "altoContainer"] }, { kind: "directive", type: AnimatedCheckboxDirective, selector: "input[type=checkbox][animatedCheckbox]", inputs: ["cbClass"] }, { kind: "component", type: CardMobileComponent, selector: "app-card-mobile", inputs: ["data", "columns", "identifier", "titleTabla", "actions", "altoContainer", "rendered"] }], animations: [fadeInOut, dropdownAnimation] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableUltimateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-table-ultimate', imports: [FormsModule, CommonModule, DropdownCdkComponent, AnimatedCheckboxDirective, CardMobileComponent, NgTemplateOutlet], animations: [fadeInOut, dropdownAnimation], template: "@if (withFiltro()) {\r\n<div class=\"ll-search-bar\">\r\n\r\n    <div class=\"ll-search-bar__left\">\r\n        <ng-container *ngTemplateOutlet=\"contentFilter();\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"ll-search-bar__right\">\r\n\r\n        <div class=\"ll-search-group\">\r\n\r\n            <label class=\"form-label mb-0 ll-search-label\">Buscar:</label>\r\n            <div class=\"ll-search-input-wrap\">\r\n\r\n                <input type=\"text\" class=\"form-control cw-250\" [value]=\"busqueda()\" (input)=\"textoDigitado($event)\" />\r\n                <app-dropdown-cdk>\r\n                    <ng-template #trigger>\r\n                        <button class=\"btn btn-dark boton-buscar fs-7\">\r\n                            <i class=\"fas fa-cog\"></i>\r\n                        </button>\r\n                    </ng-template>\r\n\r\n                    <ng-template #content>\r\n                        <div class=\"popover-menu-filter bg-white shadow\" @dropdownAnimation>\r\n                            <div class=\"popover-title fs-7 bg-white\">\r\n                                Filtros\r\n                            </div>\r\n\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input class=\"form-check-input py-0 my-0 cw-25 ch-15\" type=\"checkbox\" [checked]=\"true\"\r\n                                    (change)=\"toggleFiltros($event)\" id=\"filter_table_lazy_todos\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 mb-0 cursor-pointer\"\r\n                                    for=\"filter_table_lazy_todos\">\r\n                                    Todos\r\n                                </label>\r\n                            </div>\r\n\r\n                            @for (col of columns(); track col.caption) {\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                    id=\"{{ 'filter_' + col.caption }}\" [(ngModel)]=\"filtrarColumnas()[col.fieldname]\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 cursor-pointer mb-0\"\r\n                                    for=\"{{ 'filter_' + col.caption }}\">\r\n                                    {{ col.caption }}\r\n                                </label>\r\n                            </div>\r\n                            }\r\n                        </div>\r\n                    </ng-template>\r\n                </app-dropdown-cdk>\r\n\r\n            </div>\r\n\r\n        </div>\r\n\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n}\r\n\r\n@if (activeMobileMode()) {\r\n@if (isLoadingResponsive()) {\r\n<div class=\"d-flex flex-column justify-content-center align-items-center py-2\">\r\n    <div class=\"spinner-border text-secondary mb-2\" role=\"status\"></div>\r\n    <span class=\"ms-2 fs-6\">Cargando...</span>\r\n</div>\r\n}\r\n\r\n@if (!isLoadingResponsive()) {\r\n@if (isMobile()) {\r\n<app-card-mobile [data]=\"rowFilter()\" [columns]=\"columns()\" [actions]=\"customActions()\" [identifier]=\"identifier()\"\r\n    [titleTabla]=\"titleTabla()\" [altoContainer]=\"altoContainer()\" />\r\n}\r\n@if (!isMobile()) {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n}\r\n}\r\n@else {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n\r\n<ng-template #table>\r\n    <!-- Contenedor scrolleable \u2014 solo el BODY hace scroll; header y footer son sticky -->\r\n    <div #scrollContainer class=\"ll-scroll-container\" [style.height]=\"withHeight() ? heightStyle() : ''\"\r\n        [style.max-height]=\"heightStyle()\" (scroll)=\"onScroll($event)\">\r\n        <table class=\"ll-table\">\r\n\r\n            <!-- \u2500\u2500 HEADER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <thead class=\"ll-thead\">\r\n                <tr>\r\n                    @if (withDetails()) {\r\n                    <th class=\"cw-25\"></th>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <th class=\"cw-20\">\r\n                        <label>\r\n                            <input type=\"checkbox\" name=\"check_box_select_table_main\" id=\"check_box_select_table_main\"\r\n                                animatedCheckbox [checked]=\"validaAllCheck()\" (change)=\"allCheck($event)\">\r\n                        </label>\r\n                    </th>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <th class=\"cw-40\">\r\n                        <app-dropdown-cdk>\r\n                            <ng-template #trigger>\r\n                                <button class=\"btn p-0 text-dark d-flex mx-auto border-0\">\r\n                                    <i class=\"fas fa-cog\"></i>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #content>\r\n                                <div class=\"popover-menu-column bg-white shadow mt-2\" @dropdownAnimation>\r\n                                    <div class=\"popover-title fs-7 bg-white\">Columnas</div>\r\n                                    @for (col of columns(); track col.caption) {\r\n                                    @if (col.caption) {\r\n                                    <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                        <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                            id=\"{{ 'switch_' + col.caption }}\"\r\n                                            [(ngModel)]=\"visibilidadColumn()[col.fieldname]\" />\r\n                                        <label class=\"form-check-label ps-2 fs-6 cursor-pointer font-label mb-0\"\r\n                                            for=\"{{ 'switch_' + col.caption }}\">\r\n                                            {{ col.caption }}\r\n                                        </label>\r\n                                    </div>\r\n                                    }\r\n                                    }\r\n                                </div>\r\n                            </ng-template>\r\n                        </app-dropdown-cdk>\r\n                    </th>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    <th [title]=\"col.caption\" [style.width.px]=\"col.width || null\"\r\n                        [style.min-width.px]=\"col.width || null\" [style.max-width.px]=\"col.width || null\"\r\n                        class=\"ll-th-sortable\" (click)=\"toggleSort(col.fieldname)\">\r\n                        <span class=\"ll-th-content\">\r\n                            <span class=\"ll-th-caption\">{{ col.caption }}</span>\r\n                            @if (sortField() === col.fieldname) {\r\n                            <i class=\"ms-1\"\r\n                                [ngClass]=\"sortDir() === 'asc' ? 'fas fa-angle-up fs-6':'fas fa-angle-down fs-6'\"></i>\r\n                            } @else {\r\n                            <i class=\"fas fa-sort ms-1 ll-sort-idle\"></i>\r\n                            }\r\n                        </span>\r\n                    </th>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </thead>\r\n\r\n            <!-- \u2500\u2500 BODY virtual \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <tbody>\r\n                <!-- Spacer superior: ocupa el espacio de las filas NO renderizadas arriba -->\r\n                @if (paddingTop() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingTop()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Filas visibles -->\r\n                @for (row of visibleRows(); track row.idListTsi) {\r\n                @let idList = row.idListTsi;\r\n                <tr class=\"ll-row\" [class.ll-row--selected]=\"isSelected(row, idList)\"\r\n                    [class.ll-row--drag-over]=\"withAttachment() && dragOverRowId() === idList\"\r\n                    (click)=\"selectRow(row, idList)\" (dblclick)=\"onDoubleClick(row)\"\r\n                    (contextmenu)=\"onRightClick($event,row)\"\r\n                    (dragover)=\"withAttachment() && onDragOver($event, idList)\"\r\n                    (dragleave)=\"withAttachment() && onDragLeave()\" (drop)=\"withAttachment() && onDrop($event, row)\">\r\n\r\n                    @if (withDetails()) {\r\n                    <td class=\"b-table text-center mwp-25\">\r\n                        <a (click)=\"toggleExpandRow(idList)\" class=\"text-dark cursor-pointer fs-6\">\r\n                            <i class=\"fa-solid\" [class.fa-chevron-right]=\"expandedRows() != idList\"\r\n                                [class.fa-chevron-down]=\"expandedRows() == idList\"></i>\r\n                        </a>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <td scope=\"col\" class=\"text-center b-table\">\r\n                        <label>\r\n                            <input type=\"checkbox\" [name]=\"'check_box_select_table_' + idList\"\r\n                                [id]=\"'check_box_select_table_' + idList\" animatedCheckbox\r\n                                [checked]=\"isItemSelected(idList)\" (click)=\"$event.stopPropagation()\"\r\n                                (change)=\"toogleItem(idList , $event)\" [disabled]=\"isCheckboxDisabled(row)\">\r\n                        </label>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <td class=\"text-center\">\r\n                        <ng-container *ngTemplateOutlet=\"customActions(); context: { $implicit: row }\"></ng-container>\r\n                    </td>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    @if (col.template) {\r\n                    <td>\r\n                        <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row, column: col }\">\r\n                        </ng-container>\r\n                    </td>\r\n                    } @else {\r\n                    @switch (col.tipo) {\r\n\r\n                    @case ('cell-render') {\r\n                    @let resolverItem = resolveCell(col.fieldname, row);\r\n                    @if (resolverItem) {\r\n                    <td [title]=\"resolverItem.text\" [class.text-center]=\"resolverItem.icon\">\r\n                        @if (resolverItem.icon) {\r\n                        <i class=\"fs-5\" [ngClass]=\"resolverItem.icon\"></i>\r\n                        } @else if (resolverItem.class) {\r\n                        <span [ngClass]=\"row.situac == 'J' ? 'text-error' : resolverItem.class\">\r\n                            {{ resolverItem.text }}\r\n                        </span>\r\n                        } @else {\r\n                        {{ resolverItem.text }}\r\n                        }\r\n                    </td>\r\n                    }\r\n                    }\r\n\r\n                    @default {\r\n                    <td [innerHTML]=\"getHighlight(row._format?.[col.fieldname] ?? row[col.fieldname], col.fieldname)\"\r\n                        [style.width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [style.max-width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [attr.title]=\"row[col.fieldname] || null\"\r\n                        [ngClass]=\"rowClassFn() ? rowClassFn()(row) : getRowClass(row)\" class=\"{{getPosition(col)}}\">\r\n                    </td>\r\n                    }\r\n\r\n                    }\r\n                    }\r\n                    }\r\n                    }\r\n                </tr>\r\n\r\n                @if (idList == expandedRows()) {\r\n                <tr @fadeInOut>\r\n                    <td [attr.colspan]=\"columns().length + (withDetails() ? 1 : 0) + (customActions() ? 1 : 0) + (withCheckbox() ? 1 : 0)\"\r\n                        class=\"table-blank\">\r\n                        <div class=\"d-flex flex-column auditoria\">\r\n                            <span class=\"fw-bold fs-7 text-dark\">Datos de auditor\u00EDa</span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Creaci\u00F3n: {{ row.nomucreac }} el {{ row._format?.fcreac ?? row.fcreac }} a las {{\r\n                                row.hcreac }}\r\n                            </span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Actualizaci\u00F3n: {{ row.nomuactua }} el {{ row._format?.factua ?? row.factua }} a las\r\n                                {{\r\n                                row.hactua }}\r\n                            </span>\r\n                        </div>\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                }\r\n\r\n                <!-- Fila vac\u00EDa si no hay datos -->\r\n                @if (rowFilter().length === 0) {\r\n                <tr>\r\n                    <td [attr.colspan]=\"columns().length\" class=\"ll-empty\">\r\n                        Sin datos\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Spacer inferior: ocupa el espacio de las filas NO renderizadas abajo -->\r\n                @if (paddingBottom() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingBottom()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n            </tbody>\r\n\r\n            <!-- \u2500\u2500 FOOTER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            @if (withTotal() && rowFilter().length > 0) {\r\n            <tfoot class=\"ll-tfoot\">\r\n\r\n                <tr>\r\n                    <td [attr.colspan]=\"getColspanBeforeTotals()\" class=\"fw-5 fs-6 ps-2 py-2\">Totales:</td>\r\n                    @for (col of columns() ; track $index) {\r\n                    @if (col.totalizable) {\r\n                    <td class=\"ll-footer-cell fw-5 text-end fs-6\">\r\n                        {{ getTotals(col.fieldname)}}\r\n                    </td>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </tfoot>\r\n            }\r\n\r\n        </table>\r\n    </div>\r\n</ng-template>", styles: [".ll-search-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.ll-search-bar__left{display:flex;align-items:center;gap:6px;flex:1;flex-wrap:wrap}.ll-search-bar__right{display:flex;align-items:center;gap:4px;flex-shrink:0}.ll-search-bar__right .ll-search-group{display:flex;align-items:center;gap:4px}.ll-search-bar__right .ll-search-group .ll-search-label{white-space:nowrap}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{display:flex;align-items:center}@media (max-width: 576px){.ll-search-bar__right{width:100%;justify-content:space-between}.ll-search-bar__right .ll-search-group{flex-direction:column;align-items:flex-start;width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap input{flex:1}}.ll-scroll-container{width:100%;overflow-y:auto;overflow-x:auto;display:block;position:relative;border:var(--border-table-header);border-radius:4px;overflow-anchor:none}.ll-table{width:100%;border-collapse:collapse;table-layout:auto;white-space:nowrap}.ll-thead{position:sticky;top:0;z-index:3;background-color:var(--background-header-table)}.ll-thead tr th{font-size:11px;font-weight:700;color:var(--text-color);text-align:start;padding:6px 8px;border:var(--border-table-header);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:var(--background-header-table);box-shadow:0 2px 2px -1px #0000001a}.ll-th-sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.ll-th-sortable:hover{background-color:var(--bs-table-header-hover-bg)!important}.ll-th-content{display:flex;align-items:center;gap:2px}.ll-th-caption{overflow:hidden;text-overflow:ellipsis}.ll-sort-idle{opacity:.25}.ll-tfoot{position:sticky;bottom:0;z-index:3;background-color:var(--background-card)}.ll-tfoot .ll-footer-cell{font-size:11px;color:var(--text-color);padding:10px 8px;border:var(--border-table-header);background-color:var(--background-card);box-shadow:0 -2px 2px -1px #0000001a}.ll-row{height:30px;cursor:pointer}.ll-row:nth-child(odd){background-color:#00000010}.ll-row:hover{background-color:#00000015}.ll-row--selected{background:var(--table-active-bg)!important;color:var(--table-active-color)!important}.ll-row--drag-over{background-color:#5b8dee1f!important;outline:2px dashed #5b8dee;outline-offset:-2px;cursor:copy}.ll-row--drag-over td{color:#5b8dee!important}.ll-row td{font-size:11px;font-weight:500;color:var(--text-color);vertical-align:middle;padding:0 8px;border:var(--border-table-header);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ll-spacer td{padding:0;border:none}.ll-empty{text-align:center;padding:16px;color:#6c757d;font-size:12px}@media (max-width: 1600px){.ll-thead tr th,.ll-row td,.ll-tfoot .ll-footer-cell{font-size:9px}}.popover-menu-column{position:absolute;top:100%;left:0;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto}.popover-title{font-weight:700;margin-bottom:.7rem;margin-left:-.75rem;margin-right:-.75rem;padding:.4rem .75rem;border-bottom:1px solid #7e7e7e;position:sticky;top:0;text-align:center}.popover-menu-column::-webkit-scrollbar{width:5px}.popover-menu-column::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-column::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.popover-menu-filter{position:absolute;top:85%;right:0;background-color:#fff;border:1px solid #ddd;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto;z-index:2}.popover-menu-filter::-webkit-scrollbar{width:5px}.popover-menu-filter::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-filter::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.table-blank{background:var(--background-card)}.auditoria{padding-left:35px;padding-top:8px;padding-bottom:10px}.cw-25{min-width:40px}\n"] }]
+            args: [{ selector: 'app-table-ultimate', imports: [FormsModule, CommonModule, DropdownCdkComponent, AnimatedCheckboxDirective, CardMobileComponent, NgTemplateOutlet, TsiColumnDefDirective], animations: [fadeInOut, dropdownAnimation], host: {
+                        '[class.ll-variant--modern]': 'variante() === "modern"'
+                    }, template: "@if (withFiltro()) {\r\n<div class=\"ll-search-bar\">\r\n\r\n    <div class=\"ll-search-bar__left\">\r\n        <ng-container *ngTemplateOutlet=\"contentFilter();\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"ll-search-bar__right\">\r\n\r\n        <div class=\"ll-search-group\">\r\n\r\n            <label class=\"form-label mb-0 ll-search-label\">Buscar:</label>\r\n            <div class=\"ll-search-input-wrap\">\r\n\r\n                <input type=\"text\" class=\"form-control cw-250\" placeholder=\"Buscar...\" [value]=\"busqueda()\" (input)=\"textoDigitado($event)\" />\r\n                <app-dropdown-cdk>\r\n                    <ng-template #trigger>\r\n                        <button class=\"btn btn-dark boton-buscar fs-7\">\r\n                            <i class=\"fas fa-cog\"></i>\r\n                        </button>\r\n                    </ng-template>\r\n\r\n                    <ng-template #content>\r\n                        <div class=\"popover-menu-filter bg-white shadow\" @dropdownAnimation>\r\n                            <div class=\"popover-title fs-7 bg-white\">\r\n                                Filtros\r\n                            </div>\r\n\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input class=\"form-check-input py-0 my-0 cw-25 ch-15\" type=\"checkbox\" [checked]=\"true\"\r\n                                    (change)=\"toggleFiltros($event)\" id=\"filter_table_lazy_todos\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 mb-0 cursor-pointer\"\r\n                                    for=\"filter_table_lazy_todos\">\r\n                                    Todos\r\n                                </label>\r\n                            </div>\r\n\r\n                            @for (col of columns(); track col.caption) {\r\n                            <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                    id=\"{{ 'filter_' + col.caption }}\" [(ngModel)]=\"filtrarColumnas()[col.fieldname]\" />\r\n                                <label class=\"form-check-label ps-2 fs-6 cursor-pointer mb-0\"\r\n                                    for=\"{{ 'filter_' + col.caption }}\">\r\n                                    {{ col.caption }}\r\n                                </label>\r\n                            </div>\r\n                            }\r\n                        </div>\r\n                    </ng-template>\r\n                </app-dropdown-cdk>\r\n\r\n            </div>\r\n\r\n        </div>\r\n\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n}\r\n\r\n@if (activeMobileMode()) {\r\n@if (isLoadingResponsive()) {\r\n<div class=\"d-flex flex-column justify-content-center align-items-center py-2\">\r\n    <div class=\"spinner-border text-secondary mb-2\" role=\"status\"></div>\r\n    <span class=\"ms-2 fs-6\">Cargando...</span>\r\n</div>\r\n}\r\n\r\n@if (!isLoadingResponsive()) {\r\n@if (isMobile()) {\r\n<app-card-mobile [data]=\"rowFilter()\" [columns]=\"columns()\" [actions]=\"customActions()\" [identifier]=\"identifier()\"\r\n    [titleTabla]=\"titleTabla()\" [altoContainer]=\"altoContainer()\" />\r\n}\r\n@if (!isMobile()) {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n}\r\n}\r\n@else {\r\n<ng-container *ngTemplateOutlet=\"table\"></ng-container>\r\n}\r\n\r\n<ng-template #table>\r\n    <!-- Contenedor scrolleable \u2014 solo el BODY hace scroll; header y footer son sticky -->\r\n    <div #scrollContainer class=\"ll-scroll-container\"\r\n        [style.height]=\"withHeight() ? heightStyle() : ''\"\r\n        [style.max-height]=\"heightStyle()\" (scroll)=\"onScroll($event)\">\r\n        <table class=\"ll-table\">\r\n\r\n            <!-- \u2500\u2500 HEADER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <thead class=\"ll-thead\">\r\n                <tr>\r\n                    @if (withDetails()) {\r\n                    <th class=\"cw-25\"></th>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <th class=\"cw-20\">\r\n                        <label>\r\n                            <input type=\"checkbox\" name=\"check_box_select_table_main\" id=\"check_box_select_table_main\"\r\n                                animatedCheckbox [checked]=\"validaAllCheck()\" (change)=\"allCheck($event)\">\r\n                        </label>\r\n                    </th>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <th class=\"cw-40\">\r\n                        <app-dropdown-cdk>\r\n                            <ng-template #trigger>\r\n                                <button class=\"btn p-0 text-dark d-flex mx-auto border-0\">\r\n                                    <i class=\"fas fa-cog\"></i>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #content>\r\n                                <div class=\"popover-menu-column bg-white shadow mt-2\" @dropdownAnimation>\r\n                                    <div class=\"popover-title fs-7 bg-white\">Columnas</div>\r\n                                    @for (col of columns(); track col.caption) {\r\n                                    @if (col.caption) {\r\n                                    <div class=\"form-check form-switch text-start d-flex align-items-center\">\r\n                                        <input type=\"checkbox\" class=\"form-check-input py-0 my-0 cw-25 ch-15\"\r\n                                            id=\"{{ 'switch_' + col.caption }}\"\r\n                                            [(ngModel)]=\"visibilidadColumn()[col.fieldname]\" />\r\n                                        <label class=\"form-check-label ps-2 fs-6 cursor-pointer font-label mb-0\"\r\n                                            for=\"{{ 'switch_' + col.caption }}\">\r\n                                            {{ col.caption }}\r\n                                        </label>\r\n                                    </div>\r\n                                    }\r\n                                    }\r\n                                </div>\r\n                            </ng-template>\r\n                        </app-dropdown-cdk>\r\n                    </th>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    <th [title]=\"col.caption\" [style.width.px]=\"col.width || null\"\r\n                        [style.min-width.px]=\"col.width || null\" [style.max-width.px]=\"col.width || null\"\r\n                        class=\"ll-th-sortable\" (click)=\"toggleSort(col.fieldname)\">\r\n                        <span class=\"ll-th-content\">\r\n                            <span class=\"ll-th-caption\">{{ col.caption }}</span>\r\n                            @if (sortField() === col.fieldname) {\r\n                            <i class=\"ms-1\"\r\n                                [ngClass]=\"sortDir() === 'asc' ? 'fas fa-angle-up fs-6':'fas fa-angle-down fs-6'\"></i>\r\n                            } @else {\r\n                            <i class=\"fas fa-sort ms-1 ll-sort-idle\"></i>\r\n                            }\r\n                        </span>\r\n                    </th>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </thead>\r\n\r\n            <!-- \u2500\u2500 BODY virtual \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            <tbody>\r\n                <!-- Spacer superior: ocupa el espacio de las filas NO renderizadas arriba -->\r\n                @if (paddingTop() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingTop()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Filas visibles -->\r\n                @for (row of visibleRows(); track row.idListTsi) {\r\n                @let idList = row.idListTsi;\r\n                <tr class=\"ll-row\" [class.ll-row--selected]=\"isSelected(row, idList)\"\r\n                    [class.ll-row--drag-over]=\"withAttachment() && dragOverRowId() === idList\"\r\n                    (click)=\"selectRow(row, idList)\" (dblclick)=\"onDoubleClick(row)\"\r\n                    (contextmenu)=\"onRightClick($event,row)\"\r\n                    (dragover)=\"withAttachment() && onDragOver($event, idList)\"\r\n                    (dragleave)=\"withAttachment() && onDragLeave()\" (drop)=\"withAttachment() && onDrop($event, row)\">\r\n\r\n                    @if (withDetails()) {\r\n                    <td class=\"b-table text-center mwp-25\">\r\n                        <a (click)=\"toggleExpandRow(idList)\" class=\"text-dark cursor-pointer fs-6\">\r\n                            <i class=\"fa-solid\" [class.fa-chevron-right]=\"expandedRows() != idList\"\r\n                                [class.fa-chevron-down]=\"expandedRows() == idList\"></i>\r\n                        </a>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (withCheckbox()) {\r\n                    <td scope=\"col\" class=\"text-center b-table\">\r\n                        <label>\r\n                            <input type=\"checkbox\" [name]=\"'check_box_select_table_' + idList\"\r\n                                [id]=\"'check_box_select_table_' + idList\" animatedCheckbox\r\n                                [checked]=\"isItemSelected(idList)\" (click)=\"$event.stopPropagation()\"\r\n                                (change)=\"toogleItem(idList , $event)\" [disabled]=\"isCheckboxDisabled(row)\">\r\n                        </label>\r\n                    </td>\r\n                    }\r\n\r\n                    @if (customActions()) {\r\n                    <td class=\"text-center\">\r\n                        <ng-container *ngTemplateOutlet=\"customActions(); context: { $implicit: row }\"></ng-container>\r\n                    </td>\r\n                    }\r\n\r\n                    @for (col of columns(); track $index) {\r\n                    @if (validaVisibilidad(col.visible) && visibilidadColumn()[col.fieldname] !== false) {\r\n                    @if (columnDefMap().has(col.fieldname)) {\r\n                    <td>\r\n                        <ng-container *ngTemplateOutlet=\"columnDefMap().get(col.fieldname)!; context: { $implicit: row, column: col }\">\r\n                        </ng-container>\r\n                    </td>\r\n                    } @else if (col.template) {\r\n                    <td>\r\n                        <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row, column: col }\">\r\n                        </ng-container>\r\n                    </td>\r\n                    } @else {\r\n                    @switch (col.tipo) {\r\n\r\n                    @case ('cell-render') {\r\n                    @let resolverItem = resolveCell(col.fieldname, row);\r\n                    @if (resolverItem) {\r\n                    <td [title]=\"resolverItem.text\" [class.text-center]=\"resolverItem.icon\">\r\n                        @if (resolverItem.icon) {\r\n                        <i class=\"fs-5\" [ngClass]=\"resolverItem.icon\"></i>\r\n                        } @else if (resolverItem.class) {\r\n                        <span [ngClass]=\"row.situac == 'J' ? 'text-error' : resolverItem.class\">\r\n                            {{ resolverItem.text }}\r\n                        </span>\r\n                        } @else {\r\n                        {{ resolverItem.text }}\r\n                        }\r\n                    </td>\r\n                    }\r\n                    }\r\n\r\n                    @default {\r\n                    <td [innerHTML]=\"getHighlight(row._format?.[col.fieldname] ?? row[col.fieldname], col.fieldname)\"\r\n                        [style.width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [style.max-width]=\"col.width ? col.width + 'px' : 'auto'\"\r\n                        [attr.title]=\"row[col.fieldname] || null\"\r\n                        [ngClass]=\"rowClassFn() ? rowClassFn()(row) : getRowClass(row)\" class=\"{{getPosition(col)}}\">\r\n                    </td>\r\n                    }\r\n\r\n                    }\r\n                    }\r\n                    }\r\n                    }\r\n                </tr>\r\n\r\n                @if (idList == expandedRows()) {\r\n                <tr @fadeInOut>\r\n                    <td [attr.colspan]=\"columns().length + (withDetails() ? 1 : 0) + (customActions() ? 1 : 0) + (withCheckbox() ? 1 : 0)\"\r\n                        class=\"table-blank\">\r\n                        <div class=\"d-flex flex-column auditoria\">\r\n                            <span class=\"fw-bold fs-7 text-dark\">Datos de auditor\u00EDa</span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Creaci\u00F3n: {{ row.nomucreac }} el {{ row._format?.fcreac ?? row.fcreac }} a las {{\r\n                                row.hcreac }}\r\n                            </span>\r\n                            <span class=\"fs-6 text-dark fw-bold\">\r\n                                Actualizaci\u00F3n: {{ row.nomuactua }} el {{ row._format?.factua ?? row.factua }} a las\r\n                                {{\r\n                                row.hactua }}\r\n                            </span>\r\n                        </div>\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                }\r\n\r\n                <!-- Fila vac\u00EDa si no hay datos -->\r\n                @if (rowFilter().length === 0) {\r\n                <tr>\r\n                    <td [attr.colspan]=\"columns().length\" class=\"ll-empty\">\r\n                        Sin datos\r\n                    </td>\r\n                </tr>\r\n                }\r\n\r\n                <!-- Spacer inferior: ocupa el espacio de las filas NO renderizadas abajo -->\r\n                @if (paddingBottom() > 0) {\r\n                <tr class=\"ll-spacer\" [style.height.px]=\"paddingBottom()\">\r\n                    <td [attr.colspan]=\"columns().length\"></td>\r\n                </tr>\r\n                }\r\n            </tbody>\r\n\r\n            <!-- \u2500\u2500 FOOTER sticky \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n            @if (withTotal() && rowFilter().length > 0) {\r\n            <tfoot class=\"ll-tfoot\">\r\n\r\n                <tr>\r\n                    <td [attr.colspan]=\"getColspanBeforeTotals()\" class=\"fw-5 fs-6 ps-2 py-2\">Totales:</td>\r\n                    @for (col of columns() ; track $index) {\r\n                    @if (col.totalizable) {\r\n                    <td class=\"ll-footer-cell fw-5 text-end fs-6\">\r\n                        {{ getTotals(col.fieldname)}}\r\n                    </td>\r\n                    }\r\n                    }\r\n                </tr>\r\n            </tfoot>\r\n            }\r\n\r\n        </table>\r\n    </div>\r\n</ng-template>", styles: [":host(.ll-variant--modern) .ll-search-bar .ll-search-label{display:none}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap input.form-control{width:250px!important;min-width:250px!important;border-radius:5px!important;border:1px solid rgba(0,0,0,.12);background-color:#fff;font-size:12px;padding-left:34px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:10px center;background-size:14px 14px;transition:border-color .15s ease,box-shadow .15s ease;height:30px!important;font-weight:400}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap input.form-control::placeholder{color:#9ca3af}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap input.form-control:focus{border-color:#1e293b;box-shadow:0 0 0 3px #1e293b14;outline:none}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap .boton-buscar{border-radius:5px;height:30px!important;width:30px!important;min-width:30px!important;background-color:#fff!important;border:1px solid rgba(0,0,0,.12)!important;color:#546074!important}:host(.ll-variant--modern) .ll-search-bar .ll-search-input-wrap .boton-buscar:hover{background-color:#f3f4f6!important;border-color:#0003!important}:host(.ll-variant--modern) .ll-scroll-container{border-radius:10px!important;border:1px solid rgba(0,0,0,.08);box-shadow:0 1px 3px #0000000f,0 4px 16px #0000000a;background:#fff}:host(.ll-variant--modern) .ll-table{border-collapse:separate;border-spacing:0;background:#fff}:host(.ll-variant--modern) .ll-thead tr th{background-color:#1e293b;color:#f1f5f9!important;border:none;border-right:1px solid white;border-bottom:none;padding:10px 14px;letter-spacing:.06em;font-size:10px!important;font-weight:600;box-shadow:none}:host(.ll-variant--modern) .ll-thead tr th:first-child{border-top-left-radius:10px}:host(.ll-variant--modern) .ll-thead tr th:last-child{border-top-right-radius:10px;border-right:none}:host(.ll-variant--modern) .ll-th-sortable:hover{background-color:#334155!important}:host(.ll-variant--modern) .ll-sort-idle{opacity:.4;color:#f1f5f9}:host(.ll-variant--modern) .ll-row{transition:background-color .1s ease}:host(.ll-variant--modern) .ll-row:nth-child(odd),:host(.ll-variant--modern) .ll-row:nth-child(2n){background-color:#fff}:host(.ll-variant--modern) .ll-row:hover:not(:host(.ll-variant--modern) .ll-row--selected){background-color:#f9fafb!important}:host(.ll-variant--modern) .ll-row--selected{background:var(--table-active-bg)!important;color:var(--table-active-color)!important;box-shadow:inset 4px 0 #334155}:host(.ll-variant--modern) .ll-row--drag-over{background-color:#5b8dee14!important;outline:2px dashed rgba(91,141,238,.5);outline-offset:-2px}:host(.ll-variant--modern) .ll-row td{border-left:none;border-right:none;border-top:none;border-bottom:1px solid rgba(0,0,0,.06);padding:0 14px}:host(.ll-variant--modern) .ll-tfoot tr td:first-child{border-bottom-left-radius:10px}:host(.ll-variant--modern) .ll-tfoot tr td:last-child{border-bottom-right-radius:10px}:host(.ll-variant--modern) .ll-tfoot .ll-footer-cell{background-color:var(--background-card);color:var(--text-color);border:none;border-top:1px solid rgba(0,0,0,.08);padding:10px 14px;box-shadow:none}:host(.ll-variant--modern) .ll-empty{padding:28px;color:#9ca3af;font-size:13px}.ll-search-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.ll-search-bar__left{display:flex;align-items:center;gap:6px;flex:1;flex-wrap:wrap}.ll-search-bar__right{display:flex;align-items:center;gap:4px;flex-shrink:0}.ll-search-bar__right .ll-search-group{display:flex;align-items:center;gap:4px}.ll-search-bar__right .ll-search-group .ll-search-label{white-space:nowrap}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{display:flex;align-items:center}@media (max-width: 576px){.ll-search-bar__right{width:100%;justify-content:space-between}.ll-search-bar__right .ll-search-group{flex-direction:column;align-items:flex-start;width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap{width:100%}.ll-search-bar__right .ll-search-group .ll-search-input-wrap input{flex:1}}.ll-scroll-container{width:100%;overflow-y:auto;overflow-x:auto;display:block;position:relative;border:var(--border-table-header);border-radius:4px;overflow-anchor:none}.ll-table{width:100%;border-collapse:collapse;table-layout:auto;white-space:nowrap}.ll-thead{position:sticky;top:0;z-index:3;background-color:var(--background-header-table)}.ll-thead tr th{font-size:11px;font-weight:700;color:var(--text-color);text-align:start;padding:6px 8px;border:var(--border-table-header);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:var(--background-header-table);box-shadow:0 2px 2px -1px #0000001a}.ll-th-sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.ll-th-sortable:hover{background-color:var(--bs-table-header-hover-bg)!important}.ll-th-content{display:flex;align-items:center;gap:2px}.ll-th-caption{overflow:hidden;text-overflow:ellipsis}.ll-sort-idle{opacity:.25}.ll-tfoot{position:sticky;bottom:0;z-index:3;background-color:var(--background-card)}.ll-tfoot .ll-footer-cell{font-size:11px;color:var(--text-color);padding:10px 8px;border:var(--border-table-header);background-color:var(--background-card);box-shadow:0 -2px 2px -1px #0000001a}.ll-row{height:30px;cursor:pointer}.ll-row:nth-child(odd){background-color:#00000010}.ll-row:hover{background-color:#00000015}.ll-row--selected{background:var(--table-active-bg)!important;color:var(--table-active-color)!important}.ll-row--drag-over{background-color:#5b8dee1f!important;outline:2px dashed #5b8dee;outline-offset:-2px;cursor:copy}.ll-row--drag-over td{color:#5b8dee!important}.ll-row td{font-size:11px;font-weight:500;color:var(--text-color);vertical-align:middle;padding:0 8px;border:var(--border-table-header);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ll-spacer td{padding:0;border:none}.ll-empty{text-align:center;padding:16px;color:#6c757d;font-size:12px}@media (max-width: 1600px){.ll-thead tr th,.ll-row td,.ll-tfoot .ll-footer-cell{font-size:9px}}.popover-menu-column{position:absolute;top:100%;left:0;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto}.popover-title{font-weight:700;margin-bottom:.7rem;margin-left:-.75rem;margin-right:-.75rem;padding:.4rem .75rem;border-bottom:1px solid #7e7e7e;position:sticky;top:0;text-align:center}.popover-menu-column::-webkit-scrollbar{width:5px}.popover-menu-column::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-column::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.popover-menu-filter{position:absolute;top:85%;right:0;background-color:#fff;border:1px solid #ddd;border-radius:.375rem;padding:0rem .75rem;display:block;max-height:300px;width:250px;overflow-y:auto;z-index:2}.popover-menu-filter::-webkit-scrollbar{width:5px}.popover-menu-filter::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.popover-menu-filter::-webkit-scrollbar-thumb{background-color:#d7d7d7;border-radius:4px;border:2px solid transparent}.table-blank{background:var(--background-card)}.auditoria{padding-left:35px;padding-top:8px;padding-bottom:10px}.cw-25{min-width:40px}\n"] }]
         }], propDecorators: { onResize: [{
                 type: HostListener,
                 args: ['window:resize', ['$event']]
@@ -4412,6 +4432,7 @@ class MdGenericoComponent {
     type = input('1');
     content = contentChild('body');
     footer = contentChild('footer');
+    showCancelar = input(true);
     showAlerta = input(false);
     textAlerta = input('La consulta muestra los 100 primeros registros.');
     sizeTitle = input('8');
@@ -4438,11 +4459,11 @@ class MdGenericoComponent {
         this.modalService.dismiss();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MdGenericoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MdGenericoComponent, isStandalone: true, selector: "app-md-generico", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, showAlerta: { classPropertyName: "showAlerta", publicName: "showAlerta", isSignal: true, isRequired: false, transformFunction: null }, textAlerta: { classPropertyName: "textAlerta", publicName: "textAlerta", isSignal: true, isRequired: false, transformFunction: null }, sizeTitle: { classPropertyName: "sizeTitle", publicName: "sizeTitle", isSignal: true, isRequired: false, transformFunction: null }, showFiltro: { classPropertyName: "showFiltro", publicName: "showFiltro", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, dataFiltro: { classPropertyName: "dataFiltro", publicName: "dataFiltro", isSignal: true, isRequired: false, transformFunction: null }, isModal: { classPropertyName: "isModal", publicName: "isModal", isSignal: true, isRequired: false, transformFunction: null }, acceptDisabled: { classPropertyName: "acceptDisabled", publicName: "acceptDisabled", isSignal: true, isRequired: false, transformFunction: null }, validaCierre: { classPropertyName: "validaCierre", publicName: "validaCierre", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { continuar: "continuar", continuar2: "continuar2", cerrar: "cerrar", withFiltro: "withFiltroChange", emitirFiltro: "emitirFiltro" }, queries: [{ propertyName: "content", first: true, predicate: ["body"], descendants: true, isSignal: true }, { propertyName: "footer", first: true, predicate: ["footer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"md-inner\">\r\n    <div class=\"modal-header py-2\">\r\n        <div class=\"w-100\">\r\n            <app-header [isModal]=\"isModal()\" (cerrarModal)=\"cerrarModal()\" [tamanio]=\"sizeTitle()\"\r\n                [showAlerta]=\"showAlerta()\" [textAlerta]=\"textAlerta()\" [title]=\"title()\" [showFiltro]=\"showFiltro()\"\r\n                [hasData]=\"dataFiltro()\" [(withFiltro)]=\"withFiltro\" />\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"modal-body\" [ngClass]=\"{ 'max-height': scrollable() }\">\r\n        <ng-container *ngTemplateOutlet=\"content();\"></ng-container>\r\n    </div>\r\n\r\n    @if( showFooter()){\r\n    <div class=\"modal-footer\">\r\n        @if (footer()) {\r\n        <ng-container *ngTemplateOutlet=\"footer();\"></ng-container>\r\n        }\r\n        @if (type() == '1') {\r\n        <app-button icon=\"adelante\" texto=\"Continuar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '2') {\r\n        <app-button icon=\"guardar\" texto=\"Guardar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '3') {\r\n        <app-button icon=\"imprimir\" texto=\"Imprimir\" color=\"gris\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '4'){\r\n        <app-button icon=\"agregar\" texto=\"Adicionar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '6'){\r\n        <app-button icon=\"check\" texto=\"Actualizar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() != '5'){\r\n        <app-button icon=\"cancelar\" texto=\"Cancelar\" color=\"amarillo\" (accion)=\"cerrarModal()\" />\r\n        }\r\n    </div>\r\n    }\r\n\r\n    @if( type() == 'APROB'){\r\n    <div class=\"modal-footer d-flex justify-content-center\">\r\n        <app-button icon=\"aprobar\" texto=\"Aprobar\" color=\"verde\" (accion)=\"continuar.emit()\" />\r\n        <app-button icon=\"desaprobar\" texto=\"Desaprobar\" color=\"rojo\" (accion)=\"continuar2.emit()\" />\r\n    </div>\r\n    }\r\n</div>", styles: [".md-inner{display:grid;grid-template-rows:auto 1fr auto;height:fit-content;max-height:calc(100dvh - var(--bs-modal-margin) * 2 - 2px);overflow:hidden}.max-height{overflow-y:auto;min-height:0}.modal-body{overflow-x:auto!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: HeaderComponent, selector: "app-header", inputs: ["title", "tamanio", "showFiltro", "withFiltro", "hasData", "isModal", "showAlerta", "textAlerta", "validateSalto"], outputs: ["withFiltroChange", "cerrarModal"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MdGenericoComponent, isStandalone: true, selector: "app-md-generico", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, showCancelar: { classPropertyName: "showCancelar", publicName: "showCancelar", isSignal: true, isRequired: false, transformFunction: null }, showAlerta: { classPropertyName: "showAlerta", publicName: "showAlerta", isSignal: true, isRequired: false, transformFunction: null }, textAlerta: { classPropertyName: "textAlerta", publicName: "textAlerta", isSignal: true, isRequired: false, transformFunction: null }, sizeTitle: { classPropertyName: "sizeTitle", publicName: "sizeTitle", isSignal: true, isRequired: false, transformFunction: null }, showFiltro: { classPropertyName: "showFiltro", publicName: "showFiltro", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, dataFiltro: { classPropertyName: "dataFiltro", publicName: "dataFiltro", isSignal: true, isRequired: false, transformFunction: null }, isModal: { classPropertyName: "isModal", publicName: "isModal", isSignal: true, isRequired: false, transformFunction: null }, acceptDisabled: { classPropertyName: "acceptDisabled", publicName: "acceptDisabled", isSignal: true, isRequired: false, transformFunction: null }, validaCierre: { classPropertyName: "validaCierre", publicName: "validaCierre", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { continuar: "continuar", continuar2: "continuar2", cerrar: "cerrar", withFiltro: "withFiltroChange", emitirFiltro: "emitirFiltro" }, queries: [{ propertyName: "content", first: true, predicate: ["body"], descendants: true, isSignal: true }, { propertyName: "footer", first: true, predicate: ["footer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"md-inner\">\r\n    <div class=\"modal-header py-2\">\r\n        <div class=\"w-100\">\r\n            <app-header [isModal]=\"isModal()\" (cerrarModal)=\"cerrarModal()\" [tamanio]=\"sizeTitle()\"\r\n                [showAlerta]=\"showAlerta()\" [textAlerta]=\"textAlerta()\" [title]=\"title()\" [showFiltro]=\"showFiltro()\"\r\n                [hasData]=\"dataFiltro()\" [(withFiltro)]=\"withFiltro\" />\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"modal-body\" [ngClass]=\"{ 'max-height': scrollable() }\">\r\n        <ng-container *ngTemplateOutlet=\"content();\"></ng-container>\r\n    </div>\r\n\r\n    @if( showFooter()){\r\n    <div class=\"modal-footer\">\r\n        @if (footer()) {\r\n        <ng-container *ngTemplateOutlet=\"footer();\"></ng-container>\r\n        }\r\n        @if (type() == '1') {\r\n        <app-button icon=\"adelante\" texto=\"Continuar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '2') {\r\n        <app-button icon=\"guardar\" texto=\"Guardar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '3') {\r\n        <app-button icon=\"imprimir\" texto=\"Imprimir\" color=\"gris\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '4'){\r\n        <app-button icon=\"agregar\" texto=\"Adicionar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '6'){\r\n        <app-button icon=\"check\" texto=\"Actualizar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if(showCancelar()){\r\n        <app-button icon=\"cancelar\" texto=\"Cancelar\" color=\"amarillo\" (accion)=\"cerrarModal()\" />\r\n        }\r\n    </div>\r\n    }\r\n\r\n    @if( type() == 'APROB'){\r\n    <div class=\"modal-footer d-flex justify-content-center\">\r\n        <app-button icon=\"aprobar\" texto=\"Aprobar\" color=\"verde\" (accion)=\"continuar.emit()\" />\r\n        <app-button icon=\"desaprobar\" texto=\"Desaprobar\" color=\"rojo\" (accion)=\"continuar2.emit()\" />\r\n    </div>\r\n    }\r\n</div>", styles: [".md-inner{display:grid;grid-template-rows:auto 1fr auto;height:fit-content;max-height:calc(100dvh - var(--bs-modal-margin) * 2 - 2px);overflow:hidden}.max-height{overflow-y:auto;min-height:0}.modal-body{overflow-x:auto!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: HeaderComponent, selector: "app-header", inputs: ["title", "tamanio", "showFiltro", "withFiltro", "hasData", "isModal", "showAlerta", "textAlerta", "validateSalto"], outputs: ["withFiltroChange", "cerrarModal"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MdGenericoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-md-generico', imports: [NgClass, NgTemplateOutlet, HeaderComponent, ButtonComponent], template: "<div class=\"md-inner\">\r\n    <div class=\"modal-header py-2\">\r\n        <div class=\"w-100\">\r\n            <app-header [isModal]=\"isModal()\" (cerrarModal)=\"cerrarModal()\" [tamanio]=\"sizeTitle()\"\r\n                [showAlerta]=\"showAlerta()\" [textAlerta]=\"textAlerta()\" [title]=\"title()\" [showFiltro]=\"showFiltro()\"\r\n                [hasData]=\"dataFiltro()\" [(withFiltro)]=\"withFiltro\" />\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"modal-body\" [ngClass]=\"{ 'max-height': scrollable() }\">\r\n        <ng-container *ngTemplateOutlet=\"content();\"></ng-container>\r\n    </div>\r\n\r\n    @if( showFooter()){\r\n    <div class=\"modal-footer\">\r\n        @if (footer()) {\r\n        <ng-container *ngTemplateOutlet=\"footer();\"></ng-container>\r\n        }\r\n        @if (type() == '1') {\r\n        <app-button icon=\"adelante\" texto=\"Continuar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '2') {\r\n        <app-button icon=\"guardar\" texto=\"Guardar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '3') {\r\n        <app-button icon=\"imprimir\" texto=\"Imprimir\" color=\"gris\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '4'){\r\n        <app-button icon=\"agregar\" texto=\"Adicionar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '6'){\r\n        <app-button icon=\"check\" texto=\"Actualizar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() != '5'){\r\n        <app-button icon=\"cancelar\" texto=\"Cancelar\" color=\"amarillo\" (accion)=\"cerrarModal()\" />\r\n        }\r\n    </div>\r\n    }\r\n\r\n    @if( type() == 'APROB'){\r\n    <div class=\"modal-footer d-flex justify-content-center\">\r\n        <app-button icon=\"aprobar\" texto=\"Aprobar\" color=\"verde\" (accion)=\"continuar.emit()\" />\r\n        <app-button icon=\"desaprobar\" texto=\"Desaprobar\" color=\"rojo\" (accion)=\"continuar2.emit()\" />\r\n    </div>\r\n    }\r\n</div>", styles: [".md-inner{display:grid;grid-template-rows:auto 1fr auto;height:fit-content;max-height:calc(100dvh - var(--bs-modal-margin) * 2 - 2px);overflow:hidden}.max-height{overflow-y:auto;min-height:0}.modal-body{overflow-x:auto!important}\n"] }]
+            args: [{ selector: 'app-md-generico', imports: [NgClass, NgTemplateOutlet, HeaderComponent, ButtonComponent], template: "<div class=\"md-inner\">\r\n    <div class=\"modal-header py-2\">\r\n        <div class=\"w-100\">\r\n            <app-header [isModal]=\"isModal()\" (cerrarModal)=\"cerrarModal()\" [tamanio]=\"sizeTitle()\"\r\n                [showAlerta]=\"showAlerta()\" [textAlerta]=\"textAlerta()\" [title]=\"title()\" [showFiltro]=\"showFiltro()\"\r\n                [hasData]=\"dataFiltro()\" [(withFiltro)]=\"withFiltro\" />\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"modal-body\" [ngClass]=\"{ 'max-height': scrollable() }\">\r\n        <ng-container *ngTemplateOutlet=\"content();\"></ng-container>\r\n    </div>\r\n\r\n    @if( showFooter()){\r\n    <div class=\"modal-footer\">\r\n        @if (footer()) {\r\n        <ng-container *ngTemplateOutlet=\"footer();\"></ng-container>\r\n        }\r\n        @if (type() == '1') {\r\n        <app-button icon=\"adelante\" texto=\"Continuar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '2') {\r\n        <app-button icon=\"guardar\" texto=\"Guardar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if (type() == '3') {\r\n        <app-button icon=\"imprimir\" texto=\"Imprimir\" color=\"gris\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '4'){\r\n        <app-button icon=\"agregar\" texto=\"Adicionar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if( type() == '6'){\r\n        <app-button icon=\"check\" texto=\"Actualizar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n            [disabled]=\"acceptDisabled()\" />\r\n        }\r\n        @if(showCancelar()){\r\n        <app-button icon=\"cancelar\" texto=\"Cancelar\" color=\"amarillo\" (accion)=\"cerrarModal()\" />\r\n        }\r\n    </div>\r\n    }\r\n\r\n    @if( type() == 'APROB'){\r\n    <div class=\"modal-footer d-flex justify-content-center\">\r\n        <app-button icon=\"aprobar\" texto=\"Aprobar\" color=\"verde\" (accion)=\"continuar.emit()\" />\r\n        <app-button icon=\"desaprobar\" texto=\"Desaprobar\" color=\"rojo\" (accion)=\"continuar2.emit()\" />\r\n    </div>\r\n    }\r\n</div>", styles: [".md-inner{display:grid;grid-template-rows:auto 1fr auto;height:fit-content;max-height:calc(100dvh - var(--bs-modal-margin) * 2 - 2px);overflow:hidden}.max-height{overflow-y:auto;min-height:0}.modal-body{overflow-x:auto!important}\n"] }]
         }] });
 
 class AlertService {
@@ -5279,5 +5300,5 @@ function handleResourceV2(fn, signal) {
  * Generated bundle index. Do not edit.
  */
 
-export { AlertConfirmationComponent, AlertConfirmationConfig, AlertConfirmationService, AlertErrorComponent, AlertErrorService, AlertService, AlertaComponent, Almacenes, AnimatedCheckboxDirective, AtajosDirective, AutocompleteComponent, AutocompleteV2Component, BadgeComponent, ButtonComponent, ButtonProperties, CaracteresCodigoDirective, CardMobileComponent, CheckBoxComponent, Cobradores, DecimalDirective, DetalleCreditoComponent, Direcciones, DobleInputComponent, DropdownCdkComponent, DropdownComponent, DropdownMenuComponent, DropdownOption, FilterToggleComponent, FormateadorService, HeaderComponent, InputClaseComponent, InputComponent, InputDinamicoComponent, InputRadioComponent, ListOptionComponent, ListSituacionesComponent, MdGenericoComponent, Monedas, MontosCalcularComponent, Motivos, MultiSelectDropdownComponent, MultiselectedComponent, NavTabsComponent, OnlyNumberDirective, OnlyNumberFlexDirective, PaginadorComponent, RadioComponent, Recursos, Series, SidebarComponent, SpinnerComponent, SwitchActivoComponent, SwitchComponent, TABLE_EVENTS, TBanco, TabItemComponent, TableAdvanceComponent, TableAdvanceOptimizadaComponent, TableAgrupadaComponent, TableBusquedaComponent, TableData, TableDetalleComponent, TableSimpleComponent, TableUltimateComponent, TipoDocumento, ToastService, ToasterComponent, Transportista, Vendedor, configModal, getInputsObligatorios, handleEmptyResult, handleErrorsApi, handleModal, handleModalReturn, handleReset, handleResetNoSignal, handleResource, handleResourceV2, handleSuccessApi, handleSuccessResult, showError, throwIfEmptyArray, validaFecha, validaLista, validaMes, validaPeriodo, validaPeriodoSimple, validaPosicion, validaTipo, validarObligatorio, validarSituacion };
+export { AlertConfirmationComponent, AlertConfirmationConfig, AlertConfirmationService, AlertErrorComponent, AlertErrorService, AlertService, AlertaComponent, Almacenes, AnimatedCheckboxDirective, AtajosDirective, AutocompleteComponent, AutocompleteV2Component, BadgeComponent, ButtonComponent, ButtonProperties, CaracteresCodigoDirective, CardMobileComponent, CheckBoxComponent, Cobradores, DecimalDirective, DetalleCreditoComponent, Direcciones, DobleInputComponent, DropdownCdkComponent, DropdownComponent, DropdownMenuComponent, DropdownOption, FilterToggleComponent, FormateadorService, HeaderComponent, InputClaseComponent, InputComponent, InputDinamicoComponent, InputRadioComponent, ListOptionComponent, ListSituacionesComponent, MdGenericoComponent, Monedas, MontosCalcularComponent, Motivos, MultiSelectDropdownComponent, MultiselectedComponent, NavTabsComponent, OnlyNumberDirective, OnlyNumberFlexDirective, PaginadorComponent, RadioComponent, Recursos, Series, SidebarComponent, SpinnerComponent, SwitchActivoComponent, SwitchComponent, TABLE_EVENTS, TBanco, TabItemComponent, TableAdvanceComponent, TableAdvanceOptimizadaComponent, TableAgrupadaComponent, TableBusquedaComponent, TableData, TableDetalleComponent, TableSimpleComponent, TableUltimateComponent, TipoDocumento, ToastService, ToasterComponent, Transportista, TsiColumnDefDirective, Vendedor, configModal, getInputsObligatorios, handleEmptyResult, handleErrorsApi, handleModal, handleModalReturn, handleReset, handleResetNoSignal, handleResource, handleResourceV2, handleSuccessApi, handleSuccessResult, showError, throwIfEmptyArray, validaFecha, validaLista, validaMes, validaPeriodo, validaPeriodoSimple, validaPosicion, validaTipo, validarObligatorio, validarSituacion };
 //# sourceMappingURL=ng-components-tsi.mjs.map