jdev-nui (Nebula UI)

Librería de componentes independientes en JavaScript vanilla + SASS para armar páginas y landings modernas.

npm install jdev-nui

Regla de diseño: cada componente funciona solo. Combinarlos es decisión del usuario en su proyecto.

Catálogo interactivo

Cloná el repo y ejecutá npm run dev para abrir el configurador visual: elegís componente, ajustás parámetros y copiás el código.

Uso rápido

import { BubbleBackground, NebulaCard } from 'jdev-nui';
import 'jdev-nui/styles';

new BubbleBackground('#hero', {
  cantidadBurbujas: 12,
  colores: ['rgba(160, 210, 255, 1)', 'rgba(190, 170, 255, 1)'],
  iridiscencia: true,
});

const card = NebulaCard.crear({ titulo: 'Hola', texto: 'Mi landing.' });
document.querySelector('#hero').appendChild(card.elemento);

// Varias cards (productos)
NebulaCard.crearVarias('#grid-productos', [
  { tipo: 'con-imagen', titulo: 'Producto A', precio: '$99' },
  { tipo: 'con-imagen', titulo: 'Producto B', precio: '$129' },
]);

Actualizar en otro proyecto

npm install jdev-nui@latest
# o
npm update jdev-nui

Verificá en package.json que la versión sea la nueva (ej. "^0.4.0") y reiniciá el dev server.

Publicar actualizaciones

npm run build
npm publish

Desarrollo local

npm install
npm run dev      # Catálogo → http://localhost:3000
npm run build

Componentes

| Componente | Import | |---|---| | BubbleBackground | jdev-nui o jdev-nui/bubble-background | | NebulaCard | jdev-nui o jdev-nui/nebula-card | | Estilos | jdev-nui/styles |

Progreso

| Versión | Componentes | |---|---| | 0.4.0 | Burbujas rediseñadas, crearVarias, landing documentación | | 0.3.0 | BubbleBackground, NebulaCard (configurador visual) | | 0.2.0 | BubbleBackground, NebulaCard |

Ver CHANGELOG.md.

Licencia

MIT