Citações em destaque

Pode haver um erro aqui, habilitar isto (com o original desabilitado) criou problemas para contas sem acesso de administrador. Não tenho certeza do que entrou em conflito exatamente, mas alguns tópicos ficaram ocultos e a navegação de Categorias/Tags ficou totalmente inutilizável para contas não permissivas (TL1).

Vou aguardar a atualização do Arkshine.

2 curtidas

Estou vendo o seguinte quando atualizei hoje

\[Aviso do Administrador\] O tema ‘Quote Callouts’ contém código que precisa ser atualizado. (id:discourse.widgets-decommissioned) (saiba mais)

1 curtida

Eu enviei uma correção, você pode atualizar o componente e tentar? :folded_hands:

7 curtidas

Funcionando bem até agora!

2 curtidas

Agora encontrei um problema, o bloco de citação não pode mais ser recolhido/expandido

Você se importaria de colar aqui um exemplo reproduzível ou um link para sua postagem no fórum (sinta-se à vontade para me enviar uma mensagem privada se preferir)?

1 curtida

Claro, no final deste tópico

Aqui está uma atualização que moderniza o componente e traz suporte ao editor de texto rico! :rocket:
Pode precisar de algum polimento ou pode ter casos extremos imprevistos, mas acredito que seja um bom começo. :folded_hands:

Em resumo

Editor de texto rico

Vamos falar sobre o editor de texto rico e o que esperar!

Criando callouts:

Você tem quatro maneiras de inserir callouts:

  • Atalho de teclado
  • Barra de ferramentas
  • Regras de entrada
    • /callout<:tipo>
    • !!<tipo>
  • Suporte a colar
    Vídeo

Editando callouts

Os controles para editar um callout aparecem somente quando você o seleciona antes.

  • Seletor de tipo
    Ao clicar no ícone, um menu flutuante aparecerá.
  • Título Personalizado
    Suporta formatação em linha e emoji
  • Recolhimento
    Defina callouts como colapsáveis. Pode ser acessado através do menu de opções.
    Vídeo

Organizando callouts

  • Controles de movimentação

    • Desktop
      Há uma alça que você arrasta para soltar o callout.
    • *Dispositivo touch
      Você move os callouts para cima/baixo ou os aninha em callouts adjacentes. Está desativado por padrão para evitar inchaço na visualização, já que isso não é algo que você fará com frequência. Você pode alternar nas opções.
    Vídeo

  • Navegação por teclado
    Isso ajuda a facilitar a movimentação para dentro e para fora de callouts aninhados.
    Pode exigir alguns ajustes futuros para tornar o comportamento consistente nesta versão.

    • No início do título, o seletor de callout abrirá automaticamente.
    • Dentro do corpo de um callout sem parágrafo para pousar, ele criará um; se você sair com conteúdo vazio, o parágrafo será removido.
    • Enter Dentro do título move o cursor para o corpo (e cria um se necessário).
    Vídeo

  • Clique para inserir

    • Em áreas onde não há parágrafo, você pode clicar dentro para abrir um parágrafo.
    • Se preferir, você também pode usar botões para abrir um parágrafo dentro ou fora de um callout.
      Vídeo

Possivelmente, mais tarde, procurarei por:

  • Autocompletar regras de entrada
  • Melhorar a cor usando CSS moderno, para garantir consistência e visibilidade, especialmente no modo escuro.
  • Eu gostaria de remover todas as settings e focar na simplicidade primeiro, com personalização avançada apenas com CSS, mas é tarde demais para isso :rofl:

Agradecimentos especiais a Moin por me dar feedback.

É isso. Me diga o que você acha. Feedback é muito bem-vindo!

7 curtidas

Notei que você projetou um efeito: se um determinado tipo tiver vários aliases, ao selecionar o tipo no editor de texto rico, cada alias aparece como uma opção e eles são posicionados consecutivamente.
Este é um bom design, mas parece que precisa de mais expansão: se nenhum Título for definido, ele exibirá o tipo de callout, então essas opções consecutivas que compartilham o mesmo esquema de cores final mostrarão nomes e títulos diferentes; no entanto, se um Título for definido, ele será exibido e usará o mesmo Título na lista como ao realmente criar uma Citação, o que é um pouco confuso.
Se esta extensão for difícil de implementar, acho que talvez uma caixa de seleção possa ser fornecida para evitar adicionar entradas extras na lista de seleção de tipos que correspondem um a um aos aliases quando um Título é definido. :slightly_smiling_face:

3 curtidas

Você está certo! Obrigado pelo feedback, é bom ver as pessoas usando o TC.
Na verdade, eu pensei nisso em algum momento, mas esqueci completamente de consertar. :grinning_face_with_smiling_eyes:
Vou trabalhar em uma correção para filtrar a lista corretamente quando o título for definido.

2 curtidas

Eu fiz um commit de uma correção. Me avise como foi! :+1:

3 curtidas

Acabei de testar a versão mais recente, e agora aqueles com um Título mostrarão apenas um na lista de seleção de categoria, independentemente de quantos alias existam. :smiley:

3 curtidas

Tenho o seguinte erro, apenas ao usar a tradução de*:

Captura de tela de um banner vermelho indicando um erro em Quote Callouts

Console JS:

client-error-handler.js:109 [THEME 6 'Quote Callouts'] TypeError: Cannot set properties of undefined (setting 'callout_sample')
    at new po (callouts.gjs:30:19)
    at callouts.gjs:265:23
    at eK (plugin-api.gjs:3582:10)
    at Object.initialize (callouts.gjs:264:5)
    at i.initialize (app.js:304:28)
    at index.js:375:19
    at e.each (index.js:183:7)
    at e.walk (index.js:112:10)
    at e.each (index.js:59:20)
    at e.topsort (index.js:65:10)
    at ij._runInitializer (index.js:388:11)
    at ij.runInstanceInitializers (index.js:373:10)
    at l._bootSync (instance.js:111:22)
    at ij.didBecomeReady (index.js:780:18)
    at invoke (index.js:262:14)
    at m.flush (index.js:180:11)
    at g.flush (index.js:334:19)
    at Y._end (index.js:762:32)
    at Y._boundAutorunEnd (index.js:499:12)
h	@	client-error-handler.js:109

Ele ocorre na última linha desta citação:

class QuoteCallouts {
  constructor(owner, api) {
    [...]
    window.I18n.translations[
      window.I18n.fallbackLocale || "en"
    ].js.composer.callout_sample = ``;

* defina /u/<username>/preferences/interface “Idioma da interface” para “Alemão (Deutsch)”

Parece que o erro foi introduzido em uma das últimas atualizações do Discourse entre 2026.3.0-latest e 2026.4.0-latest, mas não consigo identificá-lo com mais precisão. Atualmente estou na versão 2026.4.0-latest 4b2c45376d e Quote Callout v0.0.1 9aa6548

2 curtidas

Eu realmente pensei que esse tipo de problema já tivesse sido corrigido.
O locale do site está definido como inglês padrão (EUA), enquanto o locale do usuário está definido como alemão, estou correto?

1 curtida

Sim, isso resolveu o problema. Obrigado! <3

1 curtida

Olá @Arkshine, obrigado pelo ótimo plugin!

É possível usar o callout sem nenhum título ou apenas com um ícone?

2 curtidas

Acho que você não consegue fazer isso no momento, mas vou pensar em uma maneira de fazer isso na próxima atualização!

Enquanto isso, há um truque: insira um espaço de largura zero e deve funcionar :grinning_face_with_smiling_eyes:. Você pode copiá-lo desta página, por exemplo: ​ U+200B ZERO WIDTH SPACE - Unicode Explorer


Me avise se isso funcionar para você.

4 curtidas

Acho que funcionou! Obrigada! :heart_eyes:

2 curtidas

Ei, @Arkshine :waving_hand:

É possível manter a cor original do callout ao usar o recurso de Ocultar detalhes?

No modo de editor de post, as cores originais são salvas, mas o fundo fica cinza após salvar as alterações:

2 curtidas

Obrigado pelo relatório!
Empurrei uma correção. Você pode atualizar o componente e verificar se isso acontece novamente?

3 curtidas