# @sensorfactdev/qr-code-scanner

> Scan QR codes using the rear camera of a phone inside React

Latest version **1.0.10** (published 2018-02-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install @sensorfactdev/qr-code-scanner
pnpm add @sensorfactdev/qr-code-scanner
yarn add @sensorfactdev/qr-code-scanner
bun add @sensorfactdev/qr-code-scanner
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.10 |
| Published | 2018-02-02 |
| First published | 2017-11-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Ramon Gebben |
| Maintainers | alxbrg, georgesapkin, pindakaasman |

## Links

- npm: https://www.npmjs.com/package/@sensorfactdev/qr-code-scanner
- Repository: https://github.com/Sensorfactdev/qr-code-scanner
- Homepage: https://github.com/Sensorfactdev/qr-code-scanner#readme
- Issues: https://github.com/Sensorfactdev/qr-code-scanner/issues
- npm.io page: https://npm.io/package/@sensorfactdev/qr-code-scanner

## Dependencies (3)

- [raf](https://npm.io/package/raf.md) ^3.4.0
- [qrcode-reader](https://npm.io/package/qrcode-reader.md) ^1.0.4
- [styled-components](https://npm.io/package/styled-components.md) ^2.2.3

## Recent versions

- 1.0.10 (latest) — 2018-02-02
- 1.0.9 — 2018-02-02
- 1.0.8 — 2017-11-15
- 1.0.7 — 2017-11-14
- 1.0.6 — 2017-11-14
- 1.0.5 — 2017-11-14
- 1.0.4 — 2017-11-14
- 1.0.3 — 2017-11-14
- 1.0.2 — 2017-11-14
- 1.0.1 — 2017-11-14

## README

# QR Code Scanner

[![Build Status](https://travis-ci.org/Sensorfactdev/qr-code-scanner.svg?branch=master)](https://travis-ci.org/Sensorfactdev/qr-code-scanner)
[![Known Vulnerabilities](https://snyk.io/test/npm/@sensorfactdev/qr-code-scanner/badge.svg)](https://snyk.io/test/npm/@sensorfactdev/qr-code-scanner)
[![npm version](https://badge.fury.io/js/%40sensorfactdev%2Fqr-code-scanner.svg)](https://badge.fury.io/js/%40sensorfactdev%2Fqr-code-scanner)
[![Package Quality](http://npm.packagequality.com/badge/@sensorfactdev/qr-code-scanner.png)](http://packagequality.com/#?package=@sensorfactdev/qr-code-scanner)

## Usage

```javascript
import QrCodeScanner from '@sensorfactdev/qr-code-scanner';

const handleScanResult = result => {
  console.log(result);
  // {
  //   "result": "RESULT STRING VALUE",
  //   "points": [
  //     {
  //       "x": 171,
  //       "y": 445,
  //       "count": 2,
  //       "estimatedModuleSize": 3.857142857142857
  //     },
  //     // .... more points
  //   ]
  // }
}

const MyApp = () => (
  <div>
    <QrCodeScanner
      onQrCodeScanned={handleScanResult}
      width={window.innerWidth}
      height={window.innerHeight}
      showAimAssist // Defaults to true, disable to remove the aim assist
    />
  </div>
)
```

### Props

| Key             | Type     | Default Value        |
|:----------------|:---------|:---------------------|
| onQrCodeScanned | Function | `console.log`        |
| width           | Number   | `window.innerWidth`  |
| height          | Number   | `window.innerHeight` |

## Development

To start Storybook:
```
yarn start
```

To run the tests:
```
yarn test
```

To run tests in watch mode:
```
yarn test --watch
```

Building the module
```
yarn build
```

---
_Source: https://npm.io/package/@sensorfactdev/qr-code-scanner · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._