CmSignalList
Lista selecionável com nome, cadeado e intensidade de sinal: a lista de redes de um instalador, de espelhos de repositório, de dispositivos ao alcance. Uma escolha só, e a escolha precisa mostrar qual opção é boa antes de ser feita.
Import
import { CmSignalList } from "cosmemilton-ui/client";Redes ao alcance
Lista controlada com cadeado, intensidade, descrição, meta e um item indisponível.
Rede escolhida:
escola-lab-2Varredura sem resultado
emptyState no lugar da lista enquanto nada foi encontrado.
Última varredura: nenhuma rede.
Nenhuma rede sem fio encontrada
Aproxime o equipamento do roteador ou conecte o cabo de rede para seguir com a instalação.
API rápida
Props principais de cada peça exportada.
CmSignalList
CmSignalListItem
Notas
A lista é de rádios NATIVOS, não de role="option": seleção única com navegação por setas é exatamente o que o rádio já faz, e reimplementar o roving tabindex de um listbox aqui seria escrever (e manter) teclado que o navegador entrega de graça.
O estado visual da linha selecionada sai do CSS (:has(:checked)), pelo mesmo motivo do CmChoiceCard.
onChange recebe (id, item) — o item inteiro vem junto, para você não ter que procurar no array de novo.
signal é de 0 a 100 e undefined esconde as barras. A conversão para barras acesas é a do CmSignalBars, com piso 1 para qualquer sinal recebido.
emptyState só aparece quando items está vazio — é o "nenhuma rede encontrada" da varredura.
signalLabel(signal, item) dá o texto que o leitor de tela ouve no lugar das barras; sem ele o indicador é decorativo, já que o nome da rede está ao lado. locked desenha o cadeado e anuncia lockedLabel (padrão "protegida").
name é o name dos rádios (padrão cm-signal-list). Duas listas na mesma página precisam de names diferentes, senão o navegador as trata como um grupo só.