Servicio de Notificaciones Toast para Angular | ng-hub-ui-toast

Servicio de notificaciones toast standalone para Angular con Signals, observables de ciclo de vida, barra de progreso, seis posiciones y tematización con variables CSS.

Referencia API

Aquí tienes el contrato completo de toast: todo lo que puedes enlazar, escuchar, proyectar y personalizar, reunido en un solo sitio. Enlaza lo que necesites y dale el estilo que quieras — es standalone y reactivo con signals.

Inputs

Ajusta toast a tu gusto con 10 inputs. Se enlazan como cualquier @Input de Angular.

NombreTipoPor defectoDescripción
data (hub-toast)ObligatorioHubToastDataEl toast a renderizar: id, tipo, mensaje, título opcional, configuración resuelta y subjects de ciclo de vida. Lo proporciona internamente ToastContainerComponent — normalmente nunca lo enlazas tú.
timeOut / extendedTimeOut (config)number5000 / 2500timeOut es la duración en ms antes del descarte automático (0 = persistente); extendedTimeOut es el tiempo extra concedido después de que el usuario deje de pasar el cursor sobre el toast.
closeButton / progressBar (config)booleantrue / falsecloseButton muestra un botón de descarte en el toast; progressBar muestra una barra con la cuenta atrás hasta el descarte automático.
tapToDismiss (config)booleantrueCierra el toast cuando el usuario hace clic en cualquier parte de él.
disableTimeOut (config)boolean | 'timeOut' | 'extendedTimeOut'falseDesactiva el descarte automático: true o 'timeOut' desactivan el temporizador inicial; 'extendedTimeOut' desactiva solo la extensión por hover.
newestOnTop (config)booleantrueCuando es true, el toast más reciente se inserta en la parte superior de la pila en lugar de en la inferior.
positionClass (config)HubToastPosition | string'toast-top-right'Posición en pantalla del contenedor de toasts: una de las seis clases integradas toast-top/bottom-left/center/right, o una cadena de clase personalizada.
maxOpened (config)number0Número máximo de toasts visibles simultáneamente; 0 significa sin límite.
autoDismiss (config)booleanfalseCuando se alcanza maxOpened, elimina automáticamente el toast más antiguo para hacer sitio al nuevo.
preventDuplicates (config)booleanfalseIgnora un toast nuevo cuyo mensaje y tipo coinciden con uno ya visible, devolviendo en su lugar el manejador del toast existente.

Outputs

Reacciona a lo que hace toast: 1 eventos a los que enganchar tu lógica.

NombreTipoDescripción
closed (hub-toast)EventEmitter<number>Emite el id del toast cuando este debe descartarse — tras el temporizador de descarte automático, un toque con tapToDismiss o el botón de cierre.

Métodos

Controla toast desde el código — 7 métodos en su superficie programática.

NombreFirmaDevuelveDescripción
ToastService.successsuccess(message: string, title?: string, config?: Partial<HubToastConfig>): HubToastRefHubToastRef handle for the created toastMuestra un toast de éxito con el mensaje dado, un título opcional y anulaciones de configuración por llamada.
ToastService.errorerror(message: string, title?: string, config?: Partial<HubToastConfig>): HubToastRefHubToastRef handle for the created toastMuestra un toast de error con el mensaje dado, un título opcional y anulaciones de configuración por llamada.
ToastService.warningwarning(message: string, title?: string, config?: Partial<HubToastConfig>): HubToastRefHubToastRef handle for the created toastMuestra un toast de advertencia con el mensaje dado, un título opcional y anulaciones de configuración por llamada.
ToastService.infoinfo(message: string, title?: string, config?: Partial<HubToastConfig>): HubToastRefHubToastRef handle for the created toastMuestra un toast informativo con el mensaje dado, un título opcional y anulaciones de configuración por llamada.
ToastService.showshow(message: string, title?: string, config?: Partial<HubToastConfig>, type?: HubToastType | string): HubToastRefHubToastRef handle for the created toastMuestra un toast con una cadena de tipo integrada o personalizada; el tipo se aplica como data-type en el host del toast y gobierna el estilo del acento.
ToastService.removeremove(toastId: number): voidvoidElimina un toast concreto mediante el id devuelto por los métodos show.
ToastService.clearclear(): voidvoidElimina todos los toasts activos inmediatamente, completando el observable onHidden de cada toast.

Templates

Todavía no hay templates documentados.