https://www.techniques-ingenieur.fr/assets/controllers/share_link_controller-J0zfqwP.js

1import {Controller} from '@hotwired/stimulus';
2
3/* stimulusFetch: 'lazy' */
4export default class extends Controller {
5    static targets = ['icon', 'label'];
6    static values = {success: String};
7
8    connect() {
9        this.initialIconHTML = this.iconTarget.innerHTML;
10        this.initialLabelText = this.labelTarget.textContent;
11    }
12
13    copy() {
14        navigator.clipboard.writeText(window.location.href);
15
16        // État "succès"
17        this.element.disabled = true;
18        this.iconTarget.classList.add('icon-container-success');
19        this.labelTarget.classList.add('link-title-success');
20
21        this.iconTarget.innerHTML = '<span class="icon-link-success"></span>';
22        this.labelTarget.textContent = this.successValue;
23
24        // Retour à l'état initial après 2 secondes
25        setTimeout(() => {
26            this.element.disabled = false;
27            this.iconTarget.classList.remove('icon-container-success');
28            this.labelTarget.classList.remove('link-title-success');
29
30            this.iconTarget.innerHTML = this.initialIconHTML;
31            this.labelTarget.textContent = this.initialLabelText;
32        }, 2000);
33    }
34}