FerNotify

Sistema moderno de notificaciones para la web — cero dependencias externas.

v2.0.0 — Sin anime.js ni Boxicons

Desde la versión 2.0.0, FerNotify no requiere ninguna librería externa. Las animaciones son CSS nativas y los iconos son SVGs inline.

¿Qué es FerNotify?

FerNotify es una librería JavaScript/TypeScript que provee dos tipos de notificaciones:

  • Modales (notify.success(...)) — notificaciones bloqueantes con botones, timers y callbacks
  • Toasts (notify.toastSuccess(...)) — notificaciones no bloqueantes tipo snackbar
✅ Características
  • 5 tipos: success, error, warning, info, question
  • Dark Mode automático (detecta el tema del sistema)
  • Animaciones CSS nativas (sin anime.js)
  • Iconos SVG inline (sin Boxicons)
  • Accesible: teclado completo + ARIA
  • Compatible con CDN, npm, React y TypeScript

Inicio rápido

CDN (UMD)
ES Module (CDN)
npm
<!-- Agrega este script a tu HTML — sin dependencias externas -->
<script src="https://cdn.jsdelivr.net/gh/Fernandocabal/fernotify@latest/dist/notification-system.js"></script>

<script>
  notify.success('¡Listo!', 'FerNotify instalado');
</script>

<script type="module">
  import NotificationSystem from 'https://cdn.jsdelivr.net/gh/Fernandocabal/fernotify@latest/dist/notification-system.esm.js';
  const notify = new NotificationSystem();
  notify.success('¡Funcionando con módulos!');
</script>

npm install fernotify

import NotificationSystem from 'fernotify';

const notify = new NotificationSystem();
notify.success('¡Instalado vía npm!');

Ejemplo de toast

notify.toastSuccess('Datos guardados correctamente');
notify.toastError('Error al conectar con el servidor');
notify.toastLoading('Procesando...', 'Espera');

// Patrón async/await recomendado:
notify.toastLoading('Enviando...', 'Espera');
try {
  await fetch('/api/save', { method: 'POST' });
  await notify.closeToastLoading();
  notify.toastSuccess('Guardado correctamente');
} catch {
  await notify.closeToastLoading();
  notify.toastError('Error al guardar');
}

Continúa en Instalación →

next Instalación