@gm-mobile/c-qrcode 3.9.0

package/index.d.ts

@@ -0,0 +1,13 @@
+declare module 'weapp-qrcode' {
+  interface drawQrCodeProps {
+    width: number
+    height: number
+    canvasId: string
+    text: string
+    correctLevel: number
+  }
+
+  function drawQrCode(props: drawQrCodeProps): void
+
+  export default drawQrCode
+}

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@gm-mobile/c-qrcode",
+  "version": "3.9.0",
+  "description": "> TODO: description",
+  "author": "liyatang <liyatang@qq.com>",
+  "homepage": "https://github.com/gmfe/gm-mobile#readme",
+  "license": "ISC",
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "src/index.ts",
+  "types": "src/index.ts",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/gmfe/gm-mobile.git"
+  },
+  "scripts": {
+    "test": "echo \"Error: run tests from root\" && exit 1"
+  },
+  "bugs": {
+    "url": "https://github.com/gmfe/gm-mobile/issues"
+  },
+  "peerDependencies": {
+    "qrcode.react": "^1.0.0",
+    "weapp-qrcode": "^1.0.0"
+  },
+  "devDependencies": {
+    "@types/qrcode.react": "^1.0.1"
+  }
+}

package/src/index.ts

@@ -0,0 +1,2 @@
+export { default as QRCode } from './qrcode'
+export type { QRCodeProps } from './type'

package/src/qrcode.tsx

@@ -0,0 +1,14 @@
+import React, { FC } from 'react'
+import QRCodeReact from 'qrcode.react'
+import { QRCodeProps } from './type'
+
+export const QRCode: FC<QRCodeProps> = (props) => {
+  return <QRCodeReact {...props} />
+}
+
+QRCode.defaultProps = {
+  size: 200,
+  level: 'L',
+}
+
+export default QRCode

package/src/qrcode.weapp.tsx

@@ -0,0 +1,38 @@
+import React, { useEffect, useMemo, FC } from 'react'
+import { Canvas } from '@tarojs/components'
+import drawQrCode from 'weapp-qrcode'
+import { LevelMapProps, QRCodeProps } from './type'
+
+const levelMap: LevelMapProps = {
+  L: 1,
+  M: 0,
+  Q: 3,
+  H: 2,
+}
+
+const QRCode: FC<QRCodeProps> = ({ value, size = 200, level = 'L' }) => {
+  const id = useMemo(() => Math.random().toString(), [])
+
+  useEffect(() => {
+    drawQrCode({
+      width: size,
+      height: size,
+      canvasId: id,
+      text: value,
+      correctLevel: levelMap[level],
+    })
+  }, [])
+
+  return (
+    <Canvas
+      // type='2d'
+      canvasId={id}
+      style={{
+        width: `${size}px`,
+        height: `${size}px`,
+      }}
+    />
+  )
+}
+
+export default QRCode

package/src/stories.tsx

@@ -0,0 +1,11 @@
+import React from 'react'
+import QRCode from './qrcode'
+
+export const normal = () => {
+  return <QRCode value='https://www.guanmai.cn' />
+}
+
+export default {
+  title: 'QRCode/QRCode',
+  component: QRCode,
+}

package/src/type.ts

@@ -0,0 +1,14 @@
+interface QRCodeProps {
+  value: string
+  level?: 'L' | 'M' | 'Q' | 'H'
+  size?: number
+}
+
+interface LevelMapProps {
+  L: number
+  M: number
+  Q: number
+  H: number
+}
+
+export type { QRCodeProps, LevelMapProps }