Mantine

Cubre casos que otras librerías dejan para paquetes aparte: fechas, notificaciones, dropzone, rich text editor, todos bajo el mismo sistema de theming.

Instalación

pnpmbunnpm

pnpm add @mantine/core @mantine/hooks

bun add @mantine/core @mantine/hooks

npm install @mantine/core @mantine/hooks

Configuración inicial

main.tsx

import { MantineProvider } from "@mantine/core"
import "@mantine/core/styles.css"

;<MantineProvider>
  <App />
</MantineProvider>

Cada paquete extra (@mantine/dates, @mantine/notifications, etc.) trae su propio CSS que hay que importar aparte.

Tips

• @mantine/hooks se puede usar solo, sin @mantine/core, como colección de hooks utilitarios (useDisclosure, useDebouncedValue).
• El modo oscuro es una prop del provider (defaultColorScheme), no requiere Tailwind ni clases dark:.