@telcomdev/ui 0.1.11 → 0.1.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telcomdev/ui",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "Librería UI reutilizable para los sistemas TelcomDev.",
   "keywords": [
     "angular",
@@ -39,11 +39,11 @@
     "LICENSE"
   ],
   "peerDependencies": {
-    "@angular/cdk": "^21.2.0",
-    "@angular/common": "^21.2.0",
-    "@angular/core": "^21.2.0",
-    "@angular/forms": "^21.2.0",
-    "@angular/router": "^21.2.0",
+    "@angular/cdk": "^22.0.0",
+    "@angular/common": "^22.0.0",
+    "@angular/core": "^22.0.0",
+    "@angular/forms": "^22.0.0",
+    "@angular/router": "^22.0.0",
     "rxjs": "~7.8.0"
   },
   "dependencies": {

package/types/telcomdev-ui.d.ts

@@ -2,7 +2,7 @@ import * as _angular_core from '@angular/core';
 import { AfterContentChecked, EventEmitter, ModelSignal, OutputEmitterRef, OnChanges, OnDestroy, SimpleChanges, InjectionToken, Type, AfterViewInit, TemplateRef, AfterContentInit } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { FormCheckboxControl, WithOptionalFieldTree, DisabledReason, ValidationError, FormValueControl } from '@angular/forms/signals';
-import { ScrollStrategy, CdkConnectedOverlay, ConnectedPosition } from '@angular/cdk/overlay';
+import { CdkConnectedOverlay, ScrollStrategy, ConnectedPosition } from '@angular/cdk/overlay';
 import { Observable } from 'rxjs';
 import { DialogRef } from '@angular/cdk/dialog';
 import * as _telcomdev_ui from '@telcomdev/ui';
@@ -126,10 +126,52 @@ declare class TdCheckbox implements ControlValueAccessor, FormCheckboxControl {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdCheckbox, "td-checkbox", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "dark": { "alias": "dark"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "disabledReasons": { "alias": "disabledReasons"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "touched": "touchedChange"; "touch": "touch"; "checked": "checkedChange"; }, never, never, true, never>;
 }
 
+type TdMenuTono = 'neutro' | 'primario' | 'exito' | 'advertencia' | 'peligro';
+type TdMenuPosicion = 'abajo-inicio' | 'abajo-fin' | 'arriba-inicio' | 'arriba-fin';
+interface TdMenuItem<T = unknown> {
+    id: string;
+    etiqueta: string;
+    icono?: string;
+    descripcion?: string;
+    tono?: TdMenuTono;
+    data?: T;
+    separadorAntes?: boolean;
+    visible?: boolean;
+    deshabilitado?: boolean;
+}
+interface TdMenuSeleccion<T = unknown> {
+    item: TdMenuItem<T>;
+    id: string;
+    data?: T;
+}
+
+declare class TdMenu<T = unknown> {
+    items: TdMenuItem<T>[];
+    etiqueta: string;
+    icono: string;
+    posicion: TdMenuPosicion;
+    ancho: string;
+    disabled: boolean;
+    oscuro: boolean;
+    ariaLabel: string;
+    readonly seleccion: EventEmitter<TdMenuSeleccion<T>>;
+    readonly abiertoChange: EventEmitter<boolean>;
+    protected abierto: boolean;
+    protected get itemsVisibles(): TdMenuItem<T>[];
+    protected alternar(): void;
+    protected cerrar(): void;
+    protected seleccionar(item: TdMenuItem<T>): void;
+    protected posiciones(): CdkConnectedOverlay['positions'];
+    private establecerAbierto;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdMenu<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdMenu<any>, "td-menu", never, { "items": { "alias": "items"; "required": false; }; "etiqueta": { "alias": "etiqueta"; "required": false; }; "icono": { "alias": "icono"; "required": false; }; "posicion": { "alias": "posicion"; "required": false; }; "ancho": { "alias": "ancho"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, { "seleccion": "seleccion"; "abiertoChange": "abiertoChange"; }, never, never, true, never>;
+}
+
 type TdDataTableAlineacion = 'inicio' | 'centro' | 'fin';
 type TdDataTableTipoColumna = 'texto' | 'numero' | 'decimal' | 'moneda' | 'porcentaje' | 'fecha' | 'fechaHora' | 'hora' | 'booleano' | 'estado' | 'chip' | 'imagen';
 type TdDataTableTono = 'neutro' | 'primario' | 'exito' | 'advertencia' | 'peligro';
 type TdDataTableImagenForma = 'cuadrada' | 'redondeada' | 'circular';
+type TdDataTableAccionesPresentacion = 'inline' | 'menu' | 'auto';
 interface TdDataTableImagenConfig<T> {
     src?: (valor: unknown, fila: T, indice: number) => string | null | undefined;
     alt?: (valor: unknown, fila: T, indice: number) => string;
@@ -192,6 +234,7 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
     datos: T[];
     columnas: TdDataTableColumna<T>[];
     acciones: TdDataTableAccion<T>[];
+    accionesPresentacion: TdDataTableAccionesPresentacion;
     botones: TdDataTableBoton[];
     total: number;
     cargando: boolean;
@@ -234,9 +277,12 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
     protected accionesVisibles(fila: T): TdDataTableAccion<T>[];
     protected iconoAccion(accion: TdDataTableAccion<T>, fila: T): string;
     protected tonoAccion(accion: TdDataTableAccion<T>, fila: T): TdDataTableTono;
+    protected usarMenuAcciones(fila: T): boolean;
+    protected accionesMenu(fila: T): TdMenuItem<TdDataTableAccion<T>>[];
     protected botonesVisibles(): TdDataTableBoton[];
     protected usaVirtualizacion(): boolean;
     protected ejecutarAccion(accion: TdDataTableAccion<T>, fila: T, indice: number): void;
+    protected ejecutarAccionMenu(evento: TdMenuSeleccion<TdDataTableAccion<T>>, fila: T, indice: number): void;
     protected abrirImagen(columna: TdDataTableColumna<T>, fila: T, indice: number): void;
     protected cerrarImagen(): void;
     protected cerrarImagenSiBackdrop(event: MouseEvent): void;
@@ -252,7 +298,7 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
     private normalizarFecha;
     private formatearNumero;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDataTable<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdDataTable<any>, "td-data-table", never, { "datos": { "alias": "datos"; "required": false; }; "columnas": { "alias": "columnas"; "required": false; }; "acciones": { "alias": "acciones"; "required": false; }; "botones": { "alias": "botones"; "required": false; }; "total": { "alias": "total"; "required": false; }; "cargando": { "alias": "cargando"; "required": false; }; "puedeCargarMas": { "alias": "puedeCargarMas"; "required": false; }; "virtualizar": { "alias": "virtualizar"; "required": false; }; "virtualizarDesde": { "alias": "virtualizarDesde"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "filasAntesDeCargar": { "alias": "filasAntesDeCargar"; "required": false; }; "altura": { "alias": "altura"; "required": false; }; "campoId": { "alias": "campoId"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "mostrarBusqueda": { "alias": "mostrarBusqueda"; "required": false; }; "placeholderBusqueda": { "alias": "placeholderBusqueda"; "required": false; }; "textoVacio": { "alias": "textoVacio"; "required": false; }; "descripcionVacio": { "alias": "descripcionVacio"; "required": false; }; "debounceBusqueda": { "alias": "debounceBusqueda"; "required": false; }; }, { "busquedaChange": "busquedaChange"; "accion": "accion"; "imagenClick": "imagenClick"; "botonClick": "botonClick"; "cargarMas": "cargarMas"; }, never, ["[tdDataTableFilters]", "[tdDataTableActions]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdDataTable<any>, "td-data-table", never, { "datos": { "alias": "datos"; "required": false; }; "columnas": { "alias": "columnas"; "required": false; }; "acciones": { "alias": "acciones"; "required": false; }; "accionesPresentacion": { "alias": "accionesPresentacion"; "required": false; }; "botones": { "alias": "botones"; "required": false; }; "total": { "alias": "total"; "required": false; }; "cargando": { "alias": "cargando"; "required": false; }; "puedeCargarMas": { "alias": "puedeCargarMas"; "required": false; }; "virtualizar": { "alias": "virtualizar"; "required": false; }; "virtualizarDesde": { "alias": "virtualizarDesde"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "filasAntesDeCargar": { "alias": "filasAntesDeCargar"; "required": false; }; "altura": { "alias": "altura"; "required": false; }; "campoId": { "alias": "campoId"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "mostrarBusqueda": { "alias": "mostrarBusqueda"; "required": false; }; "placeholderBusqueda": { "alias": "placeholderBusqueda"; "required": false; }; "textoVacio": { "alias": "textoVacio"; "required": false; }; "descripcionVacio": { "alias": "descripcionVacio"; "required": false; }; "debounceBusqueda": { "alias": "debounceBusqueda"; "required": false; }; }, { "busquedaChange": "busquedaChange"; "accion": "accion"; "imagenClick": "imagenClick"; "botonClick": "botonClick"; "cargarMas": "cargarMas"; }, never, ["[tdDataTableFilters]", "[tdDataTableActions]"], true, never>;
 }
 
 interface TdDateRange {
@@ -461,6 +507,17 @@ declare class TdFooter {
 }
 
 type TdFileViewerKind = 'imagen' | 'pdf' | 'excel' | 'xml' | 'zip' | 'archivo';
+interface TdFileSource {
+    file: string;
+    fileName: string;
+    type?: string;
+    contentType?: string;
+    size?: string | number | null;
+    description?: string;
+    id?: string | number;
+    thumbnailUrl?: string;
+    downloadable?: boolean;
+}
 interface TdFileAttachment {
     id: string | number;
     nombre: string;
@@ -471,12 +528,15 @@ interface TdFileAttachment {
     thumbnailUrl?: string;
     descargable?: boolean;
 }
+type TdFileViewerArchivo = TdFileAttachment | TdFileSource;
 
 declare class TdFileViewer {
     private readonly cdr;
     private visorDialog?;
     private pdfCanvas?;
-    archivos: TdFileAttachment[];
+    private archivosNormalizados;
+    set archivos(value: TdFileViewerArchivo[] | null | undefined);
+    get archivos(): TdFileAttachment[];
     titulo: string;
     descripcion: string;
     oscuro: boolean;
@@ -516,6 +576,12 @@ declare class TdFileViewer {
     private renderizarPaginaPdf;
     private obtenerPdfJs;
     private limpiarPdf;
+    private normalizarArchivo;
+    private esAdjuntoNormalizado;
+    private normalizarFileUrl;
+    private inferirContentType;
+    private obtenerFuentePdf;
+    private base64ABytes;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdFileViewer, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdFileViewer, "td-file-viewer", never, { "archivos": { "alias": "archivos"; "required": false; }; "titulo": { "alias": "titulo"; "required": false; }; "descripcion": { "alias": "descripcion"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "compacto": { "alias": "compacto"; "required": false; }; }, { "seleccionar": "seleccionar"; "descargar": "descargar"; }, never, never, true, never>;
 }
@@ -1013,47 +1079,6 @@ declare class TdTextarea implements AfterViewInit, ControlValueAccessor, FormVal
     static ngAcceptInputType_autoResize: unknown;
 }
 
-type TdMenuTono = 'neutro' | 'primario' | 'exito' | 'advertencia' | 'peligro';
-type TdMenuPosicion = 'abajo-inicio' | 'abajo-fin' | 'arriba-inicio' | 'arriba-fin';
-interface TdMenuItem<T = unknown> {
-    id: string;
-    etiqueta: string;
-    icono?: string;
-    descripcion?: string;
-    tono?: TdMenuTono;
-    data?: T;
-    separadorAntes?: boolean;
-    visible?: boolean;
-    deshabilitado?: boolean;
-}
-interface TdMenuSeleccion<T = unknown> {
-    item: TdMenuItem<T>;
-    id: string;
-    data?: T;
-}
-
-declare class TdMenu<T = unknown> {
-    items: TdMenuItem<T>[];
-    etiqueta: string;
-    icono: string;
-    posicion: TdMenuPosicion;
-    ancho: string;
-    disabled: boolean;
-    oscuro: boolean;
-    ariaLabel: string;
-    readonly seleccion: EventEmitter<TdMenuSeleccion<T>>;
-    readonly abiertoChange: EventEmitter<boolean>;
-    protected abierto: boolean;
-    protected get itemsVisibles(): TdMenuItem<T>[];
-    protected alternar(): void;
-    protected cerrar(): void;
-    protected seleccionar(item: TdMenuItem<T>): void;
-    protected posiciones(): CdkConnectedOverlay['positions'];
-    private establecerAbierto;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdMenu<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdMenu<any>, "td-menu", never, { "items": { "alias": "items"; "required": false; }; "etiqueta": { "alias": "etiqueta"; "required": false; }; "icono": { "alias": "icono"; "required": false; }; "posicion": { "alias": "posicion"; "required": false; }; "ancho": { "alias": "ancho"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, { "seleccion": "seleccion"; "abiertoChange": "abiertoChange"; }, never, never, true, never>;
-}
-
 interface TdSelectOption<T = unknown> {
     value: T;
     label: string;
@@ -1352,4 +1377,4 @@ declare class TdThemeService {
 }
 
 export { TD_DIALOG_CONFIG, TD_DIALOG_DATA, TD_ICONOS, TD_ICONOS_NOMBRES, TD_THEME_DARK_COLORS, TD_THEME_LIGHT_COLORS, TdAlerta, TdAutocompleteSelect, TdButton, TdCheckbox, TdDataTable, TdDatePicker, TdDialog, TdDialogActions, TdDialogClose, TdDialogPrimary, TdDialogRef, TdFileViewer, TdFooter, TdHeader, TdIcon, TdIconoRegistry, TdInput, TdMenu, TdSelect, TdSidebar, TdTab, TdTabs, TdTextarea, TdThemeService, TelcomdevUi, createTdFormControlBridge };
-export type { MenuSidebar, TdAlertaOpciones, TdAlertaTipo, TdButtonSize, TdButtonTone, TdButtonType, TdButtonVariant, TdDataTableAccion, TdDataTableAccionEvento, TdDataTableAlineacion, TdDataTableBoton, TdDataTableColumna, TdDataTableImagenConfig, TdDataTableImagenEvento, TdDataTableImagenForma, TdDataTableTipoColumna, TdDataTableTono, TdDatePickerMode, TdDatePickerValue, TdDateRange, TdDialogConfig, TdDialogPanelData, TdDialogRefLike, TdDialogTamano, TdErrorDisplay, TdFileAttachment, TdFileViewerKind, TdFormControlBridge, TdHeaderAccionPerfil, TdHeaderNotificacion, TdIconoDefinicion, TdIconoNombre, TdIconoPersonalizado, TdInputEmptyValue, TdInputMask, TdInputSanitize, TdInputSanitizeFn, TdInputSanitizePreset, TdInputValue, TdMenuItem, TdMenuPosicion, TdMenuSeleccion, TdMenuTono, TdSelectAppearance, TdSelectOption, TdSelectOverflowText, TdSelectScrollBehavior, TdSidebarModoCerrado, TdSidebarSeleccion, TdTabsAlignment, TdTabsVariant, TdTextareaEmptyValue, TdTextareaValue, TdThemeMode, TdThemePaletteColor };
+export type { MenuSidebar, TdAlertaOpciones, TdAlertaTipo, TdButtonSize, TdButtonTone, TdButtonType, TdButtonVariant, TdDataTableAccion, TdDataTableAccionEvento, TdDataTableAccionesPresentacion, TdDataTableAlineacion, TdDataTableBoton, TdDataTableColumna, TdDataTableImagenConfig, TdDataTableImagenEvento, TdDataTableImagenForma, TdDataTableTipoColumna, TdDataTableTono, TdDatePickerMode, TdDatePickerValue, TdDateRange, TdDialogConfig, TdDialogPanelData, TdDialogRefLike, TdDialogTamano, TdErrorDisplay, TdFileAttachment, TdFileSource, TdFileViewerArchivo, TdFileViewerKind, TdFormControlBridge, TdHeaderAccionPerfil, TdHeaderNotificacion, TdIconoDefinicion, TdIconoNombre, TdIconoPersonalizado, TdInputEmptyValue, TdInputMask, TdInputSanitize, TdInputSanitizeFn, TdInputSanitizePreset, TdInputValue, TdMenuItem, TdMenuPosicion, TdMenuSeleccion, TdMenuTono, TdSelectAppearance, TdSelectOption, TdSelectOverflowText, TdSelectScrollBehavior, TdSidebarModoCerrado, TdSidebarSeleccion, TdTabsAlignment, TdTabsVariant, TdTextareaEmptyValue, TdTextareaValue, TdThemeMode, TdThemePaletteColor };