title *

string

• —

Título necessário que traga a informação principal de forma clara e objetiva.

subtitle

string

• —

Serve para trazer mais alguma informação relevante para o Card.

overline

ReactElement

• ReactElement<TypographyProps>

• ReactElement<TagProps>

• ReactElement<IconProps>

O overline serve para dar e reforçar o contexto do Card. Ele pode ser um Typography com estilo overline ou paragraph-sm, uma tag ou um ícone.

actionButton

ReactElement

• ReactElement<ActionButtonProps>

O Card pode ter um ActionButton no header que permite ao usuário realizar alguma ação.

as

CardHtmlTags

• article

• aside

• div (default)

• li

Tags HTML customizadas, como li para colocar os Cards em uma ul

children

ReactNode

• —

Espaço que aceita diversos tipos de conteúdo.

image

CardImageProps

• —

Props para imagem do Card.

onClick

(event: SyntheticEvent) => void

• —

Função chamada quando o Card é clicado. Se passada, o card será clicável e o título será uma tag button. O card também será focável (via Tab), e teclar "Enter" ou "espaço" invocarão este método.

event é o objeto de evento do clique.

onClickHref

string

• —

URL para que o card atue como um link. Se passada, o card será clicável e o título será uma tag a. Se o método onClick também for passado, ele será utilizado e a prop onClickHref será ignorada.

onClickTarget

string

• _self (default)

• _blank

• _parent

• _top

Target para ser utilizado em conjunto com a prop onClickHref. Será aplicado na tag a.

customProps

{title?: TypographyProps; subtitle?: TypographyProps}

Props específicas para componentes internos já definidos.

src

string

• —

URL da imagem do Card.

alt

string

• —

Descrição da imagem do Card.

placement

string

• left

• top (default)

Posição da imagem em relação ao conteúdo.

size

string

• —

Tamanho da imagem. Se imagePlacement = 'top', o tamanho será a altura da imagem. Se imagePlacement = 'left', o tamanho será a largura da imagem. Por padrão é 160px.