Basic List

Estrutura utilizada para organizar e exibir uma coleção de itens que não possui interações de forma sequencial

Figma

---

Uso

O componente Basic List é empregado para ordenar e apresentar uma coleção de itens de maneira sequencial, especialmente quando a lista em si não requer interação direta. No entanto, os elementos individuais dentro da lista podem ou não ser interativos.

---

Anatomia

1. Slots (Opcional)

• Espaços reservados para componetes que façam sentido para o contexto. Podem ser substituídos por botões, tags, thumbnail e outros.

2. Index (Opcional)

• Indice para numeração de músicas ou rankings.

3. Text Style

• O Text Style refere-se ao estilo de texto.

• O tamanho do texto deve ser adaptado ao contexto em que está sendo aplicado, respeitando as variantes de Mobile e Desktop do componente de Text Style.

• Aplicar os tamanhos de acordo com as recomendações de uso da guideline de tipografia.

Padding

-> PaddingOn

Essa variante é pensada principalmente para aplicações em desktop.

-> Padding Off

Essa variante é otimizada para dispositivos móveis e para aplicações de listas dentro de cards, modais e outros. Isso garante um melhor aproveitamento do espaço em telas menores.

---

Use cases

User Activity

Bullet

---

Referências

Material Design

---

Histórico de Atualizações

Figma	Gitbook	Android	iOS	Web
10/04/2024	11/04/2024			Ver na tabela

Atualizações por data

Abril 2024

• https://github.com/Letras-mus-br/issues/issues/848

Percebeu um erro, ficou com dúvida ou tem uma sugestão?

Contribua com o Kósmos preenchendo nosso formulário de contribuição — sua colaboração ajuda a tornar o Design System mais claro, útil e evolutivo para todo o time.