@telcomdev/ui 0.0.5 → 0.0.7
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/README.md +57 -0
- package/fesm2022/telcomdev-ui.mjs +1353 -141
- package/fesm2022/telcomdev-ui.mjs.map +1 -1
- package/package.json +5 -1
- package/types/telcomdev-ui.d.ts +370 -54
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@telcomdev/ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.7",
|
|
4
4
|
"description": "Librería UI reutilizable para los sistemas TelcomDev.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -14,8 +14,11 @@
|
|
|
14
14
|
"icons",
|
|
15
15
|
"input",
|
|
16
16
|
"select",
|
|
17
|
+
"tabs",
|
|
17
18
|
"data-table",
|
|
18
19
|
"dialog",
|
|
20
|
+
"date-picker",
|
|
21
|
+
"signal-forms",
|
|
19
22
|
"virtual-scroll"
|
|
20
23
|
],
|
|
21
24
|
"author": "TelcomDev",
|
|
@@ -24,6 +27,7 @@
|
|
|
24
27
|
"@angular/cdk": "^21.2.0",
|
|
25
28
|
"@angular/common": "^21.2.0",
|
|
26
29
|
"@angular/core": "^21.2.0",
|
|
30
|
+
"@angular/forms": "^21.2.0",
|
|
27
31
|
"@angular/router": "^21.2.0",
|
|
28
32
|
"rxjs": "~7.8.0"
|
|
29
33
|
},
|
package/types/telcomdev-ui.d.ts
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { OnChanges, OnDestroy, EventEmitter, SimpleChanges, InjectionToken, Type } from '@angular/core';
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { OnChanges, OnDestroy, EventEmitter, SimpleChanges, InjectionToken, Type, TemplateRef, AfterContentInit } from '@angular/core';
|
|
3
|
+
import { ScrollStrategy } from '@angular/cdk/overlay';
|
|
4
|
+
import { ControlValueAccessor } from '@angular/forms';
|
|
5
|
+
import { FormValueControl, WithOptionalFieldTree, ValidationError } from '@angular/forms/signals';
|
|
3
6
|
import { Observable } from 'rxjs';
|
|
4
7
|
import { DialogRef } from '@angular/cdk/dialog';
|
|
5
8
|
import * as _telcomdev_ui from '@telcomdev/ui';
|
|
6
|
-
import { ControlValueAccessor } from '@angular/forms';
|
|
7
|
-
import { ScrollStrategy } from '@angular/cdk/overlay';
|
|
8
9
|
|
|
9
10
|
declare class TelcomdevUi {
|
|
10
|
-
static ɵfac:
|
|
11
|
-
static ɵcmp:
|
|
11
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TelcomdevUi, never>;
|
|
12
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TelcomdevUi, "td-telcomdev-ui", never, {}, {}, never, never, true, never>;
|
|
12
13
|
}
|
|
13
14
|
|
|
14
15
|
type TdAlertaTipo = 'exito' | 'error' | 'advertencia' | 'info' | 'pregunta';
|
|
@@ -111,8 +112,118 @@ declare class TdDataTable<T extends object> implements OnChanges, OnDestroy {
|
|
|
111
112
|
protected ejecutarAccion(accion: TdDataTableAccion<T>, fila: T, indice: number): void;
|
|
112
113
|
protected alCambiarIndice(): void;
|
|
113
114
|
protected readonly trackFila: (_indice: number, fila: T) => unknown;
|
|
114
|
-
static ɵfac:
|
|
115
|
-
static ɵcmp:
|
|
115
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDataTable<any>, never>;
|
|
116
|
+
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; }; "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"; "botonClick": "botonClick"; "cargarMas": "cargarMas"; }, never, ["[tdDataTableFilters]", "[tdDataTableActions]"], true, never>;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
interface TdDateRange {
|
|
120
|
+
inicio: string;
|
|
121
|
+
fin: string | null;
|
|
122
|
+
}
|
|
123
|
+
type TdDatePickerValue = string | TdDateRange | null;
|
|
124
|
+
type TdDatePickerMode = 'fecha' | 'rango';
|
|
125
|
+
|
|
126
|
+
interface CalendarDay {
|
|
127
|
+
iso: string;
|
|
128
|
+
day: number;
|
|
129
|
+
currentMonth: boolean;
|
|
130
|
+
today: boolean;
|
|
131
|
+
disabled: boolean;
|
|
132
|
+
}
|
|
133
|
+
type CalendarView = 'dias' | 'meses' | 'anios';
|
|
134
|
+
declare class TdDatePicker implements ControlValueAccessor, FormValueControl<TdDatePickerValue> {
|
|
135
|
+
private readonly cdr;
|
|
136
|
+
private readonly scrollStrategies;
|
|
137
|
+
private readonly generatedId;
|
|
138
|
+
private readonly formatter;
|
|
139
|
+
private readonly monthFormatter;
|
|
140
|
+
private readonly longFormatter;
|
|
141
|
+
label: string;
|
|
142
|
+
placeholder: string;
|
|
143
|
+
mode: TdDatePickerMode;
|
|
144
|
+
hint: string;
|
|
145
|
+
error: string;
|
|
146
|
+
minDate: string | number | null | undefined;
|
|
147
|
+
maxDate: string | number | null | undefined;
|
|
148
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
149
|
+
readonly readonly: _angular_core.InputSignal<boolean>;
|
|
150
|
+
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
151
|
+
readonly errors: _angular_core.InputSignal<readonly WithOptionalFieldTree<ValidationError>[]>;
|
|
152
|
+
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
153
|
+
clearable: boolean;
|
|
154
|
+
dark: boolean;
|
|
155
|
+
readonly value: _angular_core.ModelSignal<TdDatePickerValue>;
|
|
156
|
+
private readonly cvaDisabled;
|
|
157
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
158
|
+
protected readonly displayError: _angular_core.Signal<string>;
|
|
159
|
+
protected readonly hasError: _angular_core.Signal<boolean>;
|
|
160
|
+
readonly selectionChange: EventEmitter<TdDatePickerValue>;
|
|
161
|
+
readonly openedChange: EventEmitter<boolean>;
|
|
162
|
+
protected open: boolean;
|
|
163
|
+
protected hoveredDate: string | null;
|
|
164
|
+
protected viewDate: Date;
|
|
165
|
+
protected calendarView: CalendarView;
|
|
166
|
+
protected readonly currentYear: number;
|
|
167
|
+
protected readonly scrollStrategy: ScrollStrategy;
|
|
168
|
+
protected get labelId(): string;
|
|
169
|
+
protected get calendarId(): string;
|
|
170
|
+
protected get weekdays(): string[];
|
|
171
|
+
protected get monthLabel(): string;
|
|
172
|
+
protected get periodLabel(): string;
|
|
173
|
+
protected get periodButtonLabel(): string;
|
|
174
|
+
protected get previousLabel(): string;
|
|
175
|
+
protected get nextLabel(): string;
|
|
176
|
+
protected get months(): {
|
|
177
|
+
index: number;
|
|
178
|
+
label: string;
|
|
179
|
+
disabled: boolean;
|
|
180
|
+
}[];
|
|
181
|
+
protected get years(): {
|
|
182
|
+
value: number;
|
|
183
|
+
disabled: boolean;
|
|
184
|
+
}[];
|
|
185
|
+
private get yearPageStart();
|
|
186
|
+
protected get days(): CalendarDay[];
|
|
187
|
+
protected get displayValue(): string;
|
|
188
|
+
protected get rangeStartLabel(): string;
|
|
189
|
+
protected get rangeEndLabel(): string;
|
|
190
|
+
private changed;
|
|
191
|
+
private onCvaTouched;
|
|
192
|
+
writeValue(value: TdDatePickerValue): void;
|
|
193
|
+
registerOnChange(fn: (value: TdDatePickerValue) => void): void;
|
|
194
|
+
registerOnTouched(fn: () => void): void;
|
|
195
|
+
setDisabledState(disabled: boolean): void;
|
|
196
|
+
focus(): void;
|
|
197
|
+
protected toggle(): void;
|
|
198
|
+
protected openPanel(): void;
|
|
199
|
+
protected close(): void;
|
|
200
|
+
protected previousPage(): void;
|
|
201
|
+
protected nextPage(): void;
|
|
202
|
+
protected changeCalendarView(): void;
|
|
203
|
+
protected selectMonth(month: number): void;
|
|
204
|
+
protected selectYear(year: number): void;
|
|
205
|
+
protected goToday(): void;
|
|
206
|
+
protected selectDate(date: CalendarDay): void;
|
|
207
|
+
protected clear(event: MouseEvent): void;
|
|
208
|
+
protected isSelected(iso: string): boolean;
|
|
209
|
+
protected isRangeStart(iso: string): boolean;
|
|
210
|
+
protected isRangeEnd(iso: string): boolean;
|
|
211
|
+
protected isInRange(iso: string): boolean;
|
|
212
|
+
protected formatLong(iso: string): string;
|
|
213
|
+
protected handleTriggerKeydown(event: KeyboardEvent): void;
|
|
214
|
+
protected handleOverlayKeydown(event: KeyboardEvent): void;
|
|
215
|
+
private currentRange;
|
|
216
|
+
private setValue;
|
|
217
|
+
private syncViewToValue;
|
|
218
|
+
private normalizeValue;
|
|
219
|
+
private format;
|
|
220
|
+
private fromIso;
|
|
221
|
+
private toIso;
|
|
222
|
+
private startOfMonth;
|
|
223
|
+
private monthIntersectsLimits;
|
|
224
|
+
private yearIntersectsLimits;
|
|
225
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDatePicker, never>;
|
|
226
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdDatePicker, "td-date-picker", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "minDate": { "alias": "min"; "required": false; }; "maxDate": { "alias": "max"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "touch": "touch"; "value": "valueChange"; "selectionChange": "selectionChange"; "openedChange": "openedChange"; }, never, never, true, never>;
|
|
116
227
|
}
|
|
117
228
|
|
|
118
229
|
type TdDialogTamano = 'pequeno' | 'mediano' | 'grande' | 'pantalla';
|
|
@@ -164,25 +275,25 @@ declare class TdDialog {
|
|
|
164
275
|
closeAll(): void;
|
|
165
276
|
private widthFor;
|
|
166
277
|
private panelClasses;
|
|
167
|
-
static ɵfac:
|
|
168
|
-
static ɵprov:
|
|
278
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDialog, never>;
|
|
279
|
+
static ɵprov: _angular_core.ɵɵInjectableDeclaration<TdDialog>;
|
|
169
280
|
}
|
|
170
281
|
|
|
171
282
|
declare class TdDialogActions {
|
|
172
|
-
static ɵfac:
|
|
173
|
-
static ɵcmp:
|
|
283
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDialogActions, never>;
|
|
284
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdDialogActions, "td-dialog-actions", never, {}, {}, never, ["*"], true, never>;
|
|
174
285
|
}
|
|
175
286
|
|
|
176
287
|
declare class TdDialogClose {
|
|
177
288
|
private readonly dialogRef;
|
|
178
289
|
result: unknown;
|
|
179
290
|
protected close(): void;
|
|
180
|
-
static ɵfac:
|
|
181
|
-
static ɵdir:
|
|
291
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDialogClose, never>;
|
|
292
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TdDialogClose, "[tdDialogClose]", never, { "result": { "alias": "tdDialogClose"; "required": false; }; }, {}, never, never, true, never>;
|
|
182
293
|
}
|
|
183
294
|
declare class TdDialogPrimary {
|
|
184
|
-
static ɵfac:
|
|
185
|
-
static ɵdir:
|
|
295
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdDialogPrimary, never>;
|
|
296
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TdDialogPrimary, "[tdDialogPrimary]", never, {}, {}, never, never, true, never>;
|
|
186
297
|
}
|
|
187
298
|
|
|
188
299
|
declare class TdFooter {
|
|
@@ -192,8 +303,8 @@ declare class TdFooter {
|
|
|
192
303
|
oscuro: boolean;
|
|
193
304
|
compacto: boolean;
|
|
194
305
|
anio: number;
|
|
195
|
-
static ɵfac:
|
|
196
|
-
static ɵcmp:
|
|
306
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdFooter, never>;
|
|
307
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdFooter, "td-footer", never, { "empresa": { "alias": "empresa"; "required": false; }; "texto": { "alias": "texto"; "required": false; }; "version": { "alias": "version"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "compacto": { "alias": "compacto"; "required": false; }; "anio": { "alias": "anio"; "required": false; }; }, {}, never, ["[tdFooterLinks]", "[tdFooterActions]"], true, never>;
|
|
197
308
|
}
|
|
198
309
|
|
|
199
310
|
interface TdHeaderNotificacion {
|
|
@@ -228,8 +339,8 @@ declare class TdHeader {
|
|
|
228
339
|
protected notificacionesNoLeidas(): number;
|
|
229
340
|
protected inicialesUsuario(): string;
|
|
230
341
|
protected cerrarConEscape(): void;
|
|
231
|
-
static ɵfac:
|
|
232
|
-
static ɵcmp:
|
|
342
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdHeader, never>;
|
|
343
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdHeader, "td-header", never, { "menuAbierto": { "alias": "menuAbierto"; "required": false; }; "mostrarMenu": { "alias": "mostrarMenu"; "required": false; }; "usuario": { "alias": "usuario"; "required": false; }; "cargo": { "alias": "cargo"; "required": false; }; "avatarUrl": { "alias": "avatarUrl"; "required": false; }; "notificaciones": { "alias": "notificaciones"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "fijo": { "alias": "fijo"; "required": false; }; }, { "menuToggle": "menuToggle"; "notificacionSeleccionada": "notificacionSeleccionada"; "verTodasNotificaciones": "verTodasNotificaciones"; "accionPerfil": "accionPerfil"; }, never, ["[tdHeaderStart]", "[tdHeaderCenter]", "[tdHeaderActions]"], true, never>;
|
|
233
344
|
}
|
|
234
345
|
|
|
235
346
|
declare class TdIcon {
|
|
@@ -240,13 +351,15 @@ declare class TdIcon {
|
|
|
240
351
|
protected tamanoCss: string;
|
|
241
352
|
protected get tamanoHost(): string;
|
|
242
353
|
protected definicion(): _telcomdev_ui.TdIconoDefinicion;
|
|
243
|
-
static ɵfac:
|
|
244
|
-
static ɵcmp:
|
|
354
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdIcon, never>;
|
|
355
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdIcon, "td-icon", never, { "nombre": { "alias": "nombre"; "required": false; }; "titulo": { "alias": "titulo"; "required": false; }; "tamano": { "alias": "tamano"; "required": false; }; }, {}, never, never, true, never>;
|
|
245
356
|
}
|
|
246
357
|
|
|
247
358
|
interface TdIconoDefinicion {
|
|
248
359
|
path: string;
|
|
249
360
|
viewBox?: string;
|
|
361
|
+
estilo?: 'relleno' | 'linea';
|
|
362
|
+
grosor?: number;
|
|
250
363
|
}
|
|
251
364
|
type TdIconoPersonalizado = Record<string, string | TdIconoDefinicion>;
|
|
252
365
|
|
|
@@ -257,8 +370,8 @@ declare class TdIconoRegistry {
|
|
|
257
370
|
existe(nombre: string): boolean;
|
|
258
371
|
nombres(): string[];
|
|
259
372
|
private normalizar;
|
|
260
|
-
static ɵfac:
|
|
261
|
-
static ɵprov:
|
|
373
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdIconoRegistry, never>;
|
|
374
|
+
static ɵprov: _angular_core.ɵɵInjectableDeclaration<TdIconoRegistry>;
|
|
262
375
|
}
|
|
263
376
|
|
|
264
377
|
declare const TD_ICONOS: {
|
|
@@ -366,16 +479,147 @@ declare const TD_ICONOS: {
|
|
|
366
479
|
};
|
|
367
480
|
pdf: {
|
|
368
481
|
path: string;
|
|
482
|
+
estilo: "linea";
|
|
483
|
+
grosor: number;
|
|
484
|
+
};
|
|
485
|
+
save: {
|
|
486
|
+
path: string;
|
|
487
|
+
};
|
|
488
|
+
copy: {
|
|
489
|
+
path: string;
|
|
490
|
+
};
|
|
491
|
+
download: {
|
|
492
|
+
path: string;
|
|
493
|
+
};
|
|
494
|
+
upload: {
|
|
495
|
+
path: string;
|
|
496
|
+
};
|
|
497
|
+
print: {
|
|
498
|
+
path: string;
|
|
499
|
+
};
|
|
500
|
+
excel: {
|
|
501
|
+
path: string;
|
|
502
|
+
estilo: "linea";
|
|
503
|
+
grosor: number;
|
|
504
|
+
};
|
|
505
|
+
xml: {
|
|
506
|
+
path: string;
|
|
507
|
+
estilo: "linea";
|
|
508
|
+
grosor: number;
|
|
509
|
+
};
|
|
510
|
+
zip: {
|
|
511
|
+
path: string;
|
|
512
|
+
estilo: "linea";
|
|
513
|
+
grosor: number;
|
|
514
|
+
};
|
|
515
|
+
file: {
|
|
516
|
+
path: string;
|
|
517
|
+
};
|
|
518
|
+
image: {
|
|
519
|
+
path: string;
|
|
520
|
+
};
|
|
521
|
+
calendar: {
|
|
522
|
+
path: string;
|
|
523
|
+
};
|
|
524
|
+
clock: {
|
|
525
|
+
path: string;
|
|
526
|
+
};
|
|
527
|
+
history: {
|
|
528
|
+
path: string;
|
|
529
|
+
};
|
|
530
|
+
filter: {
|
|
531
|
+
path: string;
|
|
532
|
+
};
|
|
533
|
+
refresh: {
|
|
534
|
+
path: string;
|
|
535
|
+
};
|
|
536
|
+
sort: {
|
|
537
|
+
path: string;
|
|
538
|
+
};
|
|
539
|
+
more_vertical: {
|
|
540
|
+
path: string;
|
|
541
|
+
};
|
|
542
|
+
more_horizontal: {
|
|
543
|
+
path: string;
|
|
544
|
+
};
|
|
545
|
+
arrow_back: {
|
|
546
|
+
path: string;
|
|
547
|
+
};
|
|
548
|
+
arrow_forward: {
|
|
549
|
+
path: string;
|
|
550
|
+
};
|
|
551
|
+
login: {
|
|
552
|
+
path: string;
|
|
553
|
+
};
|
|
554
|
+
logout: {
|
|
555
|
+
path: string;
|
|
556
|
+
};
|
|
557
|
+
lock: {
|
|
558
|
+
path: string;
|
|
559
|
+
};
|
|
560
|
+
lock_open: {
|
|
561
|
+
path: string;
|
|
562
|
+
};
|
|
563
|
+
mail: {
|
|
564
|
+
path: string;
|
|
565
|
+
};
|
|
566
|
+
phone: {
|
|
567
|
+
path: string;
|
|
568
|
+
};
|
|
569
|
+
send: {
|
|
570
|
+
path: string;
|
|
571
|
+
};
|
|
572
|
+
location: {
|
|
573
|
+
path: string;
|
|
574
|
+
};
|
|
575
|
+
language: {
|
|
576
|
+
path: string;
|
|
577
|
+
};
|
|
578
|
+
info: {
|
|
579
|
+
path: string;
|
|
580
|
+
};
|
|
581
|
+
warning: {
|
|
582
|
+
path: string;
|
|
583
|
+
};
|
|
584
|
+
error: {
|
|
585
|
+
path: string;
|
|
586
|
+
};
|
|
587
|
+
check_circle: {
|
|
588
|
+
path: string;
|
|
589
|
+
};
|
|
590
|
+
cancel: {
|
|
591
|
+
path: string;
|
|
592
|
+
};
|
|
593
|
+
star: {
|
|
594
|
+
path: string;
|
|
595
|
+
};
|
|
596
|
+
favorite: {
|
|
597
|
+
path: string;
|
|
598
|
+
};
|
|
599
|
+
database: {
|
|
600
|
+
path: string;
|
|
601
|
+
};
|
|
602
|
+
cloud: {
|
|
603
|
+
path: string;
|
|
604
|
+
};
|
|
605
|
+
camera: {
|
|
606
|
+
path: string;
|
|
607
|
+
};
|
|
608
|
+
link: {
|
|
609
|
+
path: string;
|
|
610
|
+
};
|
|
611
|
+
external_link: {
|
|
612
|
+
path: string;
|
|
369
613
|
};
|
|
370
614
|
};
|
|
371
615
|
type TdIconoNombre = keyof typeof TD_ICONOS;
|
|
372
|
-
declare const TD_ICONOS_NOMBRES: readonly ("menu" | "search" | "close" | "home" | "dashboard" | "folder" | "settings" | "people" | "person" | "security" | "inventory" | "shopping_cart" | "receipt" | "assessment" | "description" | "business" | "chevron_left" | "chevron_right" | "sun" | "moon" | "alert" | "check" | "visibility" | "visibility_off" | "notifications" | "chevron_down" | "apps" | "help" | "add" | "edit" | "delete" | "toggle_on" | "toggle_off" | "inbox" | "pdf")[];
|
|
616
|
+
declare const TD_ICONOS_NOMBRES: readonly ("error" | "info" | "link" | "menu" | "search" | "cancel" | "close" | "copy" | "home" | "dashboard" | "folder" | "settings" | "people" | "person" | "security" | "inventory" | "shopping_cart" | "receipt" | "assessment" | "description" | "business" | "chevron_left" | "chevron_right" | "sun" | "moon" | "alert" | "check" | "visibility" | "visibility_off" | "notifications" | "chevron_down" | "apps" | "help" | "add" | "edit" | "delete" | "toggle_on" | "toggle_off" | "inbox" | "pdf" | "save" | "download" | "upload" | "print" | "excel" | "xml" | "zip" | "file" | "image" | "calendar" | "clock" | "history" | "filter" | "refresh" | "sort" | "more_vertical" | "more_horizontal" | "arrow_back" | "arrow_forward" | "login" | "logout" | "lock" | "lock_open" | "mail" | "phone" | "send" | "location" | "language" | "warning" | "check_circle" | "star" | "favorite" | "database" | "cloud" | "camera" | "external_link")[];
|
|
373
617
|
|
|
374
|
-
declare class TdInput implements ControlValueAccessor {
|
|
618
|
+
declare class TdInput implements ControlValueAccessor, FormValueControl<string> {
|
|
375
619
|
private readonly cdr;
|
|
376
620
|
private readonly generatedId;
|
|
377
621
|
id: string;
|
|
378
|
-
name: string
|
|
622
|
+
readonly name: _angular_core.InputSignal<string>;
|
|
379
623
|
label: string;
|
|
380
624
|
type: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search' | 'date' | 'time';
|
|
381
625
|
placeholder: string;
|
|
@@ -383,18 +627,24 @@ declare class TdInput implements ControlValueAccessor {
|
|
|
383
627
|
icon: string;
|
|
384
628
|
hint: string;
|
|
385
629
|
error: string;
|
|
386
|
-
readonly: boolean
|
|
387
|
-
disabled: boolean
|
|
388
|
-
required: boolean
|
|
630
|
+
readonly readonly: _angular_core.InputSignal<boolean>;
|
|
631
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
632
|
+
readonly required: _angular_core.InputSignal<boolean>;
|
|
633
|
+
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
634
|
+
readonly errors: _angular_core.InputSignal<readonly WithOptionalFieldTree<ValidationError>[]>;
|
|
635
|
+
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
389
636
|
clearable: boolean;
|
|
390
637
|
dark: boolean;
|
|
391
|
-
|
|
392
|
-
|
|
638
|
+
minValue: string | number | null | undefined;
|
|
639
|
+
maxValue: string | number | null | undefined;
|
|
393
640
|
step: string | number | null;
|
|
394
641
|
minlength: number | null;
|
|
395
642
|
maxlength: number | null;
|
|
396
|
-
readonly
|
|
397
|
-
|
|
643
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
644
|
+
private readonly cvaDisabled;
|
|
645
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
646
|
+
protected readonly displayError: _angular_core.Signal<string>;
|
|
647
|
+
protected readonly hasError: _angular_core.Signal<boolean>;
|
|
398
648
|
protected focused: boolean;
|
|
399
649
|
protected passwordVisible: boolean;
|
|
400
650
|
protected get inputId(): string;
|
|
@@ -410,8 +660,8 @@ declare class TdInput implements ControlValueAccessor {
|
|
|
410
660
|
protected handleBlur(): void;
|
|
411
661
|
protected clear(): void;
|
|
412
662
|
private setValue;
|
|
413
|
-
static ɵfac:
|
|
414
|
-
static ɵcmp:
|
|
663
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdInput, never>;
|
|
664
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdInput, "td-input", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; "minValue": { "alias": "min"; "required": false; }; "maxValue": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "minlength": { "alias": "minlength"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "touch": "touch"; "value": "valueChange"; }, never, never, true, never>;
|
|
415
665
|
}
|
|
416
666
|
|
|
417
667
|
interface TdSelectOption<T = unknown> {
|
|
@@ -423,7 +673,7 @@ interface TdSelectOption<T = unknown> {
|
|
|
423
673
|
}
|
|
424
674
|
type TdSelectScrollBehavior = 'reposition' | 'close';
|
|
425
675
|
|
|
426
|
-
declare class TdAutocompleteSelect<T = unknown> implements ControlValueAccessor {
|
|
676
|
+
declare class TdAutocompleteSelect<T = unknown> implements ControlValueAccessor, FormValueControl<T | null> {
|
|
427
677
|
private readonly cdr;
|
|
428
678
|
private readonly document;
|
|
429
679
|
private readonly destroyRef;
|
|
@@ -439,14 +689,21 @@ declare class TdAutocompleteSelect<T = unknown> implements ControlValueAccessor
|
|
|
439
689
|
emptyText: string;
|
|
440
690
|
clearable: boolean;
|
|
441
691
|
dark: boolean;
|
|
442
|
-
disabled: boolean
|
|
692
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
693
|
+
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
694
|
+
readonly errors: _angular_core.InputSignal<readonly WithOptionalFieldTree<ValidationError>[]>;
|
|
695
|
+
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
443
696
|
scrollBehavior: TdSelectScrollBehavior;
|
|
444
697
|
minimumCharacters: number;
|
|
445
698
|
filterWith: (option: TdSelectOption<T>, search: string) => boolean;
|
|
446
699
|
compareWith: (first: T | null, second: T | null) => boolean;
|
|
447
700
|
readonly selectionChange: EventEmitter<T | null>;
|
|
448
701
|
readonly searchChange: EventEmitter<string>;
|
|
449
|
-
|
|
702
|
+
readonly value: _angular_core.ModelSignal<T | null>;
|
|
703
|
+
private readonly cvaDisabled;
|
|
704
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
705
|
+
protected readonly displayError: _angular_core.Signal<string>;
|
|
706
|
+
protected readonly hasError: _angular_core.Signal<boolean>;
|
|
450
707
|
protected search: string;
|
|
451
708
|
protected open: boolean;
|
|
452
709
|
protected activeIndex: number;
|
|
@@ -456,7 +713,7 @@ declare class TdAutocompleteSelect<T = unknown> implements ControlValueAccessor
|
|
|
456
713
|
protected get filteredOptions(): TdSelectOption<T>[];
|
|
457
714
|
protected readonly onTouched: () => void;
|
|
458
715
|
private changed;
|
|
459
|
-
private
|
|
716
|
+
private onCvaTouched;
|
|
460
717
|
constructor();
|
|
461
718
|
writeValue(value: T | null): void;
|
|
462
719
|
registerOnChange(fn: (value: T | null) => void): void;
|
|
@@ -471,11 +728,11 @@ declare class TdAutocompleteSelect<T = unknown> implements ControlValueAccessor
|
|
|
471
728
|
protected handleKeydown(event: KeyboardEvent): void;
|
|
472
729
|
private moveActive;
|
|
473
730
|
private firstEnabledIndex;
|
|
474
|
-
static ɵfac:
|
|
475
|
-
static ɵcmp:
|
|
731
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdAutocompleteSelect<any>, never>;
|
|
732
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdAutocompleteSelect<any>, "td-autocomplete-select", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "emptyText": { "alias": "emptyText"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "scrollBehavior": { "alias": "scrollBehavior"; "required": false; }; "minimumCharacters": { "alias": "minimumCharacters"; "required": false; }; "filterWith": { "alias": "filterWith"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "touch": "touch"; "selectionChange": "selectionChange"; "searchChange": "searchChange"; "value": "valueChange"; }, never, never, true, never>;
|
|
476
733
|
}
|
|
477
734
|
|
|
478
|
-
declare class TdSelect<T = unknown> implements ControlValueAccessor {
|
|
735
|
+
declare class TdSelect<T = unknown> implements ControlValueAccessor, FormValueControl<T | null> {
|
|
479
736
|
private readonly cdr;
|
|
480
737
|
private readonly document;
|
|
481
738
|
private readonly destroyRef;
|
|
@@ -490,11 +747,18 @@ declare class TdSelect<T = unknown> implements ControlValueAccessor {
|
|
|
490
747
|
emptyText: string;
|
|
491
748
|
clearable: boolean;
|
|
492
749
|
dark: boolean;
|
|
493
|
-
disabled: boolean
|
|
750
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
751
|
+
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
752
|
+
readonly errors: _angular_core.InputSignal<readonly WithOptionalFieldTree<ValidationError>[]>;
|
|
753
|
+
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
494
754
|
scrollBehavior: TdSelectScrollBehavior;
|
|
495
755
|
compareWith: (first: T | null, second: T | null) => boolean;
|
|
496
756
|
readonly selectionChange: EventEmitter<T | null>;
|
|
497
|
-
|
|
757
|
+
readonly value: _angular_core.ModelSignal<T | null>;
|
|
758
|
+
private readonly cvaDisabled;
|
|
759
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
760
|
+
protected readonly displayError: _angular_core.Signal<string>;
|
|
761
|
+
protected readonly hasError: _angular_core.Signal<boolean>;
|
|
498
762
|
protected open: boolean;
|
|
499
763
|
protected activeIndex: number;
|
|
500
764
|
protected readonly scrollStrategy: ScrollStrategy;
|
|
@@ -519,8 +783,8 @@ declare class TdSelect<T = unknown> implements ControlValueAccessor {
|
|
|
519
783
|
private moveActive;
|
|
520
784
|
private firstEnabledIndex;
|
|
521
785
|
private setValue;
|
|
522
|
-
static ɵfac:
|
|
523
|
-
static ɵcmp:
|
|
786
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdSelect<any>, never>;
|
|
787
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdSelect<any>, "td-select", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "emptyText": { "alias": "emptyText"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "scrollBehavior": { "alias": "scrollBehavior"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "touch": "touch"; "selectionChange": "selectionChange"; "value": "valueChange"; }, never, never, true, never>;
|
|
524
788
|
}
|
|
525
789
|
|
|
526
790
|
interface MenuSidebar {
|
|
@@ -554,18 +818,70 @@ declare class TdSidebar {
|
|
|
554
818
|
get menu(): MenuSidebar[];
|
|
555
819
|
readonly abiertoChange: EventEmitter<boolean>;
|
|
556
820
|
readonly seleccionar: EventEmitter<TdSidebarSeleccion>;
|
|
557
|
-
protected readonly abiertoInterno:
|
|
558
|
-
protected readonly menuNormalizado:
|
|
559
|
-
protected readonly expandidos:
|
|
821
|
+
protected readonly abiertoInterno: _angular_core.WritableSignal<boolean>;
|
|
822
|
+
protected readonly menuNormalizado: _angular_core.WritableSignal<MenuSidebar[]>;
|
|
823
|
+
protected readonly expandidos: _angular_core.WritableSignal<ReadonlySet<string>>;
|
|
560
824
|
protected alternarGrupo(clave: string): void;
|
|
561
825
|
protected estaExpandido(clave: string): boolean;
|
|
562
826
|
protected seleccionarItem(item: MenuSidebar, nivel: number): void;
|
|
563
827
|
protected claveItem(item: MenuSidebar, padre: string, indice: number): string;
|
|
564
828
|
protected inicialMarca(): string;
|
|
565
829
|
private normalizarMenu;
|
|
566
|
-
static ɵfac:
|
|
567
|
-
static ɵcmp:
|
|
830
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdSidebar, never>;
|
|
831
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdSidebar, "td-sidebar", never, { "titulo": { "alias": "titulo"; "required": false; }; "subtitulo": { "alias": "subtitulo"; "required": false; }; "etiquetaNavegacion": { "alias": "etiquetaNavegacion"; "required": false; }; "logoUrl": { "alias": "logoUrl"; "required": false; }; "logoAlt": { "alias": "logoAlt"; "required": false; }; "textoCarga": { "alias": "textoCarga"; "required": false; }; "mensajeVacio": { "alias": "mensajeVacio"; "required": false; }; "error": { "alias": "error"; "required": false; }; "cargando": { "alias": "cargando"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "modoCerrado": { "alias": "modoCerrado"; "required": false; }; "abierto": { "alias": "abierto"; "required": false; }; "menu": { "alias": "menu"; "required": false; }; }, { "abiertoChange": "abiertoChange"; "seleccionar": "seleccionar"; }, never, never, true, never>;
|
|
832
|
+
}
|
|
833
|
+
|
|
834
|
+
declare class TdTab {
|
|
835
|
+
readonly generatedId: string;
|
|
836
|
+
id: string;
|
|
837
|
+
label: string;
|
|
838
|
+
icon: string;
|
|
839
|
+
disabled: boolean;
|
|
840
|
+
badge: string | number | null;
|
|
841
|
+
content: TemplateRef<unknown>;
|
|
842
|
+
get resolvedId(): string;
|
|
843
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdTab, never>;
|
|
844
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdTab, "td-tab", never, { "id": { "alias": "id"; "required": false; }; "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "badge": { "alias": "badge"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
845
|
+
}
|
|
846
|
+
|
|
847
|
+
type TdTabsVariant = 'linea' | 'pastilla' | 'contenida';
|
|
848
|
+
type TdTabsAlignment = 'inicio' | 'centro' | 'fin';
|
|
849
|
+
declare class TdTabs implements AfterContentInit, OnDestroy {
|
|
850
|
+
private readonly cdr;
|
|
851
|
+
private tabsChange?;
|
|
852
|
+
private requestedIndex;
|
|
853
|
+
private tabQuery;
|
|
854
|
+
private tabList?;
|
|
855
|
+
private tabButtons;
|
|
856
|
+
set selectedIndex(value: number);
|
|
857
|
+
get selectedIndex(): number;
|
|
858
|
+
variant: TdTabsVariant;
|
|
859
|
+
alignment: TdTabsAlignment;
|
|
860
|
+
stretch: boolean;
|
|
861
|
+
dark: boolean;
|
|
862
|
+
ariaLabel: string;
|
|
863
|
+
panelFocusable: boolean;
|
|
864
|
+
readonly selectedIndexChange: EventEmitter<number>;
|
|
865
|
+
readonly tabChange: EventEmitter<TdTab>;
|
|
866
|
+
protected tabs: readonly TdTab[];
|
|
867
|
+
protected activeIndex: number;
|
|
868
|
+
protected get activeTab(): TdTab | null;
|
|
869
|
+
ngAfterContentInit(): void;
|
|
870
|
+
ngOnDestroy(): void;
|
|
871
|
+
protected select(index: number, focus?: boolean): void;
|
|
872
|
+
protected handleKeydown(event: KeyboardEvent): void;
|
|
873
|
+
protected tabId(tab: TdTab): string;
|
|
874
|
+
protected panelId(tab: TdTab): string;
|
|
875
|
+
private syncTabs;
|
|
876
|
+
private applyRequestedIndex;
|
|
877
|
+
private nextEnabledIndex;
|
|
878
|
+
private firstEnabledIndex;
|
|
879
|
+
private lastEnabledIndex;
|
|
880
|
+
private focusButton;
|
|
881
|
+
private ensureTabVisible;
|
|
882
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TdTabs, never>;
|
|
883
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TdTabs, "td-tabs", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "alignment": { "alias": "alignment"; "required": false; }; "stretch": { "alias": "stretch"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "panelFocusable": { "alias": "panelFocusable"; "required": false; }; }, { "selectedIndexChange": "selectedIndexChange"; "tabChange": "tabChange"; }, ["tabQuery"], never, true, never>;
|
|
568
884
|
}
|
|
569
885
|
|
|
570
|
-
export { TD_DIALOG_CONFIG, TD_DIALOG_DATA, TD_ICONOS, TD_ICONOS_NOMBRES, TdAlerta, TdAutocompleteSelect, TdDataTable, TdDialog, TdDialogActions, TdDialogClose, TdDialogPrimary, TdDialogRef, TdFooter, TdHeader, TdIcon, TdIconoRegistry, TdInput, TdSelect, TdSidebar, TelcomdevUi };
|
|
571
|
-
export type { MenuSidebar, TdAlertaOpciones, TdAlertaTipo, TdDataTableAccion, TdDataTableAccionEvento, TdDataTableAlineacion, TdDataTableBoton, TdDataTableColumna, TdDataTableTipoColumna, TdDataTableTono, TdDialogConfig, TdDialogPanelData, TdDialogRefLike, TdDialogTamano, TdHeaderAccionPerfil, TdHeaderNotificacion, TdIconoDefinicion, TdIconoNombre, TdIconoPersonalizado, TdSelectOption, TdSelectScrollBehavior, TdSidebarModoCerrado, TdSidebarSeleccion };
|
|
886
|
+
export { TD_DIALOG_CONFIG, TD_DIALOG_DATA, TD_ICONOS, TD_ICONOS_NOMBRES, TdAlerta, TdAutocompleteSelect, TdDataTable, TdDatePicker, TdDialog, TdDialogActions, TdDialogClose, TdDialogPrimary, TdDialogRef, TdFooter, TdHeader, TdIcon, TdIconoRegistry, TdInput, TdSelect, TdSidebar, TdTab, TdTabs, TelcomdevUi };
|
|
887
|
+
export type { MenuSidebar, TdAlertaOpciones, TdAlertaTipo, TdDataTableAccion, TdDataTableAccionEvento, TdDataTableAlineacion, TdDataTableBoton, TdDataTableColumna, TdDataTableTipoColumna, TdDataTableTono, TdDatePickerMode, TdDatePickerValue, TdDateRange, TdDialogConfig, TdDialogPanelData, TdDialogRefLike, TdDialogTamano, TdHeaderAccionPerfil, TdHeaderNotificacion, TdIconoDefinicion, TdIconoNombre, TdIconoPersonalizado, TdSelectOption, TdSelectScrollBehavior, TdSidebarModoCerrado, TdSidebarSeleccion, TdTabsAlignment, TdTabsVariant };
|