react-qrcode - npm Package Compare versions

Comparing version 0.1.3 to 0.2.0

package.json

 {
   "name": "react-qrcode",
-  "version": "0.1.3",
-  "description": "QR code for ReactJS",
-  "main": "QRcode.js",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/iaalm/react-qrcode.git"
-  },
-  "dependencies": {
-    "react": "^0.12.1",
-    "jquery": "^2.1.3"
-  },
+  "version": "0.2.0",
+  "description": "🤳 A React component for QR code generation with `qrcode`",
+  "repository": "[e-mail]:rx-ts/react.git",
+  "homepage": "https://github.com/rx-ts/react/blob/master/packages/react-qrcode",
+  "author": "JounQin <[e-mail]>",
+  "license": "MIT",
+  "main": "lib/cjs",
+  "module": "lib",
+  "jsdelivr": "lib/umd",
+  "unpkg": "lib/umd",
+  "es2015": "lib/es2015",
+  "esm5": "lib",
+  "fesm5": "lib/esm",
+  "types": "lib",
+  "files": [
+    "lib",
+    "src"
+  ],
   "keywords": [
-    "QR",
-    "ReactJS",
-    "QRcode"
+    "react-qrcode",
+    "qrcode",
+    "react"
   ],
-  "author": "Iaalm",
-  "license": "ISC",
-  "bugs": {
-    "url": "https://github.com/iaalm/react-qrcode/issues"
+  "peerDependencies": {
+    "qrcode": ">=1.0.0",
+    "react": ">=16.9.0"
   },
-  "homepage": "https://github.com/iaalm/react-qrcode#readme"
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": false,
+  "gitHead": "d17aa58d47229c3d003c49a343abb5d50a6c8abe"
 }

README.md

@@ -1,28 +0,44 @@
-react-qrcode
-====
-QR code for ReactJS
+# ReactQRCode
 
+> 🤳 A React component for QR code generation with [qrcode](https://github.com/soldair/node-qrcode)
 
-Install
-------
-`npm install react-qrcode`
+## Usage
 
-Use
----
-`<QRcode text="http://www.pairyo.com/" width=256 height=256 />`
+```tsx
+// Component
+import ReactDOM from 'react-dom'
+import { QRCode } from 'react-qrcode'
 
-Creator
-----
-[iaalm](https://github.com/iaalm)
+ReactDOM.render(<QRCode value="https://www.1stg.me" />)
 
-Contributors
----
-[hophacker](https://github.com/hophacker)
+// hooks
+import { useQRCode } from 'react-qrcode'
 
-[zhcalvin](https://github.com/zhcalvin)
+export const App = () => {
+  const [value, setValue] = useState('https://www.1stg.me')
+  const dataUrl = useQRCode(value)
+  return (
+    <>
+      <div>dataUrl: {dataUrl}</div>
+      <img src={dataUrl} />
+      <input onChange={e => setValue(e.currentTarget.value)} />
+    </>
+  )
+}
+```
 
-Thanks
-----
+## Available Props
 
-Thanks to jeromeetienne's [jquery-qrcode](https://github.com/jeromeetienne/jquery-qrcode). Honestly, pairyo copied your code, but we found this is a must as react is hot, and we need to provide an alternative.
-
+| prop                   | type (range)                                                       | default value                               |
+| ---------------------- | ------------------------------------------------------------------ | ------------------------------------------- |
+| `version`              | `number` (1-40)                                                    | N/A                                         |
+| `errorCorrectionLevel` | `String` ('low', 'medium', 'quartile', 'high', 'L', 'M', 'Q', 'H') | `'M'`                                       |
+| `maskPattern`          | `number` (0-7)                                                     | N/A                                         |
+| `toSJISFunc`           | `Function`                                                         | N/A                                         |
+| `margin`               | `number`                                                           | `4`                                         |
+| `scale`                | `number`                                                           | `4`                                         |
+| `width`                | `number`                                                           | N/A                                         |
+| `color`                | `{ dark: string; light:string }`                                   | `{ dark: '#000000ff', light: '#ffffffff' }` |
+| `type`                 | `string` ('image/png', 'image/jpeg', 'image/webp')                 | `'image/png'`                               |
+| `quality`              | `number`(0-1)                                                      | `0.92`                                      |
+| `value`                | `string | Array<{ data: string; mode?: string }>`                  | N/A                                         |

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

spdx disjunction for an artifact's license information

License

spdx disjunction for an artifact's license information

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Fixed alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

spdx disjunction for an artifact's license information

License

spdx disjunction for an artifact's license information

Found 1 instance in 1 package

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

40872

increased by27.47%

Number of package files

32

increased by540%

Number of high maintenance alerts

0

decreased by-100%

Number of lines in readme file

45

increased by55.17%

Worsened metrics

Lines of code

645

decreased by-37.98%

Number of low maintenance alerts

1

increased byInfinity%

Number of low quality alerts

3

increased by50%

Number of low supply chain risk alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

2

increased byInfinity%

Dependency changes

• + Addedansi-regex@5.0.1(transitive)

• + Addedansi-styles@4.3.0(transitive)

• + Addedcamelcase@5.3.1(transitive)

• + Addedcliui@6.0.0(transitive)

• + Addedcolor-convert@2.0.1(transitive)

• + Addedcolor-name@1.1.4(transitive)

• + Addeddecamelize@1.2.0(transitive)

• + Addeddijkstrajs@1.0.3(transitive)

• + Addedemoji-regex@8.0.0(transitive)

• + Addedencode-utf8@1.0.3(transitive)

• + Addedfind-up@4.1.0(transitive)

• + Addedget-caller-file@2.0.5(transitive)

• + Addedis-fullwidth-code-point@3.0.0(transitive)

• + Addedjs-tokens@4.0.0(transitive)

• + Addedlocate-path@5.0.0(transitive)

• + Addedloose-envify@1.4.0(transitive)

• + Addedp-limit@2.3.0(transitive)

• + Addedp-locate@4.1.0(transitive)

• + Addedp-try@2.2.0(transitive)

• + Addedpath-exists@4.0.0(transitive)

• + Addedpngjs@5.0.0(transitive)

• + Addedqrcode@1.5.3(transitive)

• + Addedreact@18.3.1(transitive)

• + Addedrequire-directory@2.1.1(transitive)

• + Addedrequire-main-filename@2.0.0(transitive)

• + Addedset-blocking@2.0.0(transitive)

• + Addedstring-width@4.2.3(transitive)

• + Addedstrip-ansi@6.0.1(transitive)

• + Addedwhich-module@2.0.1(transitive)

• + Addedwrap-ansi@6.2.0(transitive)

• + Addedy18n@4.0.3(transitive)

• + Addedyargs@15.4.1(transitive)

• + Addedyargs-parser@18.1.3(transitive)

• - Removedjquery@^2.1.3

• - Removedreact@^0.12.1

• - Removedacorn@5.7.4(transitive)

• - Removedamdefine@1.0.1(transitive)

• - Removedast-types@0.9.6(transitive)

• - Removedbalanced-match@1.0.2(transitive)

• - Removedbase62@1.2.8(transitive)

• - Removedbrace-expansion@1.1.11(transitive)

• - Removedcommander@2.20.3(transitive)

• - Removedcommoner@0.10.8(transitive)

• - Removedconcat-map@0.0.1(transitive)

• - Removeddefined@1.0.1(transitive)

• - Removeddetective@4.7.1(transitive)

• - Removedenvify@3.4.1(transitive)

• - Removedesprima@3.1.3(transitive)

• - Removedesprima-fb@15001.1.0-dev-harmony-fb(transitive)

• - Removedglob@5.0.15(transitive)

• - Removedgraceful-fs@4.2.11(transitive)

• - Removediconv-lite@0.4.24(transitive)

• - Removedinflight@1.0.6(transitive)

• - Removedinherits@2.0.4(transitive)

• - Removedjquery@2.2.4(transitive)

• - Removedjstransform@11.0.3(transitive)

• - Removedminimatch@3.1.2(transitive)

• - Removedminimist@1.2.8(transitive)

• - Removedmkdirp@0.5.6(transitive)

• - Removedobject-assign@2.1.1(transitive)

• - Removedonce@1.4.0(transitive)

• - Removedpath-is-absolute@1.0.1(transitive)

• - Removedprivate@0.1.8(transitive)

• - Removedq@1.5.1(transitive)

• - Removedreact@0.12.2(transitive)

• - Removedrecast@0.11.23(transitive)

• - Removedsafer-buffer@2.1.2(transitive)

• - Removedsource-map@0.4.40.5.7(transitive)

• - Removedthrough@2.3.8(transitive)

• - Removedwrappy@1.0.2(transitive)