コピーアイコンでコンテンツをコピーする

開発
1

こんにちは。プラグインからフォーム経由で提供されたデータを印刷する代わりに、ユーザーが「コピー」アイコンをクリックすることで、必要に応じてコンテンツをコピーできるようにしたいと考えています。

Discourse がコードブロックにこの機能を追加したことに気づきましたが、これらのブロック内でのみ機能します。希望どおりに他の場所でこれを使用するにはどうすればよいですか？

ありがとうございます。

2

おそらく、この Theme component がお探しのものです 📄 Copy Post Component
これで投稿全体をコピーできます

「いいね！」 5
3

Custom Wizard プラグインのデータに使用したい、つまり特定のフレーズのコピーを有効にしたいと考えています。テーマコンポーネントでは提供されていないと思いますが、カスタマイズで実現できますか？

4

おっしゃる通り、コンポーネントは投稿の全コンテンツをコピーします。これは確かにカスタマイズ可能だと思います。期待されているものの視覚的な例を共有していただけますか？このプラグインを使ったことがないので、どのステップやコンテキストでそのカスタマイズをしたいのか分かりません。

「いいね！」 2
5

Custom Wizards プラグインでページを作成する際、プラグインが提供する変数の出力をコピーしたいと考えています。メッセージコンテンツ内のランダムに選択された領域と考えることができます。コピーするコンテンツにカスタム CSS セレクターを割り当てることができます。

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;

セレクターはここにあります。cooked div 全体ではなく、cooked div の最後の p タグまたは最後から 2 番目の p タグを対象としたいです。可能であれば個別にターゲットを設定し、コピーアイコンを段落のすぐ隣に配置したいです。