This package has been deprecated

Author message:

Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

react-esigning-library

React E-esigning for Pdf

Introduction

A react esigning component library where you can sign visually any position on pdf you specified .

You can sign whether by drawing signature through signature pad or can generate your own signature by typing text in the input field .

This library offers you to sign at any page by defining positions (X,Y) in the array.

Installation

npm install react-esigning-library

Dependencies

• react-signature-canvas
• reactjs-popup
• pdf-lib

Usage

import React from 'react'
import ReactDOM from 'react-dom'
import { EsignPdf } from react-esigning-library


let testArray = [
    {
      pageNum: 0,
      positionX: 70,
      positionY: 80,
      type: "signature",
    },
    {
      pageNum: 0,
      positionX: 70,
      positionY: 80,
      signature: "Adam",
      type: "text",
    },
  ];
  const submitPdf = (data) => {
  console.log("data", data);
};
ReactDOM.render(
   <EsignPdf
      backgroundColor="#eded"
      signatureArray={testArray}
      submitPdfFunc={submitPdf}
      buttonStyle={{
        padding: "10px",
        width: "100%",
        cursor: "pointer",
        border: "1px solid",
        borderRadius: "15px",
        fontSize: "15px",
        backgroundColor: "#87ce",
        color: "#fff",
      }}
      url={"YOUR_PDF_URL"}
      generateButtonStyle={{
        padding: "10px",
        width: "35%",
        cursor: "pointer",
        border: "1px solid",
        borderRadius: "15px",
        fontSize: "15px",
        backgroundColor: "#87ce",
        color: "#fff",
      }}
      inputStyle={{ padding: "10px", marginRight: "5px" }}
    />
  document.getElementById('react-container')
)

Props Description

• backgroundColor

Add your own background color to components like

• buttonStyle

you can write your own css for buttons.

• url

add your url for pdf, where you want to sign on.

• inputStyle

add your own css to input field required in the generating signatures.

• submitPdfFunc

It's a callback which will hold the visual sign pdf in base64, after you submit pdf . This can be used if you want to digitally sign your pdf from certified authority.

• signatureArray

This array should include the format which is defined in the example, Here you can specified the positionX and positionY along with the pageNumber on which you want to sign on. In addition to signature, you can add your custom text if want to add in your pdf .

Props

Name	Type	Required	Default
backgroundColor	String	No	'#eee'
buttonStyle	Object	No	none
url	String	Yes	none
inputStyle	Object	No	{{ padding: "10px", marginRight: "5px" }}
submitPdfFunc	Func	Yes	none
signatureArray	Array	Yes	[]

License

This package is available under the MIT license.