Componente

CmIconBadge

Ícone em círculo para detalhes, status e listas compactas.

Import

Caminho público recomendado para este componente.

import { CmIcon, CmIconBadge, CmRow, CmStack, CmText } from "cosmemilton-ui";

Use icon para passar qualquer ReactNode de ícone, preferencialmente CmIcon para manter a documentação dentro da biblioteca.

tone aceita default, primary, success, warning, danger e info. O componente aplica cor e fundo suave sem estilo inline.

size aceita xs, sm e md. Use xs em cards compactos e sm/md em listas ou cabeçalhos.

A composição comum deve vir de CmRow, CmStack e CmText para manter o visual no sistema da biblioteca.

Quando o ícone for apenas decorativo, passe aria-hidden="true" no ícone e mantenha o significado no texto ao lado.

Básico

Use quando o ícone precisa de destaque sem virar botão nem badge textual.

Tons

Os tons seguem os tokens de status da biblioteca e funcionam bem em painéis de detalhe.

Com texto

Combine com CmRow, CmStack e CmText para criar linhas compactas como as usadas no painel da DataTable.

StatusPagamento confirmado