Navegar componentes

CheckboxListItem

MiscExemplo

Item de checkbox individual com label, description e slot de end content. Funciona em modo collection (dentro de CheckboxList) ou modo standalone (dentro de List).

Importação

import {CheckboxListItem} from '@pharos-ds/core/CheckboxListItem';

Exemplos

Área interativa

isDisabled

Canal

Alertas por e-mail

Código

import {CheckboxListItem, CheckboxList} from '@pharos-ds/core/CheckboxList';

<CheckboxListItem
  label="Alertas por e-mail"
  value="email"
  isDisabled={false}
 />

Props

Prop	Tipo	Padrão	Descrição
`label` *	`ReactNode`	—	Label de texto principal do item. Uma string simples nomeia o checkbox automaticamente; um label rico (ReactNode) deve ser pareado com aria-label para que leitores de tela recebam um nome conciso.
`aria-label`	`string`	—	Nome acessível em texto simples para o checkbox quando label é um ReactNode. Aplicado ao controle do checkbox. Sem ele, itens com label rico anunciam apenas o genérico "Checkbox" para leitores de tela.
`value`	`string`	—	Chave de identidade (obrigatória dentro de CheckboxList).
`description`	`string`	—	Texto secundário abaixo do label.
`endContent`	`ReactNode`	—	Conteúdo renderizado após a área do label.
`isDisabled`	`boolean`	`false`	Se este item individual está desabilitado.
`isLoading`	`boolean`	`false`	Se este item está carregando. Exibe um spinner dentro do checkbox e bloqueia interação neste item. Em modo collection, o item alternado também mostra isso automaticamente enquanto o changeAction pai está pendente.
`isChecked`	`boolean \| 'indeterminate'`	—	Estado checked direto (apenas modo standalone).
`onCheck`	`(checked: boolean) => void`	—	Handler de check direto (apenas modo standalone).

Pacote: @pharos-ds/core · Import: @pharos-ds/core/CheckboxListItem