@stsdti/esign-vue3-webcomponents

Vue 3 web components for implementing cryptographic operations and integrating with the eSign API.

Installation

npm install @stsdti/esign-vue3-webcomponents

Components

EsignCloudDocument

Drop-in button component that handles the full cloud signing workflow: certificate selection, OAuth2 authorization, optional visible signature placement, and document signing.

<template>
  <EsignCloudDocument
      esign-api-host="https://your-esign-api-host"
      bearer-token="jwtToken"
      user="[email protected]"
      :to-sign-document="base64PdfString"
      @signatureCancel="onCancel"
      @signatureDone="onDone"
  />
</template>

<script setup>
  import { EsignCloudDocument } from '@stsdti/esign-vue3-webcomponents'

  function onCancel() {
    console.log('Signing cancelled')
  }

  function onDone(signedDocument) {
    console.log('Signed PDF (base64):', signedDocument)
  }
</script>

Props

| Prop | Type | Default | Description | |------|------|---------|-------------| | esignApiHost | String | '' | eSign API service URL | | bearerToken | String | '' | JWT bearer token from your identity provider | | user | String | '' | Signer identifier (email) | | toSignDocument | String | '' | Base64-encoded PDF document to sign | | toSignDocumentCallback | Function | — | Async function that returns the base64 PDF (alternative to toSignDocument) | | wasmUrl | String | jsdelivr CDN | URL to the pdfium WASM binary for PDF rendering | | align | String | 'left' | Menu alignment (left or right) | | disabled | Boolean | false | Disables the signing button |

Events

| Event | Payload | Description | |-------|---------|-------------| | signatureCancel | — | Emitted when the user cancels the signing process | | signatureDone | String (base64) | Emitted with the signed PDF document |

EsignCloudClient

Lower-level component that manages the cloud signing workflow UI (certificate list, PIN authorization, visible signature placement). Used internally by EsignCloudDocument, but can be used directly for custom integrations.

EsignPdfViewer

PDF viewer component built on @embedpdf/vue-pdf-viewer with zoom controls, page navigation, and signature box placement support.

Development

# Install dependencies
npm install

# Start dev server
npm run dev

# Build library
npm run build