<script type="module" src="https://assets.cdn.io.pagopa.it/sign/io-sign.js"></script>

<h3>Pulsante Firma con IO attivo</h3>

<io-sign id="cta"></io-sign>

<h3>Pulsante Firma con IO disattivato</h3>

<io-sign disabled="disabled"></io-sign>

<h3>Esempio reset</h3>

<button id="reset-btn">Reset</button>

const cta = document.getElementById("cta");

const resetBtn = document.getElementById("reset-btn");

function createOrRetrieveSignatureRequest() {
  // here put your business logic to create
  // a new signature request or retrieve an
  // existent one
  return new Promise((done) => {
    setTimeout(() => {
      done("SIGNATURE_REQUEST_ID")
    }, 1500);
  });
}

cta.addEventListener("io-sign.cta.click", async () => {
  const signatureRequestId = await createOrRetrieveSignatureRequest();
  cta.redirectOrShowQrCode(signatureRequestId);
});

resetBtn.addEventListener("click", () => {
  cta.reset();
});