feat: add toast container component and create testing page for reusable UI elements

This commit is contained in:
2026-07-01 12:02:50 -03:00
parent 0363280ede
commit 3b7615fd85
4 changed files with 42 additions and 5 deletions

View File

@@ -50,6 +50,15 @@
<app-button variant="danger" (click)="triggerToast('danger')">Trigger Danger</app-button>
</div>
</div>
<div class="button-group">
<h2>Toasts Persistentes (No se van)</h2>
<div class="button-grid">
<app-button (click)="triggerPersistentToast('info')">Info Persistente</app-button>
<app-button variant="secondary" (click)="triggerPersistentToast('success')">Success Persistente</app-button>
<app-button variant="danger" (click)="triggerPersistentToast('danger')">Danger Persistente</app-button>
</div>
</div>
</div>
<hr class="section-divider" />

View File

@@ -82,4 +82,14 @@ export class ReutilizablesTestPageComponent {
this.toastService.info('Información del sistema: Hay una nueva actualización disponible.');
}
}
protected triggerPersistentToast(type: 'success' | 'danger' | 'info'): void {
if (type === 'success') {
this.toastService.success('¡Éxito persistente! Esta alerta no se cerrará sola.', 0);
} else if (type === 'danger') {
this.toastService.danger('¡Error persistente! Por favor, atienda este problema y ciérrelo manualmente.', 0);
} else if (type === 'info') {
this.toastService.info('Información persistente: Mantendremos este aviso en pantalla.', 0);
}
}
}