Skip to main content

Item-list

Visão geral#

O componente item-list é a menor parte da lista de ação que compõem o componente listbox.

Componentes relacionados

Anatomia#

O item-list é composto pela label. Também contém partes que são específicas de estados de interação, como background no estado hover.

Item-list com as 3 partes sinalizadas

1. Label

2. Outline (focused)

3. Background (hover)

O componente é estruturado e estilizado por meio dos design tokens. Os tokens que podem ser alterados pelas marcas estão listados na seção de propriedades customizáveis.

Acessibilidade tratada no componente#

Algumas diretrizes de acessibilidade já são tratadas no componente, internamente, e não podem ser alteradas pelo proprietário do conteúdo. São elas:

  • Usar medidas relativas para possibilitar um zoom de até 200%, sem perda do conteúdo ou funcionalidade.(WCAG 1.4.4: Resize Text)
  • Áreas de clique ou toque para elementos interativos devem ter pelo menos 44x44 pixels. (WGAG 2.5.8: Target Size (Minimum))
  • Utilizar nome, função e valor adequadamente, pois estes parâmetros são utilizados por tecnologias assistivas para identificar os elementos da interface. (WCAG 4.1.2: Name, Role, Value)