@telcomdev/ui 0.1.17 → 0.1.19

package/README.md

@@ -139,6 +139,51 @@ El comportamiento predeterminado durante el scroll es `reposition`, por lo que
 el panel permanece unido al control. Puede cambiarse con
 `scrollBehavior="close"`.
 
+## File Upload
+
+Selector de archivos con soporte para formularios Angular, drag and drop,
+validación de formatos y previsualización de imágenes/PDF mediante el visor de
+archivos de la librería.
+
+### Variante input
+
+```html
+<td-file-upload
+  label="Logo del proveedor"
+  variant="input"
+  accept="image/*"
+  [maxSizeMb]="2"
+  [(ngModel)]="logo"
+/>
+```
+
+```ts
+logo: File | null = null;
+```
+
+### Variante dropzone con preview
+
+```html
+<td-file-upload
+  label="Adjuntos del expediente"
+  description="Arrastra contrato, evidencia o documentos."
+  accept="image/*,.pdf,.xml,.xlsx,.zip"
+  [multiple]="true"
+  [maxFiles]="5"
+  [maxSizeMb]="8"
+  [(ngModel)]="adjuntos"
+  (filesChange)="actualizarArchivos($event)"
+  (rejected)="mostrarRechazos($event)"
+/>
+```
+
+```ts
+adjuntos: File[] = [];
+```
+
+Cuando `multiple` está desactivado el valor del formulario es `File | null`.
+Cuando `multiple` está activado el valor es `File[]`.
+
 ## Tabs
 
 ```html
@@ -457,6 +502,41 @@ También funciona con formularios tradicionales:
 <td-checkbox label="Principal" [formControl]="controlPrincipal" />
 ```
 
+## Radio Button
+
+`TdRadioGroup` permite selección única tipada y mantiene compatibilidad con
+Signal Forms, `ngModel` y Reactive Forms.
+
+```html
+<td-radio-group
+  label="Tipo de documento"
+  [options]="tiposDocumento"
+  [(ngModel)]="tipoDocumento"
+/>
+```
+
+```ts
+readonly tiposDocumento = [
+  { value: 'dni', label: 'DNI' },
+  { value: 'ruc', label: 'RUC' },
+  { value: 'ce', label: 'Carné de extranjería' },
+];
+
+tipoDocumento: 'dni' | 'ruc' | 'ce' | null = 'ruc';
+```
+
+También cuenta con variante tipo tarjeta:
+
+```html
+<td-radio-group
+  label="Canal de notificación"
+  variant="card"
+  direction="horizontal"
+  [options]="canales"
+  [formField]="fields.canal"
+/>
+```
+
 Con Signal Forms no se necesita una variable intermedia ni eventos manuales. El
 modelo debe inicializar el campo como `true` o `false`, nunca como `null`.