Skip to content

Latest commit

 

History

History
205 lines (181 loc) · 3.51 KB

README.md

File metadata and controls

205 lines (181 loc) · 3.51 KB

Scanner

A Scanner component is used to scan any QR code, Bar Code, UPI QR Code. The component will also provide you the feature like flash light, Toggle camera.

Demo

A minimal Demo Link

Usage/Examples

Value Used as a Description
Scanner ✅ Component Can be used as Component
scanner ❌ Service Can be used as Service
1. Here's an example of basic usage with Multiple Import: with Default Import:
// Default import will return Scanner Component
import Scanner from 'fe-pilot/Scanner';

<Scanner /> // Used as a Component
2. Here's an example of basic usage with Multiple Import: with Multiple Import:
import { Scanner, scanner } from 'fe-pilot/Scanner';

<Scanner /> // Used as a Component
3. Here's an example of a advanced usage:
import { Scanner } from 'fe-pilot/Scanner';

const successCb = (response) => {
  console.log("success response:", response);
}

const failureCb = (response) => {
  console.log("failure response:", response);
}

return (
 <Scanner successCb={successCb} failureCb={failureCb}>
  <ScannerFlash />
  <ScannerScanBox />
  <ScannerFacing />
  <ScannerClose
    onClose={onClose}
  >
    ❎ Close
  </ScannerClose>
</Scanner>
);

Props

Props Type Description Response
successCb Function It will be called on success 
{
    data: "Can be array/object/string/number",
    msgType: "SUCCESSFUL",
    msg: "A success msg",
    status: "SUCCESS"
}
loadingCb Function It will be called before success/failure. 
{
  msgType: "LOADING",
  msg: "LOADING...",
  status: "LOADING"
}
failureCb Function It will be called on failure 
{
  msgType: "ERROR",
  msg: "A failed msg",
  status: "FAILURE"
}
Props Type Description Default Values
showForever Boolean To hide/remove unsupported feature, make it false. Default value is true.

Child Component

Child Type Description
ScannerClose Element onClick, Close the camera
ScannerFacing Element onClick, Toggle the camera from front to back and vice versa.
ScannerFlash Element onClick, Toggle the flash light of camera
ScannerScanBox Element onClick, Create a box area used for scanning 
graph TD;
    Scanner--->ScannerClose;
    Scanner--->ScannerFacing;
    Scanner--->ScannerFlash;
    Scanner--->ScannerScanBox;
Loading