Um popover é um pequeno painel que abre ao lado de um botão, para conteúdo interativo: filtros, um formulário curto, um seletor de cores. Ele é um popover="auto" nativo, então o navegador o fecha com Esc ou um clique fora, devolve o foco e o coloca logo depois do gatilho na ordem de tabulação.
Um hovercard é um tooltip rico. Ele abre depois de um breve hover, ou na hora com o foco do teclado, e descreve o seu gatilho. Ele continua aberto enquanto o ponteiro se move sobre ele, então o texto pode ser lido e selecionado.
Os dois mudam para o outro lado quando falta espaço, ficam na tela e acompanham o gatilho quando a página rola.
Filtros
Um popover com um formulário dentro. arrow o faz apontar para o gatilho, e hide() o fecha pelo código.
Showing open, in review issues.
Hovercard
Passe o mouse sobre um nome, ou chegue até ele com Tab. O card descreve o link, então os leitores de tela o leem depois do nome.
Lados e animações de entrada
side e align definem onde ele abre; start e end seguem a direção da escrita. enter e motion definem como ele entra em cena.