Files
fn_registry/frontend/functions/ui/checkbox.md
T
egutierrez 2d108c295a refactor: migrate frontend from shadcn/Tailwind to Mantine v9
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>
2026-04-06 23:46:44 +02:00

1.9 KiB

name, kind, lang, domain, version, purity, signature, description, tags, uses_functions, uses_types, returns, returns_optional, error_type, imports, output, tested, tests, test_file_path, file_path, props, emits, has_state, framework, variant
name kind lang domain version purity signature description tags uses_functions uses_types returns returns_optional error_type imports output tested tests test_file_path file_path props emits has_state framework variant
checkbox component ts ui 1.0.0 impure Checkbox(props: CheckboxProps): JSX.Element Input booleano accesible con label opcional y variante indeterminate. Mantine Checkbox.
checkbox
component
ui
interactive
form
mantine
false
@mantine/core
Componente Checkbox que renderiza input booleano accesible con label opcional y estado indeterminate false
frontend/functions/ui/checkbox.tsx
name type required description
label string false Texto de etiqueta visible junto al checkbox
name type required description
indeterminate boolean false Estado indeterminate (guion) en vez de checked/unchecked
name type required description
checked boolean false Estado controlado del checkbox
name type required description
defaultChecked boolean false Estado inicial no controlado
name type required description
disabled boolean false Deshabilita el checkbox
name type required description
onCheckedChange (checked: boolean) => void false Callback cuando cambia el estado
onCheckedChange
false react

Ejemplo

// Basico
<Checkbox label="Acepto los terminos" />

// Controlado
<Checkbox
  label="Seleccionar todos"
  checked={allSelected}
  indeterminate={someSelected}
  onCheckedChange={setAllSelected}
/>

// Sin label
<Checkbox checked={isActive} onCheckedChange={setIsActive} />

Notas

Usa Mantine Checkbox para accesibilidad completa (keyboard, ARIA). El estado indeterminate se muestra con un guion horizontal. El callback onCheckedChange se adapta desde el onChange nativo de Mantine.