import { NotificationGroup } from '../../../../shared/types/message'; /** Grupo activo del servicio de notificaciones (cola, color de mazo, `isLeaving`, etc.). */ export interface NotificationItemProps { /** Estado del mazo: cola, contador, progreso de temporizador y bandera de salida animada. */ group: NotificationGroup; } /** * Stack superpuesto anclado por la base: como máximo **3** notificaciones en vista previa; * con **hover** se muestran todas las de la cola. El desfase vertical aumenta al expandir. * Con hover, un clic fuera de controles interactivos abre la lista vertical con toda la cola. * La lista extendida no se cierra al salir el puntero del mazo (solo deja de contar como hover expandido). * Cerrar una notificación no debe colapsar el mazo ya extendido por hover (se suprime el mouseleave espurio). * Cierre **individual** por tarjeta inferior (`dismiss(id)`); cerrar la **frontal** (más reciente) vacía * todo el mazo (`dismissStack`). El **timer** (barra) solo en la más reciente; al expirar se cierra el grupo entero. * Con **hover** en el mazo (varias notas, vista **apilada**), el pie y la barra se atenúan con la misma * transición que el stack (sin `display: none`), sin pausar el temporizador del servicio. Tras abrir la * **lista completa** (clic en el grupo), el hover ya no atenúa la barra de progreso; el pie de total * («N notificaciones más» o `stackSummaryLegend` en `notify.message`) no se muestra en esa vista. Al expirar el temporizador de la más reciente, se vacía el mazo. * La cola del servicio mantiene **antigua → reciente**; la **vista** apila y lista **reciente → antigua** * (la más nueva al frente / arriba en la lista). Al cerrar una, las demás suben de orden; al pasar * `stackMax`, se expulsa la más antigua. El estrechamiento horizontal sigue la profundidad visual * (2ª = menos profunda / menos recorte; 3ª = más profunda / más recorte; al hover, 100%). * Con **más de una** notificación en el mazo (vista apilada), las alertas usan `animation="none"` y anulan * `transition-all` del `Alert` (`!ui-transition-none`) para no interpolar opacidad/layout sobre capas inferiores. * El listado (`NotificationPositions`) usa una `key` estable por color para no remontar * todo el mazo al entrar o salir notificaciones; el grupo se muta in-place en el servicio, así que este * componente no debe envolverse en `React.memo` por referencia de `group` (bloquearía la cola en pantalla). * * Tras cada cambio de cola se aplica un breve “asentamiento” (ver `STACK_LAYOUT_SETTLE_MS`) sin * transición de **padding** en el contenedor del mazo (evita solape con clics muy rápidos). Las capas * conservan transición en `bottom` para que el hover expanda siempre con animación, incluso justo * después de mostrar el stack. * * @example * import { NotificationItem } from '@imj_media/ui'; * * */ export declare const NotificationItem: { ({ group }: NotificationItemProps): import("react/jsx-runtime").JSX.Element | null; displayName: string; }; //# sourceMappingURL=NotificationItem.d.ts.map