Progresso

O quão longe algo chegou, representado como uma razão entre 0 e 1 em uma propriedade personalizada — da mesma forma que o círculo de status carrega seu arco, ambos os lados da pilha preenchem a barra com uma declaração. Twig imprime o valor que recebe; movê-lo depois é responsabilidade do navegador.

Estados

O valor é uma contagem ou uma participação escrita como uma porcentagem, e nunca responde fora de seus limites. A cor é a do feedback, então uma barra diz como seu trabalho terminou na mesma linguagem que uma mensagem ou um status.

Na fila0%

Construindo recursos35%

Fazendo upload72%

Implantado100%

Migração falhou58%

Sem um total

Cem é o que uma barra conta quando ninguém diz o contrário, o que faz da porcentagem a única coisa que pode dar a ela. Um total próprio é para trabalho contado em coisas em vez de em partes.

Arquivos lidos43%

Um fim que não é conhecido

Trabalho em andamento cujo tamanho ninguém conhece: a barra varre e não diz um número. Reivindicar uma participação aqui seria um palpite disfarçado de medição.

Procurando algo

Compacto

Reduzido ao que precisa dizer, para uma linha de status ou um rodapé: uma trilha mais fina, a redação ao lado em vez de acima, e a densidade passada para o que estiver ao seu lado.

Vue, dirigido

A mesma barra, com o vocabulário que o progresso do cli já fala — atualizar, avançar, finalizar, redefinir. Um passo sobre o qual nada é dito vale uma unidade, que é o que se deve chamar onde nem a unidade nem o total significam algo.