@jvsoft/components 0.0.3 → 0.0.4

package/fesm2022/jvsoft-components-tabla-mantenimiento.mjs

@@ -1,12 +1,18 @@
 import { __decorate } from 'tslib';
-import * as i0 from '@angular/core';
-import { Input, ViewChild, Optional, Component, inject, Pipe, NgModule, EventEmitter, ContentChildren, ViewChildren, Output, HostListener, Directive, Injectable, ElementRef, HostBinding } from '@angular/core';
+import { trigger, state, transition, style, animate } from '@angular/animations';
+import { TemplatePortal } from '@angular/cdk/portal';
 import * as i1 from '@angular/common';
 import { CommonModule, DecimalPipe } from '@angular/common';
+import * as i0 from '@angular/core';
+import { EventEmitter, HostListener, Output, Input, Directive, ViewChild, Optional, Component, inject, Pipe, NgModule, ContentChildren, ViewChildren, Injectable, ElementRef, HostBinding } from '@angular/core';
 import * as i1$2 from '@angular/forms';
-import { ReactiveFormsModule, FormsModule, Validators, FormControl, FormGroup } from '@angular/forms';
+import { Validators, FormControl, FormGroup, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import * as i14 from '@angular/material/badge';
+import { MatBadgeModule } from '@angular/material/badge';
 import * as i3$1 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
+import * as i5$1 from '@angular/material/core';
+import { MatRipple, MatRippleModule } from '@angular/material/core';
 import * as i6 from '@angular/material/divider';
 import { MatDividerModule } from '@angular/material/divider';
 import * as i5 from '@angular/material/icon';
@@ -15,28 +21,292 @@ import * as i8 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
 import * as i9 from '@angular/material/paginator';
 import { MatPaginatorModule, MatPaginator, MAT_PAGINATOR_DEFAULT_OPTIONS } from '@angular/material/paginator';
-import * as i5$1 from '@angular/material/core';
-import { MatRipple, MatRippleModule } from '@angular/material/core';
 import * as i3 from '@angular/material/sort';
 import { MatSortModule, MatSort } from '@angular/material/sort';
 import * as i2 from '@angular/material/table';
 import { MatColumnDef, MatTable, MatTableModule, MatTableDataSource, MatFooterRow, MatRow } from '@angular/material/table';
 import * as i4 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { Subject, takeUntil, of, fromEvent } from 'rxjs';
-import shortHash from 'shorthash2';
 import { untilDestroyed, UntilDestroy } from '@ngneat/until-destroy';
+import moment from 'moment';
+import { Subject, takeUntil, of, fromEvent } from 'rxjs';
 import { map, filter, take } from 'rxjs/operators';
-import { TemplatePortal } from '@angular/cdk/portal';
-import { trigger, state, transition, style, animate } from '@angular/animations';
+import shortHash from 'shorthash2';
 import * as i1$1 from '@angular/platform-browser';
 import { DomSanitizer } from '@angular/platform-browser';
-import * as i14 from '@angular/material/badge';
-import { MatBadgeModule } from '@angular/material/badge';
-import moment from 'moment';
 import * as XLSX from 'xlsx';
 import * as i2$1 from '@angular/cdk/overlay';
 
+function buscarEnArray(coleccion, idBuscar, dato) {
+    if (!Array.isArray(coleccion) || coleccion.length === 0)
+        return null; // 🔹 Validación de entrada
+    return Array.isArray(idBuscar)
+        ? coleccion.find(item => idBuscar.every((campo, idx) => item[campo] === dato[idx])) || null
+        : coleccion.find(item => item[idBuscar] === dato) || null;
+}
+function formatearFecha(val, hora = '00:00:00') {
+    if (val) {
+        if (val.length <= 10) {
+            val = val + ' ' + hora;
+        }
+        return new Date(val);
+    }
+    return val;
+}
+function esNumero(value) {
+    return !isNaN(Number(value));
+}
+function capitalizarTexto(texto) {
+    texto = texto.replace(/_/g, ' ');
+    texto = texto.replace(/-/g, ' ');
+    const textoCortado = texto.split(' ');
+    const nText = [];
+    textoCortado.forEach(textActual => {
+        nText.push(textActual.charAt(0).toUpperCase() + textActual.slice(1));
+    });
+    return nText.join(' ');
+}
+function getBrowserName() {
+    const agent = window.navigator.userAgent.toLowerCase();
+    switch (true) {
+        case agent.indexOf('edge') > -1:
+            return 'edge';
+        case agent.indexOf('opr') > -1 && !!window.opr:
+            return 'opera';
+        case agent.indexOf('chrome') > -1 && !!window.chrome:
+            return 'chrome';
+        case agent.indexOf('trident') > -1:
+            return 'ie';
+        case agent.indexOf('firefox') > -1:
+            return 'firefox';
+        case agent.indexOf('safari') > -1:
+            return 'safari';
+        default:
+            return 'other';
+    }
+}
+
+class DataModel {
+    modelosChk = {}; // Usar any para valores dinámicos
+    checkbox;
+    constructor() {
+        this.checkbox = new ForCheckboxModel(this);
+    }
+    generarId(row, campoValor, separador = '') {
+        if (typeof campoValor == 'string') {
+            campoValor = [campoValor];
+        }
+        return campoValor.map(data => row[data]).join(separador);
+    }
+    // Agrega controles al objeto modelosChk
+    agregarControles(lista, idLista, limpiar = true, campoValor = null, campoValorSeparador = '') {
+        if (limpiar) {
+            this.modelosChk = {};
+        }
+        const asignarValor = (dat, idLista, campoValor, key) => {
+            if (!key) {
+                key = dat[idLista] + (campoValor.includes('.') ? '' : `.${campoValor}`);
+            }
+            const mat = campoValor.match(/^([in])[A-Z][a-zA-Z]+/);
+            if (mat) {
+                this.modelosChk[key] = dat[campoValor] * 1;
+            }
+            else {
+                this.modelosChk[key] = dat[campoValor];
+            }
+        };
+        lista.forEach(dat => {
+            if (campoValor === null) {
+                // Caso 1: Sin campoValor, se asigna false
+                this.modelosChk[dat[idLista]] = false;
+            }
+            else if (typeof campoValor === 'string') {
+                // Caso 2: campoValor es un string
+                asignarValor(dat, idLista, campoValor, dat[idLista]);
+            }
+            else if (campoValorSeparador) {
+                const idStr = this.generarId(dat, campoValor, campoValorSeparador);
+                // Caso 2: campoValor es un string
+                asignarValor(dat, idLista, '.', idStr);
+            }
+            else {
+                // Caso 3: campoValor es un array de strings
+                campoValor.forEach(data => asignarValor(dat, idLista, data));
+            }
+        });
+    }
+    // Establece el estado de un índice
+    setState(idx, state) {
+        this.modelosChk[idx] = state;
+    }
+    // Obtiene el estado de un índice
+    getState(idx) {
+        return this.modelosChk[idx];
+    }
+    getDataMultiple(idx) {
+        const camposMod = Object.keys(this.modelosChk).filter(key => key.split('.')[0] == idx);
+        const vRet = {};
+        camposMod.forEach(key => {
+            vRet[key.split('.')[1]] = this.modelosChk[key];
+        });
+        return vRet;
+    }
+    // Genera una lista basada en el estado de los índices
+    generarLista(tipoRetorno = null, esCampoNumerico = false) {
+        const strLista = [];
+        const objLista = {};
+        Object.keys(this.modelosChk).forEach(key => {
+            if ((esCampoNumerico && esNumero(this.modelosChk[key])) ||
+                (this.modelosChk[key])) {
+                strLista.push(key);
+                objLista[key] = this.modelosChk[key];
+            }
+        });
+        if (tipoRetorno === 'array') {
+            return strLista;
+        }
+        if (tipoRetorno === 'object') {
+            return objLista;
+        }
+        return strLista.join(',');
+    }
+    generarFormGroupFromModelosChk(tipo) {
+        const formGroupObj = {};
+        let validadores = [];
+        if (tipo == 'number') {
+            validadores = [
+                Validators.required,
+                Validators.min(1)
+            ];
+        }
+        Object.keys(this.modelosChk).forEach(key => {
+            formGroupObj[key] = new FormControl(this.modelosChk[key], validadores);
+        });
+        return new FormGroup(formGroupObj);
+        // return this.formBuilder.group(formGroupObj);
+    }
+}
+class ForCheckboxModel {
+    modeloCheck;
+    constructor(modeloCheck) {
+        this.modeloCheck = modeloCheck;
+    }
+    get cantidadActivos() {
+        return Object.values(this.modeloCheck.modelosChk).filter(Boolean).length;
+    }
+    get existenActivados() {
+        return this.cantidadActivos > 0;
+    }
+    get todosActivos() {
+        const total = Object.keys(this.modeloCheck.modelosChk).length;
+        const activos = this.cantidadActivos;
+        return activos > 0 && total === activos;
+    }
+    get algunosActivos() {
+        const total = Object.keys(this.modeloCheck.modelosChk).length;
+        const activos = this.cantidadActivos;
+        return activos > 0 && total !== activos;
+    }
+    establecerTodos(activo) {
+        Object.keys(this.modeloCheck.modelosChk).forEach(idx => this.modeloCheck.modelosChk[idx] = activo);
+    }
+}
+
+class MatRowKeyboardSelectionDirective {
+    el;
+    rows;
+    renderedData;
+    tabla; // Entrada: Referencia a la tabla
+    rowModel; // Entrada: Modelo de fila actual
+    seleccionarSiguiente = new EventEmitter(); // Salida: Evento al seleccionar siguiente
+    unsubscriber$ = new Subject();
+    constructor(el) {
+        this.el = el;
+    }
+    ngOnInit() {
+        // Asignar tabindex si no está definido
+        if (this.el.nativeElement.tabIndex < 0) {
+            this.el.nativeElement.tabIndex = 0;
+        }
+        // Obtener la fuente de datos de la tabla
+        const dataSource = this.tabla.dataSource;
+        // Suscribirse a los cambios en los datos
+        dataSource.connect().pipe(takeUntil(this.unsubscriber$)).subscribe(data => {
+            this.renderedData = data;
+            this.rows = Array.from(this.getTableRows());
+        });
+    }
+    ngOnDestroy() {
+        // Finalizar la suscripción al destruir la directiva
+        this.unsubscriber$.next(null);
+        this.unsubscriber$.complete();
+    }
+    onKeydown(event) {
+        var element = event.target;
+        if (element.tagName === "INPUT") {
+            event.stopPropagation();
+        }
+        else {
+            const currentIndex = this.renderedData.findIndex(row => row === this.rowModel);
+            const eRef = event.target;
+            this.rows = this.rows.filter(elem => elem.hasAttribute('id'));
+            const arrayFilas = Array.from(this.rows);
+            const fElem = arrayFilas.filter(elem => elem.id == eRef.id).pop();
+            const cElemIdx = arrayFilas.findIndex(elem => elem == fElem);
+            let newRow;
+            // Controlar las teclas presionadas
+            switch (event.key) {
+                case 'ArrowDown':
+                    newRow = this.rows[cElemIdx + 1];
+                    break;
+                case 'ArrowUp':
+                    newRow = this.rows[cElemIdx - 1];
+                    break;
+                case 'Enter':
+                case ' ':
+                    this.seleccionarSiguiente.next(this.renderedData[currentIndex]);
+                    event.preventDefault();
+                    break;
+            }
+            // Enfocar la nueva fila seleccionada
+            if (newRow) {
+                newRow.classList.add('estaFocus');
+                newRow.focus();
+            }
+        }
+    }
+    getTableRows() {
+        let el = this.el.nativeElement;
+        // Recorrer los elementos padres hasta encontrar la tabla
+        while (el && el.parentNode) {
+            el = el.parentNode;
+            // Verificar si es una tabla de material
+            if (el.tagName && el.tagName.toLowerCase() === 'mat-table' || el.hasAttribute('mat-table')) {
+                return el.querySelectorAll('mat-row, tr[mat-row]');
+            }
+        }
+        return undefined;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MatRowKeyboardSelectionDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.7", type: MatRowKeyboardSelectionDirective, isStandalone: true, selector: "[matRowKeyboardSelection]", inputs: { tabla: ["matRowKeyboardSelection", "tabla"], rowModel: "rowModel" }, outputs: { seleccionarSiguiente: "seleccionarSiguiente" }, host: { listeners: { "keydown": "onKeydown($event)" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MatRowKeyboardSelectionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[matRowKeyboardSelection]'
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { tabla: [{
+                type: Input,
+                args: ['matRowKeyboardSelection']
+            }], rowModel: [{
+                type: Input
+            }], seleccionarSiguiente: [{
+                type: Output
+            }], onKeydown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
+            }] } });
+
 class ColumnTypeComponent {
     table;
     column;
@@ -378,300 +648,122 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
                         ColumnTypeMoneyComponent,
                         ColumnTypeNumberComponent,
                         ColumnTypeDateComponent,
-                        ColumnTypeIconsComponent,
-                        ColumnTypeSinoComponent,
-                        ColumnTypeProgressbarComponent,
-                    ]
-                }]
-        }] });
-
-class TablaMantenimientoColumnDefsComponent {
-    table;
-    cdRef;
-    objThis;
-    nombreColeccion;
-    colDetalle;
-    chkLista; // = new DataModel();
-    chkListaChange = new EventEmitter();
-    columnDefLocales;
-    columnDefEnSubComponentes;
-    constructor(table, cdRef) {
-        this.table = table;
-        this.cdRef = cdRef;
-    }
-    ngAfterContentInit() {
-        if (this.table) {
-            console.log('ngAfterContentInit');
-            console.log(this.columnDefEnSubComponentes);
-            console.log(this.columnDefLocales);
-            this.cdRef.detectChanges();
-            this.columnDefEnSubComponentes.forEach(refCol => {
-                this.table.addColumnDef(refCol);
-            });
-            this.columnDefLocales.forEach(refCol => {
-                this.table.addColumnDef(refCol);
-            });
-        }
-    }
-    trackByProperty(index, column) {
-        return column.property;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoColumnDefsComponent, deps: [{ token: i2.MatTable, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: TablaMantenimientoColumnDefsComponent, isStandalone: true, selector: "jvs-tabla-mantenimiento-column-defs", inputs: { objThis: "objThis", nombreColeccion: "nombreColeccion", colDetalle: "colDetalle", chkLista: "chkLista" }, outputs: { chkListaChange: "chkListaChange" }, queries: [{ propertyName: "columnDefEnSubComponentes", predicate: MatColumnDef, descendants: true }], viewQueries: [{ propertyName: "columnDefLocales", predicate: MatColumnDef, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n\n\n\n<ng-container *ngFor=\"let column of colDetalle; trackBy: trackByProperty\">\n\n    <ng-container *ngIf=\"column.type === 'expandir'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef class=\"w-4\" mat-header-cell> <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span></th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"column.click\"\n                (click)=\"column.click(row); row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"!column.click\"\n                (click)=\"row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'checkbox'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"w-4 text-center\" mat-header-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"chkLista.checkbox.establecerTodos($event.checked)\"\n                [indeterminate]=\"chkLista.checkbox.algunosActivos\"\n                [checked]=\"chkLista.checkbox.todosActivos\"\n            ></mat-checkbox>\n        </th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                [(ngModel)]=\"chkLista.modelosChk[chkLista.generarId(row, (column.chkField ?? column.property), column.chkFieldSeparador)]\"\n                [ngModelOptions]=\"{standalone: true}\"\n            ></mat-checkbox>\n\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'estiloEstablecido'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"uppercase text-center\" mat-header-cell\n            mat-sort-header\n            [disabled]=\"column.sort === false\">\n            <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span>\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </th>\n        <td *matCellDef=\"let row\" [ngClass]=\"column.cssClasses\" mat-cell>\n            {{ column.property }}\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </td>\n        <th *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" style=\"height: unset !important;\" mat-footer-cell\n            [innerHTML]=\"column.transformarFooter ? column.transformarFooter() : ''\">\n        </th>\n\n    </ng-container>\n\n    <jvs-column-type-text  *ngIf=\"column.type == 'text'\" [column]=\"column\"></jvs-column-type-text>\n    <jvs-column-type-money *ngIf=\"column.type == 'money'\" [column]=\"column\"></jvs-column-type-money>\n    <jvs-column-type-number *ngIf=\"column.type == 'number'\" [column]=\"column\"></jvs-column-type-number>\n    <jvs-column-type-date *ngIf=\"column.type == 'date'\" [column]=\"column\"></jvs-column-type-date>\n    <jvs-column-type-icons *ngIf=\"column.type == 'icons'\" [column]=\"column\"></jvs-column-type-icons>\n    <jvs-column-type-sino *ngIf=\"column.type == 'yes_no'\" [column]=\"column\"></jvs-column-type-sino>\n    <jvs-column-type-progressbar *ngIf=\"column.type == 'progress'\" [column]=\"column\"></jvs-column-type-progressbar>\n\n\n\n</ng-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i5$1.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "component", type: i3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i2.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColumnTypeModule }, { kind: "component", type: ColumnTypeTextComponent, selector: "jvs-column-type-text", inputs: ["column"] }, { kind: "component", type: ColumnTypeMoneyComponent, selector: "jvs-column-type-money", inputs: ["column"] }, { kind: "component", type: ColumnTypeNumberComponent, selector: "jvs-column-type-number", inputs: ["column"] }, { kind: "component", type: ColumnTypeDateComponent, selector: "jvs-column-type-date", inputs: ["column"] }, { kind: "component", type: ColumnTypeIconsComponent, selector: "jvs-column-type-icons", inputs: ["column"] }, { kind: "component", type: ColumnTypeSinoComponent, selector: "jvs-column-type-sino", inputs: ["column"] }, { kind: "component", type: ColumnTypeProgressbarComponent, selector: "jvs-column-type-progressbar", inputs: ["column"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoColumnDefsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'jvs-tabla-mantenimiento-column-defs', standalone: true, imports: [
-                        CommonModule,
-                        MatCheckboxModule,
-                        MatIconModule,
-                        MatRippleModule,
-                        MatSortModule,
-                        MatTableModule,
-                        MatTooltipModule,
-                        ReactiveFormsModule,
-                        FormsModule,
-                        ColumnTypeModule,
-                    ], template: "<ng-content></ng-content>\n\n\n\n<ng-container *ngFor=\"let column of colDetalle; trackBy: trackByProperty\">\n\n    <ng-container *ngIf=\"column.type === 'expandir'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef class=\"w-4\" mat-header-cell> <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span></th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"column.click\"\n                (click)=\"column.click(row); row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"!column.click\"\n                (click)=\"row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'checkbox'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"w-4 text-center\" mat-header-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"chkLista.checkbox.establecerTodos($event.checked)\"\n                [indeterminate]=\"chkLista.checkbox.algunosActivos\"\n                [checked]=\"chkLista.checkbox.todosActivos\"\n            ></mat-checkbox>\n        </th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                [(ngModel)]=\"chkLista.modelosChk[chkLista.generarId(row, (column.chkField ?? column.property), column.chkFieldSeparador)]\"\n                [ngModelOptions]=\"{standalone: true}\"\n            ></mat-checkbox>\n\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'estiloEstablecido'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"uppercase text-center\" mat-header-cell\n            mat-sort-header\n            [disabled]=\"column.sort === false\">\n            <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span>\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </th>\n        <td *matCellDef=\"let row\" [ngClass]=\"column.cssClasses\" mat-cell>\n            {{ column.property }}\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </td>\n        <th *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" style=\"height: unset !important;\" mat-footer-cell\n            [innerHTML]=\"column.transformarFooter ? column.transformarFooter() : ''\">\n        </th>\n\n    </ng-container>\n\n    <jvs-column-type-text  *ngIf=\"column.type == 'text'\" [column]=\"column\"></jvs-column-type-text>\n    <jvs-column-type-money *ngIf=\"column.type == 'money'\" [column]=\"column\"></jvs-column-type-money>\n    <jvs-column-type-number *ngIf=\"column.type == 'number'\" [column]=\"column\"></jvs-column-type-number>\n    <jvs-column-type-date *ngIf=\"column.type == 'date'\" [column]=\"column\"></jvs-column-type-date>\n    <jvs-column-type-icons *ngIf=\"column.type == 'icons'\" [column]=\"column\"></jvs-column-type-icons>\n    <jvs-column-type-sino *ngIf=\"column.type == 'yes_no'\" [column]=\"column\"></jvs-column-type-sino>\n    <jvs-column-type-progressbar *ngIf=\"column.type == 'progress'\" [column]=\"column\"></jvs-column-type-progressbar>\n\n\n\n</ng-container>\n" }]
-        }], ctorParameters: () => [{ type: i2.MatTable, decorators: [{
-                    type: Optional
-                }] }, { type: i0.ChangeDetectorRef }], propDecorators: { objThis: [{
-                type: Input
-            }], nombreColeccion: [{
-                type: Input
-            }], colDetalle: [{
-                type: Input
-            }], chkLista: [{
-                type: Input
-            }], chkListaChange: [{
-                type: Output
-            }], columnDefLocales: [{
-                type: ViewChildren,
-                args: [MatColumnDef]
-            }], columnDefEnSubComponentes: [{
-                type: ContentChildren,
-                args: [MatColumnDef, { descendants: true }]
-            }] } });
-
-class TablaMantenimientoMenuComponent {
-    objThis;
-    nombreColeccion;
-    item;
-    derechosActuales;
-    // @Input() modalPrincipal;
-    // @Input() botonDisabled = (btn: BotonMantenimiento, item: any) => [];
-    opcionSelecionada = new EventEmitter();
-    menu;
-    subItems;
-    botonTemplate;
-    constructor() {
-    }
-    ngOnInit() {
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: TablaMantenimientoMenuComponent, isStandalone: true, selector: "jvs-tabla-mantenimiento-menu", inputs: { objThis: "objThis", nombreColeccion: "nombreColeccion", item: "item", derechosActuales: "derechosActuales", subItems: "subItems", botonTemplate: "botonTemplate" }, outputs: { opcionSelecionada: "opcionSelecionada" }, viewQueries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true, static: true }], ngImport: i0, template: "<mat-menu #menu=\"matMenu\">\n    <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual w-full\">\n        <ng-container *ngFor=\"let btn of subItems\">\n            <ng-container *ngTemplateOutlet=\"botonTemplate; context:{btn: btn, item: objThis['seleccionados'][nombreColeccion], barraSuperior: false}\"></ng-container>\n        </ng-container>\n    </div>\n</mat-menu>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoMenuComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'jvs-tabla-mantenimiento-menu', standalone: true, imports: [
-                        CommonModule,
-                        MatMenuModule,
-                    ], template: "<mat-menu #menu=\"matMenu\">\n    <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual w-full\">\n        <ng-container *ngFor=\"let btn of subItems\">\n            <ng-container *ngTemplateOutlet=\"botonTemplate; context:{btn: btn, item: objThis['seleccionados'][nombreColeccion], barraSuperior: false}\"></ng-container>\n        </ng-container>\n    </div>\n</mat-menu>\n" }]
-        }], ctorParameters: () => [], propDecorators: { objThis: [{
-                type: Input
-            }], nombreColeccion: [{
-                type: Input
-            }], item: [{
-                type: Input
-            }], derechosActuales: [{
-                type: Input
-            }], opcionSelecionada: [{
-                type: Output
-            }], menu: [{
-                type: ViewChild,
-                args: ['menu', { static: true }]
-            }], subItems: [{
-                type: Input,
-                args: [{ required: true }]
-            }], botonTemplate: [{
-                type: Input,
-                args: [{ required: true }]
-            }] } });
-
-function buscarEnArray(coleccion, idBuscar, dato) {
-    if (!Array.isArray(coleccion) || coleccion.length === 0)
-        return null; // 🔹 Validación de entrada
-    return Array.isArray(idBuscar)
-        ? coleccion.find(item => idBuscar.every((campo, idx) => item[campo] === dato[idx])) || null
-        : coleccion.find(item => item[idBuscar] === dato) || null;
-}
-function formatearFecha(val, hora = '00:00:00') {
-    if (val) {
-        if (val.length <= 10) {
-            val = val + ' ' + hora;
-        }
-        return new Date(val);
-    }
-    return val;
-}
-function esNumero(value) {
-    return !isNaN(Number(value));
-}
-function capitalizarTexto(texto) {
-    texto = texto.replace(/_/g, ' ');
-    texto = texto.replace(/-/g, ' ');
-    const textoCortado = texto.split(' ');
-    const nText = [];
-    textoCortado.forEach(textActual => {
-        nText.push(textActual.charAt(0).toUpperCase() + textActual.slice(1));
-    });
-    return nText.join(' ');
-}
-function getBrowserName() {
-    const agent = window.navigator.userAgent.toLowerCase();
-    switch (true) {
-        case agent.indexOf('edge') > -1:
-            return 'edge';
-        case agent.indexOf('opr') > -1 && !!window.opr:
-            return 'opera';
-        case agent.indexOf('chrome') > -1 && !!window.chrome:
-            return 'chrome';
-        case agent.indexOf('trident') > -1:
-            return 'ie';
-        case agent.indexOf('firefox') > -1:
-            return 'firefox';
-        case agent.indexOf('safari') > -1:
-            return 'safari';
-        default:
-            return 'other';
-    }
-}
-
-class DataModel {
-    modelosChk = {}; // Usar any para valores dinámicos
-    checkbox;
-    constructor() {
-        this.checkbox = new ForCheckboxModel(this);
-    }
-    generarId(row, campoValor, separador = '') {
-        if (typeof campoValor == 'string') {
-            campoValor = [campoValor];
-        }
-        return campoValor.map(data => row[data]).join(separador);
-    }
-    // Agrega controles al objeto modelosChk
-    agregarControles(lista, idLista, limpiar = true, campoValor = null, campoValorSeparador = '') {
-        if (limpiar) {
-            this.modelosChk = {};
-        }
-        const asignarValor = (dat, idLista, campoValor, key) => {
-            if (!key) {
-                key = dat[idLista] + (campoValor.includes('.') ? '' : `.${campoValor}`);
-            }
-            const mat = campoValor.match(/^([in])[A-Z][a-zA-Z]+/);
-            if (mat) {
-                this.modelosChk[key] = dat[campoValor] * 1;
-            }
-            else {
-                this.modelosChk[key] = dat[campoValor];
-            }
-        };
-        lista.forEach(dat => {
-            if (campoValor === null) {
-                // Caso 1: Sin campoValor, se asigna false
-                this.modelosChk[dat[idLista]] = false;
-            }
-            else if (typeof campoValor === 'string') {
-                // Caso 2: campoValor es un string
-                asignarValor(dat, idLista, campoValor, dat[idLista]);
-            }
-            else if (campoValorSeparador) {
-                const idStr = this.generarId(dat, campoValor, campoValorSeparador);
-                // Caso 2: campoValor es un string
-                asignarValor(dat, idLista, '.', idStr);
-            }
-            else {
-                // Caso 3: campoValor es un array de strings
-                campoValor.forEach(data => asignarValor(dat, idLista, data));
-            }
-        });
-    }
-    // Establece el estado de un índice
-    setState(idx, state) {
-        this.modelosChk[idx] = state;
-    }
-    // Obtiene el estado de un índice
-    getState(idx) {
-        return this.modelosChk[idx];
-    }
-    getDataMultiple(idx) {
-        const camposMod = Object.keys(this.modelosChk).filter(key => key.split('.')[0] == idx);
-        const vRet = {};
-        camposMod.forEach(key => {
-            vRet[key.split('.')[1]] = this.modelosChk[key];
-        });
-        return vRet;
+                        ColumnTypeIconsComponent,
+                        ColumnTypeSinoComponent,
+                        ColumnTypeProgressbarComponent,
+                    ]
+                }]
+        }] });
+
+class TablaMantenimientoColumnDefsComponent {
+    table;
+    cdRef;
+    objThis;
+    nombreColeccion;
+    colDetalle;
+    chkLista; // = new DataModel();
+    chkListaChange = new EventEmitter();
+    columnDefLocales;
+    columnDefEnSubComponentes;
+    constructor(table, cdRef) {
+        this.table = table;
+        this.cdRef = cdRef;
     }
-    // Genera una lista basada en el estado de los índices
-    generarLista(tipoRetorno = null, esCampoNumerico = false) {
-        const strLista = [];
-        const objLista = {};
-        Object.keys(this.modelosChk).forEach(key => {
-            if ((esCampoNumerico && esNumero(this.modelosChk[key])) ||
-                (this.modelosChk[key])) {
-                strLista.push(key);
-                objLista[key] = this.modelosChk[key];
-            }
-        });
-        if (tipoRetorno === 'array') {
-            return strLista;
-        }
-        if (tipoRetorno === 'object') {
-            return objLista;
+    ngAfterContentInit() {
+        if (this.table) {
+            this.cdRef.detectChanges();
+            this.columnDefEnSubComponentes.forEach(refCol => {
+                this.table.addColumnDef(refCol);
+            });
+            this.columnDefLocales.forEach(refCol => {
+                this.table.addColumnDef(refCol);
+            });
         }
-        return strLista.join(',');
     }
-    generarFormGroupFromModelosChk(tipo) {
-        const formGroupObj = {};
-        let validadores = [];
-        if (tipo == 'number') {
-            validadores = [
-                Validators.required,
-                Validators.min(1)
-            ];
-        }
-        Object.keys(this.modelosChk).forEach(key => {
-            formGroupObj[key] = new FormControl(this.modelosChk[key], validadores);
-        });
-        return new FormGroup(formGroupObj);
-        // return this.formBuilder.group(formGroupObj);
+    trackByProperty(index, column) {
+        return column.property;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoColumnDefsComponent, deps: [{ token: i2.MatTable, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: TablaMantenimientoColumnDefsComponent, isStandalone: true, selector: "jvs-tabla-mantenimiento-column-defs", inputs: { objThis: "objThis", nombreColeccion: "nombreColeccion", colDetalle: "colDetalle", chkLista: "chkLista" }, outputs: { chkListaChange: "chkListaChange" }, queries: [{ propertyName: "columnDefEnSubComponentes", predicate: MatColumnDef, descendants: true }], viewQueries: [{ propertyName: "columnDefLocales", predicate: MatColumnDef, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n\n\n\n<ng-container *ngFor=\"let column of colDetalle; trackBy: trackByProperty\">\n\n    <ng-container *ngIf=\"column.type === 'expandir'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef class=\"w-4\" mat-header-cell> <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span></th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"column.click\"\n                (click)=\"column.click(row); row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"!column.click\"\n                (click)=\"row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'checkbox'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"w-4 text-center\" mat-header-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"chkLista.checkbox.establecerTodos($event.checked)\"\n                [indeterminate]=\"chkLista.checkbox.algunosActivos\"\n                [checked]=\"chkLista.checkbox.todosActivos\"\n            ></mat-checkbox>\n        </th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                [(ngModel)]=\"chkLista.modelosChk[chkLista.generarId(row, (column.chkField ?? column.property), column.chkFieldSeparador)]\"\n                [ngModelOptions]=\"{standalone: true}\"\n            ></mat-checkbox>\n\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'estiloEstablecido'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"uppercase text-center\" mat-header-cell\n            mat-sort-header\n            [disabled]=\"column.sort === false\">\n            <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span>\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </th>\n        <td *matCellDef=\"let row\" [ngClass]=\"column.cssClasses\" mat-cell>\n            {{ column.property }}\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </td>\n        <th *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" style=\"height: unset !important;\" mat-footer-cell\n            [innerHTML]=\"column.transformarFooter ? column.transformarFooter() : ''\">\n        </th>\n\n    </ng-container>\n\n    <jvs-column-type-text  *ngIf=\"column.type == 'text'\" [column]=\"column\"></jvs-column-type-text>\n    <jvs-column-type-money *ngIf=\"column.type == 'money'\" [column]=\"column\"></jvs-column-type-money>\n    <jvs-column-type-number *ngIf=\"column.type == 'number'\" [column]=\"column\"></jvs-column-type-number>\n    <jvs-column-type-date *ngIf=\"column.type == 'date'\" [column]=\"column\"></jvs-column-type-date>\n    <jvs-column-type-icons *ngIf=\"column.type == 'icons'\" [column]=\"column\"></jvs-column-type-icons>\n    <jvs-column-type-sino *ngIf=\"column.type == 'yes_no'\" [column]=\"column\"></jvs-column-type-sino>\n    <jvs-column-type-progressbar *ngIf=\"column.type == 'progress'\" [column]=\"column\"></jvs-column-type-progressbar>\n\n\n\n</ng-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i5$1.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "component", type: i3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i2.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColumnTypeModule }, { kind: "component", type: ColumnTypeTextComponent, selector: "jvs-column-type-text", inputs: ["column"] }, { kind: "component", type: ColumnTypeMoneyComponent, selector: "jvs-column-type-money", inputs: ["column"] }, { kind: "component", type: ColumnTypeNumberComponent, selector: "jvs-column-type-number", inputs: ["column"] }, { kind: "component", type: ColumnTypeDateComponent, selector: "jvs-column-type-date", inputs: ["column"] }, { kind: "component", type: ColumnTypeIconsComponent, selector: "jvs-column-type-icons", inputs: ["column"] }, { kind: "component", type: ColumnTypeSinoComponent, selector: "jvs-column-type-sino", inputs: ["column"] }, { kind: "component", type: ColumnTypeProgressbarComponent, selector: "jvs-column-type-progressbar", inputs: ["column"] }] });
 }
-class ForCheckboxModel {
-    modeloCheck;
-    constructor(modeloCheck) {
-        this.modeloCheck = modeloCheck;
-    }
-    get cantidadActivos() {
-        return Object.values(this.modeloCheck.modelosChk).filter(Boolean).length;
-    }
-    get existenActivados() {
-        return this.cantidadActivos > 0;
-    }
-    get todosActivos() {
-        const total = Object.keys(this.modeloCheck.modelosChk).length;
-        const activos = this.cantidadActivos;
-        return activos > 0 && total === activos;
-    }
-    get algunosActivos() {
-        const total = Object.keys(this.modeloCheck.modelosChk).length;
-        const activos = this.cantidadActivos;
-        return activos > 0 && total !== activos;
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoColumnDefsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'jvs-tabla-mantenimiento-column-defs', standalone: true, imports: [
+                        CommonModule,
+                        MatCheckboxModule,
+                        MatIconModule,
+                        MatRippleModule,
+                        MatSortModule,
+                        MatTableModule,
+                        MatTooltipModule,
+                        ReactiveFormsModule,
+                        FormsModule,
+                        ColumnTypeModule,
+                    ], template: "<ng-content></ng-content>\n\n\n\n<ng-container *ngFor=\"let column of colDetalle; trackBy: trackByProperty\">\n\n    <ng-container *ngIf=\"column.type === 'expandir'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef class=\"w-4\" mat-header-cell> <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span></th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"column.click\"\n                (click)=\"column.click(row); row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n            <button type=\"button\" class=\"boton-circular text-primary-contrast bg-primary mat-elevation-z2\" matRipple\n                *ngIf=\"!column.click\"\n                (click)=\"row.isExpanded = !row.isExpanded; $event.stopPropagation()\"\n                matTooltip=\"Expandir / Contraer\">\n                <mat-icon class=\"icon-xs\" [svgIcon]=\"(row.isExpanded ? 'roundExpandLess' : 'roundExpandMore')\"></mat-icon>\n            </button>\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'checkbox'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"w-4 text-center\" mat-header-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"chkLista.checkbox.establecerTodos($event.checked)\"\n                [indeterminate]=\"chkLista.checkbox.algunosActivos\"\n                [checked]=\"chkLista.checkbox.todosActivos\"\n            ></mat-checkbox>\n        </th>\n        <td *matCellDef=\"let row\" class=\"w-4 text-center\" mat-cell>\n            <mat-checkbox *ngIf=\"chkLista\"\n                (click)=\"$event.stopPropagation()\"\n                [(ngModel)]=\"chkLista.modelosChk[chkLista.generarId(row, (column.chkField ?? column.property), column.chkFieldSeparador)]\"\n                [ngModelOptions]=\"{standalone: true}\"\n            ></mat-checkbox>\n\n        </td>\n        <td *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell></td>\n\n    </ng-container>\n    <ng-container *ngIf=\"column.type === 'estiloEstablecido'\" [matColumnDef]=\"column.property\">\n\n        <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"uppercase text-center\" mat-header-cell\n            mat-sort-header\n            [disabled]=\"column.sort === false\">\n            <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span>\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </th>\n        <td *matCellDef=\"let row\" [ngClass]=\"column.cssClasses\" mat-cell>\n            {{ column.property }}\n            <span class=\"text-red-900 font-bold bg-white\">CONFIGURAR ESTILO ESTABLECIDO</span>\n        </td>\n        <th *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" style=\"height: unset !important;\" mat-footer-cell\n            [innerHTML]=\"column.transformarFooter ? column.transformarFooter() : ''\">\n        </th>\n\n    </ng-container>\n\n    <jvs-column-type-text  *ngIf=\"column.type == 'text'\" [column]=\"column\"></jvs-column-type-text>\n    <jvs-column-type-money *ngIf=\"column.type == 'money'\" [column]=\"column\"></jvs-column-type-money>\n    <jvs-column-type-number *ngIf=\"column.type == 'number'\" [column]=\"column\"></jvs-column-type-number>\n    <jvs-column-type-date *ngIf=\"column.type == 'date'\" [column]=\"column\"></jvs-column-type-date>\n    <jvs-column-type-icons *ngIf=\"column.type == 'icons'\" [column]=\"column\"></jvs-column-type-icons>\n    <jvs-column-type-sino *ngIf=\"column.type == 'yes_no'\" [column]=\"column\"></jvs-column-type-sino>\n    <jvs-column-type-progressbar *ngIf=\"column.type == 'progress'\" [column]=\"column\"></jvs-column-type-progressbar>\n\n\n\n</ng-container>\n" }]
+        }], ctorParameters: () => [{ type: i2.MatTable, decorators: [{
+                    type: Optional
+                }] }, { type: i0.ChangeDetectorRef }], propDecorators: { objThis: [{
+                type: Input
+            }], nombreColeccion: [{
+                type: Input
+            }], colDetalle: [{
+                type: Input
+            }], chkLista: [{
+                type: Input
+            }], chkListaChange: [{
+                type: Output
+            }], columnDefLocales: [{
+                type: ViewChildren,
+                args: [MatColumnDef]
+            }], columnDefEnSubComponentes: [{
+                type: ContentChildren,
+                args: [MatColumnDef, { descendants: true }]
+            }] } });
+
+class TablaMantenimientoMenuComponent {
+    objThis;
+    nombreColeccion;
+    item;
+    derechosActuales;
+    // @Input() modalPrincipal;
+    // @Input() botonDisabled = (btn: BotonMantenimiento, item: any) => [];
+    opcionSelecionada = new EventEmitter();
+    menu;
+    subItems;
+    botonTemplate;
+    constructor() {
     }
-    establecerTodos(activo) {
-        Object.keys(this.modeloCheck.modelosChk).forEach(idx => this.modeloCheck.modelosChk[idx] = activo);
+    ngOnInit() {
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: TablaMantenimientoMenuComponent, isStandalone: true, selector: "jvs-tabla-mantenimiento-menu", inputs: { objThis: "objThis", nombreColeccion: "nombreColeccion", item: "item", derechosActuales: "derechosActuales", subItems: "subItems", botonTemplate: "botonTemplate" }, outputs: { opcionSelecionada: "opcionSelecionada" }, viewQueries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true, static: true }], ngImport: i0, template: "<mat-menu #menu=\"matMenu\">\n    <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual w-full\">\n        <ng-container *ngFor=\"let btn of subItems\">\n            <ng-container *ngTemplateOutlet=\"botonTemplate; context:{btn: btn, item: objThis['seleccionados'][nombreColeccion], barraSuperior: false}\"></ng-container>\n        </ng-container>\n    </div>\n</mat-menu>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }] });
 }
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'jvs-tabla-mantenimiento-menu', standalone: true, imports: [
+                        CommonModule,
+                        MatMenuModule,
+                    ], template: "<mat-menu #menu=\"matMenu\">\n    <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual w-full\">\n        <ng-container *ngFor=\"let btn of subItems\">\n            <ng-container *ngTemplateOutlet=\"botonTemplate; context:{btn: btn, item: objThis['seleccionados'][nombreColeccion], barraSuperior: false}\"></ng-container>\n        </ng-container>\n    </div>\n</mat-menu>\n" }]
+        }], ctorParameters: () => [], propDecorators: { objThis: [{
+                type: Input
+            }], nombreColeccion: [{
+                type: Input
+            }], item: [{
+                type: Input
+            }], derechosActuales: [{
+                type: Input
+            }], opcionSelecionada: [{
+                type: Output
+            }], menu: [{
+                type: ViewChild,
+                args: ['menu', { static: true }]
+            }], subItems: [{
+                type: Input,
+                args: [{ required: true }]
+            }], botonTemplate: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
 
 const getFileName = (name) => {
     const timeSpan = new Date().toISOString();
@@ -716,101 +808,6 @@ class TableUtil {
     }
 }
 
-class MatRowKeyboardSelectionDirective {
-    el;
-    rows;
-    renderedData;
-    tabla; // Entrada: Referencia a la tabla
-    rowModel; // Entrada: Modelo de fila actual
-    seleccionarSiguiente = new EventEmitter(); // Salida: Evento al seleccionar siguiente
-    unsubscriber$ = new Subject();
-    constructor(el) {
-        this.el = el;
-    }
-    ngOnInit() {
-        // Asignar tabindex si no está definido
-        if (this.el.nativeElement.tabIndex < 0) {
-            this.el.nativeElement.tabIndex = 0;
-        }
-        // Obtener la fuente de datos de la tabla
-        const dataSource = this.tabla.dataSource;
-        // Suscribirse a los cambios en los datos
-        dataSource.connect().pipe(takeUntil(this.unsubscriber$)).subscribe(data => {
-            this.renderedData = data;
-            this.rows = Array.from(this.getTableRows());
-        });
-    }
-    ngOnDestroy() {
-        // Finalizar la suscripción al destruir la directiva
-        this.unsubscriber$.next(null);
-        this.unsubscriber$.complete();
-    }
-    onKeydown(event) {
-        var element = event.target;
-        if (element.tagName === "INPUT") {
-            event.stopPropagation();
-        }
-        else {
-            const currentIndex = this.renderedData.findIndex(row => row === this.rowModel);
-            const eRef = event.target;
-            this.rows = this.rows.filter(elem => elem.hasAttribute('id'));
-            const arrayFilas = Array.from(this.rows);
-            const fElem = arrayFilas.filter(elem => elem.id == eRef.id).pop();
-            const cElemIdx = arrayFilas.findIndex(elem => elem == fElem);
-            let newRow;
-            // Controlar las teclas presionadas
-            switch (event.key) {
-                case 'ArrowDown':
-                    newRow = this.rows[cElemIdx + 1];
-                    break;
-                case 'ArrowUp':
-                    newRow = this.rows[cElemIdx - 1];
-                    break;
-                case 'Enter':
-                case ' ':
-                    this.seleccionarSiguiente.next(this.renderedData[currentIndex]);
-                    event.preventDefault();
-                    break;
-            }
-            // Enfocar la nueva fila seleccionada
-            if (newRow) {
-                newRow.classList.add('estaFocus');
-                newRow.focus();
-            }
-        }
-    }
-    getTableRows() {
-        let el = this.el.nativeElement;
-        // Recorrer los elementos padres hasta encontrar la tabla
-        while (el && el.parentNode) {
-            el = el.parentNode;
-            // Verificar si es una tabla de material
-            if (el.tagName && el.tagName.toLowerCase() === 'mat-table' || el.hasAttribute('mat-table')) {
-                return el.querySelectorAll('mat-row, tr[mat-row]');
-            }
-        }
-        return undefined;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MatRowKeyboardSelectionDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.7", type: MatRowKeyboardSelectionDirective, isStandalone: true, selector: "[matRowKeyboardSelection]", inputs: { tabla: ["matRowKeyboardSelection", "tabla"], rowModel: "rowModel" }, outputs: { seleccionarSiguiente: "seleccionarSiguiente" }, host: { listeners: { "keydown": "onKeydown($event)" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MatRowKeyboardSelectionDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[matRowKeyboardSelection]'
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { tabla: [{
-                type: Input,
-                args: ['matRowKeyboardSelection']
-            }], rowModel: [{
-                type: Input
-            }], seleccionarSiguiente: [{
-                type: Output
-            }], onKeydown: [{
-                type: HostListener,
-                args: ['keydown', ['$event']]
-            }] } });
-
 class TablaMantenimientoService {
     get templateBotonesComunes() {
         return [