z-uiDesign system
Componentes · z-ui

CardCheckbox

Checkbox em forma de cartão. O cartão inteiro é o rótulo do controle, então qualquer clique nele marca ou desmarca, e o leitor de tela continua anunciando uma caixa de seleção.

Opções do envelope

Marcado, o cartão ganha fundo e borda da cor de ação e o ícone vira sólido.

Selecionadas: ordered

Tamanhos e desabilitado

Props

PropTipoPadrãoDescrição
labelReactNode—Texto principal do cartão. Rotula o checkbox.
descriptionReactNode—Texto de apoio, ligado ao controle por aria-describedby.
iconReactNode—Ícone entre o checkbox e o texto.
checkedboolean | "indeterminate"—Estado controlado.
defaultCheckedboolean—Estado inicial quando não controlado.
onCheckedChange(checked: boolean) => void—Recebe true ao marcar e false ao desmarcar.
size"sm" | "md" | "lg""md"Espaçamento, ícone e tipografia do rótulo.
disabledbooleanfalseBloqueia o controle e esmaece o cartão.
name / value / requiredstring / string / boolean—Repassados ao checkbox para envio em formulário.