Copiando um conteúdo com ícone de cópia

Olá, em vez de imprimir um dado fornecido pelo plugin através de um formulário, quero permitir que os usuários copiem este conteúdo quando desejarem, clicando em um ícone de ‘copiar’.

Notei que o Discourse introduziu essa funcionalidade para blocos de código, mas ela só funciona dentro desses blocos. Como posso usá-la em outros lugares, como desejo?

Obrigado,

Talvez este Theme component seja o que você procura 📄 Copy Post Component pode copiar uma postagem inteira com ele

5 curtidas

Quero usá-lo para dados do plugin Custom Wizard, o que significa que quero habilitar a cópia de uma frase específica. Acho que o componente de tema não oferece isso. Mas, eu poderia conseguir isso personalizando?

Você está certo, o componente copia todo o conteúdo da postagem. Isso parece personalizável, com certeza. Você pode compartilhar um exemplo visual do que você espera? Eu nunca usei este plugin, então não tenho certeza em qual etapa ou contexto você quer essa personalização.

2 curtidas

Ao criar uma página com o plugin Custom Wizards, quero copiar a saída das variáveis que o plugin me fornece. Assim, podemos pensar nisso como uma área selecionada aleatoriamente no conteúdo da mensagem. Posso atribuir um seletor CSS personalizado ao conteúdo a ser copiado.

https://github.com/keegangeorge/discourse-copy-post/blob/main/javascripts/discourse/widgets/copy-widget.js

  click(attrs) {
    const copyButton = attrs.currentTarget.activeElement;
    const rawCooked = this.attrs.attrs.cooked;
    const cookedText = this.attrs.attrs.cooked.replace(/<p>(.*)<\/p>/g, "$1\n");
    let postContents = cookedText.replace(/<([^\>]+)>/gi, "");

    if (settings.copy_raw_html) {
      postContents = rawCooked;
    }

const rawCooked = this.attrs.attrs.cooked;

O seletor está aqui. Quero direcionar a última tag p ou a penúltima tag p na div cooked em vez de toda a cooked. Quero direcioná-las separadamente, se possível, e colocar os ícones de cópia bem ao lado dos parágrafos.