@telcomdev/ui 0.1.12 → 0.1.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telcomdev/ui",
3
- "version": "0.1.12",
3
+ "version": "0.1.14",
4
4
  "description": "Librería UI reutilizable para los sistemas TelcomDev.",
5
5
  "keywords": [
6
6
  "angular",
@@ -2,7 +2,7 @@ import * as _angular_core from '@angular/core';
2
2
  import { AfterContentChecked, EventEmitter, ModelSignal, OutputEmitterRef, OnChanges, OnDestroy, SimpleChanges, InjectionToken, Type, AfterViewInit, TemplateRef, AfterContentInit } from '@angular/core';
3
3
  import { ControlValueAccessor } from '@angular/forms';
4
4
  import { FormCheckboxControl, WithOptionalFieldTree, DisabledReason, ValidationError, FormValueControl } from '@angular/forms/signals';
5
- import { ScrollStrategy, CdkConnectedOverlay, ConnectedPosition } from '@angular/cdk/overlay';
5
+ import { CdkConnectedOverlay, ScrollStrategy, ConnectedPosition } from '@angular/cdk/overlay';
6
6
  import { Observable } from 'rxjs';
7
7
  import { DialogRef } from '@angular/cdk/dialog';
8
8
  import * as _telcomdev_ui from '@telcomdev/ui';
@@ -126,10 +126,52 @@ declare class TdCheckbox implements ControlValueAccessor, FormCheckboxControl {
126
126
  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>;
127
127
  }
128
128
 
129
+ type TdMenuTono = 'neutro' | 'primario' | 'exito' | 'advertencia' | 'peligro';
130
+ type TdMenuPosicion = 'abajo-inicio' | 'abajo-fin' | 'arriba-inicio' | 'arriba-fin';
131
+ interface TdMenuItem<T = unknown> {
132
+ id: string;
133
+ etiqueta: string;
134
+ icono?: string;
135
+ descripcion?: string;
136
+ tono?: TdMenuTono;
137
+ data?: T;
138
+ separadorAntes?: boolean;
139
+ visible?: boolean;
140
+ deshabilitado?: boolean;
141
+ }
142
+ interface TdMenuSeleccion<T = unknown> {
143
+ item: TdMenuItem<T>;
144
+ id: string;
145
+ data?: T;
146
+ }
147
+
148
+ declare class TdMenu<T = unknown> {
149
+ items: TdMenuItem<T>[];
150
+ etiqueta: string;
151
+ icono: string;
152
+ posicion: TdMenuPosicion;
153
+ ancho: string;
154
+ disabled: boolean;
155
+ oscuro: boolean;
156
+ ariaLabel: string;
157
+ readonly seleccion: EventEmitter<TdMenuSeleccion<T>>;
158
+ readonly abiertoChange: EventEmitter<boolean>;
159
+ protected abierto: boolean;
160
+ protected get itemsVisibles(): TdMenuItem<T>[];
161
+ protected alternar(): void;
162
+ protected cerrar(): void;
163
+ protected seleccionar(item: TdMenuItem<T>): void;
164
+ protected posiciones(): CdkConnectedOverlay['positions'];
165
+ private establecerAbierto;
166
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdMenu<any>, never>;
167
+ 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>;
168
+ }
169
+
129
170
  type TdDataTableAlineacion = 'inicio' | 'centro' | 'fin';
130
171
  type TdDataTableTipoColumna = 'texto' | 'numero' | 'decimal' | 'moneda' | 'porcentaje' | 'fecha' | 'fechaHora' | 'hora' | 'booleano' | 'estado' | 'chip' | 'imagen';
131
172
  type TdDataTableTono = 'neutro' | 'primario' | 'exito' | 'advertencia' | 'peligro';
132
173
  type TdDataTableImagenForma = 'cuadrada' | 'redondeada' | 'circular';
174
+ type TdDataTableAccionesPresentacion = 'inline' | 'menu' | 'auto';
133
175
  interface TdDataTableImagenConfig<T> {
134
176
  src?: (valor: unknown, fila: T, indice: number) => string | null | undefined;
135
177
  alt?: (valor: unknown, fila: T, indice: number) => string;
@@ -192,6 +234,7 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
192
234
  datos: T[];
193
235
  columnas: TdDataTableColumna<T>[];
194
236
  acciones: TdDataTableAccion<T>[];
237
+ accionesPresentacion: TdDataTableAccionesPresentacion;
195
238
  botones: TdDataTableBoton[];
196
239
  total: number;
197
240
  cargando: boolean;
@@ -234,9 +277,12 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
234
277
  protected accionesVisibles(fila: T): TdDataTableAccion<T>[];
235
278
  protected iconoAccion(accion: TdDataTableAccion<T>, fila: T): string;
236
279
  protected tonoAccion(accion: TdDataTableAccion<T>, fila: T): TdDataTableTono;
280
+ protected usarMenuAcciones(fila: T): boolean;
281
+ protected accionesMenu(fila: T): TdMenuItem<TdDataTableAccion<T>>[];
237
282
  protected botonesVisibles(): TdDataTableBoton[];
238
283
  protected usaVirtualizacion(): boolean;
239
284
  protected ejecutarAccion(accion: TdDataTableAccion<T>, fila: T, indice: number): void;
285
+ protected ejecutarAccionMenu(evento: TdMenuSeleccion<TdDataTableAccion<T>>, fila: T, indice: number): void;
240
286
  protected abrirImagen(columna: TdDataTableColumna<T>, fila: T, indice: number): void;
241
287
  protected cerrarImagen(): void;
242
288
  protected cerrarImagenSiBackdrop(event: MouseEvent): void;
@@ -252,7 +298,7 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
252
298
  private normalizarFecha;
253
299
  private formatearNumero;
254
300
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDataTable<any>, never>;
255
- 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>;
301
+ 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>;
256
302
  }
257
303
 
258
304
  interface TdDateRange {
@@ -461,6 +507,17 @@ declare class TdFooter {
461
507
  }
462
508
 
463
509
  type TdFileViewerKind = 'imagen' | 'pdf' | 'excel' | 'xml' | 'zip' | 'archivo';
510
+ interface TdFileSource {
511
+ file: string;
512
+ fileName: string;
513
+ type?: string;
514
+ contentType?: string;
515
+ size?: string | number | null;
516
+ description?: string;
517
+ id?: string | number;
518
+ thumbnailUrl?: string;
519
+ downloadable?: boolean;
520
+ }
464
521
  interface TdFileAttachment {
465
522
  id: string | number;
466
523
  nombre: string;
@@ -471,18 +528,30 @@ interface TdFileAttachment {
471
528
  thumbnailUrl?: string;
472
529
  descargable?: boolean;
473
530
  }
531
+ type TdFileViewerArchivo = TdFileAttachment | TdFileSource;
532
+ interface TdFileViewerOpenOptions {
533
+ titulo?: string;
534
+ descripcion?: string;
535
+ oscuro?: boolean;
536
+ compacto?: boolean;
537
+ index?: number;
538
+ }
474
539
 
475
540
  declare class TdFileViewer {
476
541
  private readonly cdr;
477
542
  private visorDialog?;
478
543
  private pdfCanvas?;
479
- archivos: TdFileAttachment[];
544
+ private archivosNormalizados;
545
+ set archivos(value: TdFileViewerArchivo[] | null | undefined);
546
+ get archivos(): TdFileAttachment[];
480
547
  titulo: string;
481
548
  descripcion: string;
482
549
  oscuro: boolean;
483
550
  compacto: boolean;
551
+ showList: boolean;
484
552
  readonly seleccionar: EventEmitter<TdFileAttachment>;
485
553
  readonly descargar: EventEmitter<TdFileAttachment>;
554
+ readonly closed: EventEmitter<void>;
486
555
  protected seleccionado: TdFileAttachment | null;
487
556
  protected zoom: number;
488
557
  protected rotacion: number;
@@ -494,6 +563,9 @@ declare class TdFileViewer {
494
563
  private pdfDocumento?;
495
564
  private pdfRenderTask?;
496
565
  private pdfRenderToken;
566
+ open(archivo: TdFileViewerArchivo): void;
567
+ openByIndex(index: number): void;
568
+ close(): void;
497
569
  protected abrir(archivo: TdFileAttachment): void;
498
570
  protected cerrar(): void;
499
571
  protected cerrarSiBackdrop(event: MouseEvent): void;
@@ -516,8 +588,26 @@ declare class TdFileViewer {
516
588
  private renderizarPaginaPdf;
517
589
  private obtenerPdfJs;
518
590
  private limpiarPdf;
591
+ private normalizarArchivo;
592
+ private esAdjuntoNormalizado;
593
+ private normalizarFileUrl;
594
+ private inferirContentType;
595
+ private obtenerFuentePdf;
596
+ private base64ABytes;
519
597
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdFileViewer, never>;
520
- 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>;
598
+ 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; }; "showList": { "alias": "showList"; "required": false; }; }, { "seleccionar": "seleccionar"; "descargar": "descargar"; "closed": "closed"; }, never, never, true, never>;
599
+ }
600
+
601
+ declare class TdFileViewerService {
602
+ private readonly overlay;
603
+ private readonly environmentInjector;
604
+ private overlayRef?;
605
+ private componentRef?;
606
+ open(archivo: TdFileViewerArchivo | TdFileViewerArchivo[], opciones?: TdFileViewerOpenOptions): TdFileViewer;
607
+ close(): void;
608
+ private dispose;
609
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdFileViewerService, never>;
610
+ static ɵprov: _angular_core.ɵɵInjectableDeclaration<TdFileViewerService>;
521
611
  }
522
612
 
523
613
  interface TdHeaderNotificacion {
@@ -1013,47 +1103,6 @@ declare class TdTextarea implements AfterViewInit, ControlValueAccessor, FormVal
1013
1103
  static ngAcceptInputType_autoResize: unknown;
1014
1104
  }
1015
1105
 
1016
- type TdMenuTono = 'neutro' | 'primario' | 'exito' | 'advertencia' | 'peligro';
1017
- type TdMenuPosicion = 'abajo-inicio' | 'abajo-fin' | 'arriba-inicio' | 'arriba-fin';
1018
- interface TdMenuItem<T = unknown> {
1019
- id: string;
1020
- etiqueta: string;
1021
- icono?: string;
1022
- descripcion?: string;
1023
- tono?: TdMenuTono;
1024
- data?: T;
1025
- separadorAntes?: boolean;
1026
- visible?: boolean;
1027
- deshabilitado?: boolean;
1028
- }
1029
- interface TdMenuSeleccion<T = unknown> {
1030
- item: TdMenuItem<T>;
1031
- id: string;
1032
- data?: T;
1033
- }
1034
-
1035
- declare class TdMenu<T = unknown> {
1036
- items: TdMenuItem<T>[];
1037
- etiqueta: string;
1038
- icono: string;
1039
- posicion: TdMenuPosicion;
1040
- ancho: string;
1041
- disabled: boolean;
1042
- oscuro: boolean;
1043
- ariaLabel: string;
1044
- readonly seleccion: EventEmitter<TdMenuSeleccion<T>>;
1045
- readonly abiertoChange: EventEmitter<boolean>;
1046
- protected abierto: boolean;
1047
- protected get itemsVisibles(): TdMenuItem<T>[];
1048
- protected alternar(): void;
1049
- protected cerrar(): void;
1050
- protected seleccionar(item: TdMenuItem<T>): void;
1051
- protected posiciones(): CdkConnectedOverlay['positions'];
1052
- private establecerAbierto;
1053
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdMenu<any>, never>;
1054
- 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>;
1055
- }
1056
-
1057
1106
  interface TdSelectOption<T = unknown> {
1058
1107
  value: T;
1059
1108
  label: string;
@@ -1351,5 +1400,5 @@ declare class TdThemeService {
1351
1400
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<TdThemeService>;
1352
1401
  }
1353
1402
 
1354
- 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 };
1355
- 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 };
1403
+ 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, TdFileViewerService, TdFooter, TdHeader, TdIcon, TdIconoRegistry, TdInput, TdMenu, TdSelect, TdSidebar, TdTab, TdTabs, TdTextarea, TdThemeService, TelcomdevUi, createTdFormControlBridge };
1404
+ 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, TdFileViewerOpenOptions, 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 };