Interações

O que um clique, uma tecla ou um hover faz além de pressionar um botão. Cada caso é um banco: experimente com o ponteiro, depois apenas com o teclado.

Copiando um valor

copy_button({ value }): o ícone sozinho onde o botão fica ao lado do que copia, ou com sua palavra. Um check por dois segundos uma vez copiado, um cruz quando a área de transferência recusou — nunca uma alegação que não aconteceu.

Copiando o que a página mostra

copy_button({ target }): o texto de um elemento, lido como está no momento do clique.

Um bloco de código

code-block com copy: true — o botão aparece no canto enquanto o bloco é apontado ou acessado com Tab, e permanece visível em uma tela sem ponteiro.

9483a-8b194
28811-eb8b3
b44d2-eb15a
9d935-03932

Em um fallback

O valor de um fallback vem com seu botão de cópia.

O que verificar

• Tab alcança cada botão; Enter e Espaço copiam.
• Sobre http simples (um host de desenvolvimento) a cópia ainda funciona, do jeito antigo.
• Colado em outro lugar, o texto é exatamente o valor: sem espaço, sem linha adicionada.
• Um leitor de tela diz « Copiado » após o clique.