Ir al contenido

@inzumer/ui-library

Componentes accesibles para la web, organizados con atomic design. Repositorio: inzumer-ui-library · Storybook: ui-web.inzumer.com.

Ventana de terminal
pnpm add @inzumer/ui-library @inzumer/tokens react react-dom class-variance-authority clsx tailwind-merge
  • Tailwind 4: las clases usan la sintaxis v4, así que la app necesita Tailwind 4, el preset de tokens con @config y escanear la librería:

    @import 'tailwindcss';
    @config './tailwind.config.ts';
    @source '../node_modules/@inzumer/ui-library/dist';
  • Íconos: familia propia en el estilo de Google Material Symbols, citados por id en kebab-case: <Icon name="arrow-forward" />, <Icon name="pinterest" />.

  • Accesibilidad: zonas táctiles de 44px, foco visible, prefers-reduced-motion y axe en Storybook (claro y oscuro).

  • Incluye, entre otros: Button, Badge, Chip, Filter, Loader (con modo pantalla), Modal, BottomSheet, Carousel, Navbar, SocialLinks, IconLink y CookieConsent.