pdf-e-signature/README.md

A React component that allows users to select positions for e-signatures on PDFs

# PDF E-Signature

A React component library that allows users to select positions for e-signatures on PDFs and sign documents digitally.

## Installation

```bash
npm install pdf-e-signature
# or
yarn add pdf-e-signature
```

## Features

- PDF document viewer
- Signature positioning interface
- Multiple signature formats
- Signature storage and management
- PDF document signing

## Usage

### Basic Example

```jsx
import React, { useState } from 'react';
import { PDFSignatureSelector, SignPdf } from 'pdf-e-signature';

const SignatureApp = () => {
  const [pdfFile, setPdfFile] = useState(null);
  const [pdfUrl, setPdfUrl] = useState(null);
  const [signaturePositions, setSignaturePositions] = useState([]);
  const [signedPdf, setSignedPdf] = useState(null);
  
  const handleFileChange = (e) => {
    const file = e.target.files[0];
    if (file && file.type === 'application/pdf') {
      setPdfFile(file);
      const fileURL = URL.createObjectURL(file);
      setPdfUrl(fileURL);
      setSignaturePositions([]);
    }
  };
  
  const handleSigningComplete = (signedPdfBlob) => {
    setSignedPdf(URL.createObjectURL(signedPdfBlob));
  };
  
  return (
    <div>
      <input type="file" accept=".pdf" onChange={handleFileChange} />
      
      {pdfFile && (
        <PDFSignatureSelector 
          pdfFile={pdfFile}
          onSave={(e) => {setSignaturePositions(e.signaturePositions) }}
          pdfUrl={pdfUrl}
        />
      )}
      
      {pdfFile && signaturePositions.length > 0 && (
        <SignPdf
          pdfFile={pdfFile}
          pdfUrl={pdfUrl}
          signaturePositions={signaturePositions}
          onSigningComplete={handleSigningComplete}
        />
      )}
      
      {signedPdf && (
        <div>
          <h3>Signed Document:</h3>
          <iframe src={signedPdf} width="100%" height="500px" />
        </div>
      )}
    </div>
  );
};

export default SignatureApp;
```

## Components

### PDFSignatureSelector

Component for selecting positions where signatures should be placed on a PDF document.

#### Props

| Prop | Type | Required | Description |
|------|------|----------|-------------|
| pdfFile | File or Blob | Yes | PDF file to display and select positions on |
| pdfUrl | Pdf Url | Yes | PDF url to display and select positions on |
| onSave | Function | Yes | Callback function that receives the selected signature positions and pdf file |

### SignPdf

Component for creating a signature and applying it to a PDF document.

#### Props

| Prop | Type | Required | Description |
|------|------|----------|-------------|
| pdfFile | File or Blob | Yes | PDF file to sign |
| pdfUrl | Pdf Url | Yes | PDF url to sign |
| signaturePositions | Array | Yes | Array of positions where signatures should be placed |
| onSigningComplete | Function | Yes | Callback function that receives the signed PDF |


## Development

### Prerequisites

- Node.js >= 14
- npm or yarn

2. Install dependencies
```bash
npm install
# or
yarn
```