@aoexl/sign-vue

Vue 3 integration for the Aoexl Sign PDF eSignature SDK.

Installation

npm install @aoexl/sign-vue @aoexl/sign
# peer dep
npm install vue

Quick start

<script setup>
import { AoexlSign } from '@aoexl/sign-vue'

const signers = [{ name: 'Jane Doe', email: '[email protected]', role: 'signer' }]

function onComplete({ signedPdfBytes, fields }) {
  console.log('Signing complete', fields)
  // upload signedPdfBytes to your server
}

function onError(err) {
  console.error('Signing error', err)
}
</script>

<template>
  <AoexlSign
    license-key="pk_live_xxxxxxxxxxxx"
    pdf-url="https://your-server.com/contract.pdf"
    mode="sign"
    :signers="signers"
    @complete="onComplete"
    @error="onError"
    style="height: 700px; display: block;"
  />
</template>

Global registration (Vue plugin)

// main.ts
import { createApp } from 'vue'
import AoexlSignPlugin from '@aoexl/sign-vue'
import App from './App.vue'

createApp(App).use(AoexlSignPlugin).mount('#app')

Now <AoexlSign> is available in every component without importing.

Props

| Prop | Type | Default | Description | |------|------|---------|-------------| | licenseKey | string | — | Required. Your Aoexl license key. | | pdfUrl | string | — | Required. URL or data-URL of the PDF. | | mode | 'prepare' \| 'sign' \| 'view' | 'sign' | Viewer mode. | | signers | Signer[] | [] | Signer definitions. | | fields | Field[] | [] | Pre-placed fields (required in sign/view mode). | | theme | { primary?: string; accent?: string } | {} | Color overrides. | | workerSrc | string | — | Custom PDF.js worker URL. |

Events

| Event | Payload | Description | |-------|---------|-------------| | complete | CompleteResult | Fired when the user finishes signing / preparing. | | error | Error | Fired on any error (license, PDF load, etc.). |

Modes

| Mode | Description | |------|-------------| | prepare | Drag and drop fields onto the PDF; emits complete with the field layout and signer list. | | sign | Present pre-placed fields for the signer to fill and sign. | | view | Read-only rendering of a signed PDF. |

TypeScript

import type { AoexlSignProps, Field, Signer, CompleteResult } from '@aoexl/sign-vue'

Building

npm run build   # outputs dist/aoexl-sign-vue.js (ESM) + dist/aoexl-sign-vue.cjs (CJS)

License

UNLICENSED — contact Aoexl for a commercial license.