Reescribe todos los componentes UI para usar Mantine v9 en lugar de shadcn/Tailwind.
Elimina cn(), CVA, components.json, theme_provider custom y globals.css con Tailwind.
Añade 25+ componentes nuevos (AppShell, AuthForm, DatePickerInput, Dropzone, etc.)
y MantineProvider como wrapper estándar del sistema de temas.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Panel lateral deslizante (drawer) accesible con variantes de lado y animaciones. Mantine Drawer.
sheet
drawer
panel
component
ui
interactive
overlay
mantine
false
@mantine/core
react
Componente Sheet que renderiza panel deslizante lateral accesible con animaciones via Mantine Drawer
false
frontend/functions/ui/sheet.tsx
name
type
required
description
side
'top' | 'bottom' | 'left' | 'right'
false
Lado desde el que aparece el panel (default: right)
name
type
required
description
showCloseButton
boolean
false
Muestra el boton de cierre (default: true)
name
type
required
description
open
boolean
false
Estado controlado de apertura
name
type
required
description
onOpenChange
(open: boolean) => void
false
Callback cuando cambia el estado
onOpenChange
false
react
top
bottom
left
right
Ejemplo
<Sheet><SheetTriggerasChild><Buttonvariant="outline">Abrirpanel</Button></SheetTrigger><SheetContentside="right"><SheetHeader><SheetTitle>Editarperfil</SheetTitle><SheetDescription>Realizacambiosentuperfil.</SheetDescription></SheetHeader><divclassName="py-4">{/* contenido del panel */}</div><SheetFooter><SheetCloseasChild><Buttonvariant="outline">Cancelar</Button></SheetClose><Button>Guardar</Button></SheetFooter></SheetContent></Sheet>
Notas
Reutiliza Mantine Drawer para el comportamiento modal y animaciones. SheetPortal y SheetOverlay son no-ops mantenidos por compatibilidad. Exports: Sheet, SheetTrigger, SheetContent, SheetClose, SheetPortal, SheetOverlay, SheetHeader, SheetFooter, SheetTitle, SheetDescription.