GetClipboardData?

Hi Soccer Coach, Velo doesn't have an API but you can achieve this functionality using a custom element. For example:

 class ClipboardReader extends HTMLElement {
      constructor() {
        super();

        // Create a shadow DOM
        this.attachShadow({ mode: 'open' });

        // HTML structure for the custom element
        this.shadowRoot.innerHTML = `
          <style>
            :host {
              display: block;
              font-family: Arial, sans-serif;
              border: 1px solid #ccc;
              padding: 1em;
              border-radius: 8px;
              max-width: 300px;
              background: #f9f9f9;
              box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            }
            button {
              padding: 0.5em 1em;
              font-size: 1em;
              cursor: pointer;
              background-color: #007BFF;
              color: #fff;
              border: none;
              border-radius: 5px;
            }
            button:hover {
              background-color: #0056b3;
            }
            p {
              margin-top: 1em;
              font-size: 0.9em;
              color: #333;
            }
          </style>
          <button id="read-clipboard">Read Clipboard</button>
          <p id="output">Clipboard content will appear here.</p>
        `;

        // Reference button and output elements
        this.button = this.shadowRoot.querySelector('#read-clipboard');
        this.output = this.shadowRoot.querySelector('#output');

        // Bind the event listener
        this.handleButtonClick = this.handleButtonClick.bind(this);
      }

      connectedCallback() {
        // Attach the event listener when the element is added to the DOM
        this.button.addEventListener('click', this.handleButtonClick);
      }

      disconnectedCallback() {
        // Clean up the event listener when the element is removed from the DOM
        this.button.removeEventListener('click', this.handleButtonClick);
      }

      async handleButtonClick() {
        try {
          // Use the Clipboard API to read text
          const text = await navigator.clipboard.readText();
          this.output.textContent = `Clipboard Content: ${text}`;
        } catch (err) {
          this.output.textContent =
            'Failed to read clipboard content. Please ensure you allow clipboard access.';
          console.error('Error:', err);
        }
      }
    }

    // Define the custom element
    customElements.define('clipboard-reader', ClipboardReader);

Please note that the user will need to give clipboard read permission to the site for this to work.

You can learn more about custom element implementation in Wix here:

Best,

Eitan