feat: add toast container component and create testing page for reusable UI elements
This commit is contained in:
@@ -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" />
|
||||
|
||||
@@ -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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user