Ranking

Exibe uma tabela de ranking composta por subcomponentes atômicos.

Exemplos

Padrão

API

Ranking

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo da tabela de ranking.
className	string	Classes CSS adicionais.

RankingHeader

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo da linha de cabeçalho.
className	string	Classes CSS adicionais.

RankingHeaderCell

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo da célula.
tooltip	string	Texto opcional do tooltip, exibido no hover por meio de um ícone de informação.
highlight	boolean	Quando true, envolve o conteúdo em um fundo circular de badge. Normalmente usado na coluna do número da posição.

RankingBody

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo do corpo da tabela. Deve conter elementos RankingItem.
className	string	Classes CSS adicionais.

RankingItem

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo da linha do ranking. Deve conter os subcomponentes de coluna.
className	string	Classes CSS adicionais.

RankingNumber

Propriedade	Tipo	Descrição
children	ReactNode	Número da posição, exibido dentro de um badge circular.

RankingTopicColumn

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo da coluna. Normalmente contém RankingTopicContent e, opcionalmente, RankingSuperFocus.

RankingTopicContent

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo de texto do tema. Normalmente contém RankingSpecialty e RankingTopic.

RankingSpecialty

Propriedade	Tipo	Descrição
children	ReactNode	Nome da especialidade, exibido acima do nome do tema.

RankingTopic

Propriedade	Tipo	Descrição
children	ReactNode	Nome do tema, exibido como label principal.

RankingSuperFocus

Propriedade	Tipo	Descrição
children	ReactNode	Texto da tag. Renderiza um Tag com fundo em gradiente e o ícone CheckboxFill fixo, que indica um foco em destaque. Os demais atributos HTML (como className) são repassados ao Tag.

RankingAssigneesColumn

Propriedade	Tipo	Descrição
children	ReactNode	Conteúdo da coluna. Normalmente contém RankingAssigneeLabel e/ou RankingAssigneeGroup.

RankingAssigneeLabel

Propriedade	Tipo	Descrição
children	ReactNode	Texto de label opcional, renderizado acima dos avatares.

RankingAssigneeGroup

Propriedade	Tipo	Descrição
children	ReactNode	Grupo de avatares. Deve conter elementos RankingAssigneeItem.

RankingAssigneeItem

Propriedade	Tipo	Descrição
src	string	URL da imagem do avatar.
alt	string	Texto alternativo da imagem do avatar. Sem alt, usa o tooltip quando ele é texto; sem os dois, a imagem fica decorativa (alt="").
fallback	string	Texto de fallback exibido quando a imagem não carrega. O padrão é "?".
tooltip	ReactNode	Conteúdo opcional do tooltip, exibido no hover ou no foco do avatar. Com tooltip, o avatar entra na ordem de Tab.

RankingPriority

Propriedade	Tipo	Descrição
children	ReactNode	Label de prioridade, renderizado dentro de uma tag soft.
icon	ReactElement	Ícone opcional exibido dentro da tag de prioridade.

RankingQuestions

Propriedade	Tipo	Descrição
questions	number	Número total de questões disponíveis. Usado para calcular o preenchimento da barra de progresso.
answered	number	Número de questões respondidas até agora. Quando answered === 0, exibe o estado "Não iniciado" em vez da barra de progresso.

RankingPerformance

Propriedade	Tipo	Descrição
answered	number	Número de questões respondidas. Quando answered === 0, exibe o estado "Não iniciado".
correct	number	Número de respostas corretas. Usado junto com answered para exibir o subtítulo de acertos (ex.: "9 de 10 acertos").
minQuestions	number	Número mínimo de questões para avaliar o desempenho. Quando answered < minQuestions, exibe o estado de aviso "Mínimo não atingido" com a quantidade de questões que faltam.

RankingButton

Propriedade	Tipo	Descrição
children	ReactNode	Texto do botão.
onClick	() => void	Função chamada quando o usuário clica no botão de ação.