{"_id":"@adityavijay21/upiqr","name":"@adityavijay21/upiqr","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@adityavijay21/upiqr","version":"1.0.0","description":"Generate NPCI's UPI QR code along with UPI intent link. Supports Node.js, browsers, and React Native.","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"import":"./dist/index.js","require":"./dist/index.cjs","types":"./dist/index.d.ts"}},"scripts":{"build":"tsup src/index.ts --format esm,cjs --dts --clean --minify","prepublishOnly":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/adityavijay21/upiqr.git"},"bugs":{"url":"https://github.com/adityavijay21/upiqr/issues"},"homepage":"https://github.com/adityavijay21/upiqr#readme","keywords":["upi","upiqr","qrcode","payment","react-native","upi qr code generator","qr code generator","upi qr code","NPCI"],"author":{"name":"Aditya Vijay","url":"https://github.com/adityavijay21"},"license":"MIT","publishConfig":{"access":"public"},"dependencies":{"qrcode":"^1.5.3"},"devDependencies":{"@types/node":"^20.11.24","@types/qrcode":"^1.5.5","tsup":"^8.0.2","typescript":"^5.3.3"},"_id":"@adityavijay21/upiqr@1.0.0","_nodeVersion":"23.10.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-6ZKJ8lDZl5VSOAWQD5l/QRoAmiP0nfSqKSLwNNTpc8UI89Oj4tCoCuTML09OqFk9r1x5ANv5/WWPshopQbZjxg==","shasum":"3d94a79af7e86e040947485aedbda9426e538a94","tarball":"https://registry.npmjs.org/@adityavijay21/upiqr/-/upiqr-1.0.0.tgz","fileCount":7,"unpackedSize":20921,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQD/LBbEw5anlznaPqhjg7UIJzWlgs8V3nf+GhCYT9dhpwIgN/NUjrL3srn++cP0CTFHaQqjY30t75wfy3vQufPcSGM="}]},"_npmUser":{"name":"adityavijay21","email":"adityavijay2103@gmail.com"},"directories":{},"maintainers":[{"name":"adityavijay21","email":"adityavijay2103@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/upiqr_1.0.0_1758883617778_0.8829450115922326"},"_hasShrinkwrap":false}},"time":{"created":"2025-09-26T10:46:57.649Z","1.0.0":"2025-09-26T10:46:57.940Z","modified":"2025-09-26T10:46:58.207Z"},"maintainers":[{"name":"adityavijay21","email":"adityavijay2103@gmail.com"}],"description":"Generate NPCI's UPI QR code along with UPI intent link. Supports Node.js, browsers, and React Native.","homepage":"https://github.com/adityavijay21/upiqr#readme","keywords":["upi","upiqr","qrcode","payment","react-native","upi qr code generator","qr code generator","upi qr code","NPCI"],"repository":{"type":"git","url":"git+https://github.com/adityavijay21/upiqr.git"},"author":{"name":"Aditya Vijay","url":"https://github.com/adityavijay21"},"bugs":{"url":"https://github.com/adityavijay21/upiqr/issues"},"license":"MIT","readme":"# @adityavijay21/upiqr: UPI QR Code Generator\n\n[![npm version](https://img.shields.io/npm/v/@adityavijay21/upiqr.svg?style=flat-square)](https://www.npmjs.com/package/@adityavijay21/upiqr)\n[![build status](https://img.shields.io/github/actions/workflow/status/adityavijay21/@adityavijay21/upiqr/main.yml?branch=main&style=flat-square)](https://github.com/adityavijay21/@adityavijay21/upiqr/actions/workflows/main.yml)\n[![npm downloads](https://img.shields.io/npm/dt/@adityavijay21/upiqr.svg?style=flat-square)](https://www.npmjs.com/package/@adityavijay21/upiqr)\n[![license](https://img.shields.io/npm/l/@adityavijay21/upiqr.svg?style=flat-square)](https://github.com/adityavijay21/@adityavijay21/upiqr/blob/main/LICENSE)\n\nA lightweight, modern, and customizable UPI QR code generator for Node.js, browsers, and React Native. Generate static and dynamic UPI QR codes with a simple, fluent API.\n\n---\n## 🌐 Live Demo\n\nTest out the package in a live environment! The React demo app we built is a perfect showcase.\n\n**[➡️ Launch the Live Demo](https://your-demo-url.vercel.app/)** _(You can deploy the React demo to a service like Vercel or Netlify to get this link)_\n\n<div align=\"center\">\n  \n</div>\n\n---\n## ✨ Features\n\n* ✅ **Fluent API:** Easy-to-use, chainable methods for a clean development experience.\n* ✅ **Framework Agnostic:** Works in Node.js, browsers, React, Vue, Svelte, and more.\n* ✅ **React Native Support:** First-class support for React Native via SVG output.\n* ✅ **Flexible Output:** Generate QR codes as Base64 PNGs (`dataURL`), `SVG` strings, or `UTF8` strings.\n* ✅ **Fully Typed:** Written in TypeScript for a great developer experience with autocompletion.\n* ✅ **Easy Installation:** No peer dependencies to manage. It just works.\n\n---\n## ⚙️ How It Works\n\nThe library simplifies the process of creating a valid UPI intent URL and encoding it into a QR code.\n\n`Your Data` ➡️ `UPIQR Class` ➡️ `UPI Intent String` ➡️ **QR Code**\n\n---\n## 📦 Installation\n\n```bash\nnpm install @adityavijay21/upiqr\n````\n\n-----\n\n## 🚀 Usage Examples\n\n### 1\\. Basic Usage (Node.js or Browser)\n\nCreate a QR code with a fixed amount and a transaction note.\n\n```javascript\nimport { UPIQR } from '@adityavijay21/upiqr';\n\nasync function generate() {\n  const { qr, intent } = await new UPIQR()\n    .set({\n      upiId: 'adityavijay21@okicici',\n      name: 'Aditya Vijay',\n      amount: 150.75,\n      transactionNote: 'For the awesome project!',\n    })\n    .generate();\n    \n  // qr is a base64 PNG dataURL string that can be used in an <img> tag.\n  console.log(qr);\n}\n\ngenerate();\n```\n\n### 2\\. Variable Amount (Static QR)\n\nOmit the `amount` field to let the person paying enter the amount themselves.\n\n```javascript\nimport { UPIQR } from '@adityavijay21/upiqr';\n\nconst { qr } = await new UPIQR()\n  .set({\n    upiId: 'adityavijay21@okicici',\n    name: 'Aditya Vijay',\n    // No amount is specified\n  })\n  .generate();\n```\n\n### 3\\. React Example\n\nA simple React component to display a generated QR code.\n\n```jsx\nimport React, { useState, useEffect } from 'react';\nimport { UPIQR } from '@adityavijay21/upiqr';\n\nfunction PaymentQRCode() {\n  const [qrCode, setQrCode] = useState('');\n  \n  useEffect(() => {\n    async function getQRCode() {\n      const { qr } = await new UPIQR()\n        .set({\n          upiId: 'shop@ybl',\n          name: 'My Awesome Shop',\n          amount: 250,\n        })\n        .generate();\n      setQrCode(qr);\n    };\n\n    getQRCode();\n  }, []);\n\n  if (!qrCode) return <div>Loading...</div>;\n\n  return <img src={qrCode} alt=\"UPI QR Code\" />;\n};\n```\n\n### 4\\. React Native Example (using SVG)\n\nFor React Native, generating an SVG is the best approach. You'll need `react-native-svg`.\n\n```jsx\nimport React, { useState, useEffect } from 'react';\nimport { View, Text } from 'react-native';\nimport { SvgXml } from 'react-native-svg';\nimport { UPIQR } from '@adityavijay21/upiqr';\n\nfunction PaymentQRCodeNative() {\n  const [qrSvg, setQrSvg] = useState(null);\n\n  useEffect(() => {\n    async function getQRCode() {\n      const { qr } = await new UPIQR()\n        .set({ upiId: 'shop@ybl', name: 'React Native Shop' })\n        .setOptions({ outputType: 'svg' }) // Generate an SVG string\n        .generate();\n      setQrSvg(qr);\n    };\n\n    getQRCode();\n  }, []);\n\n  if (!qrSvg) return <Text>Loading QR Code...</Text>;\n\n  return <SvgXml xml={qrSvg} width=\"250\" height=\"250\" />;\n};\n```\n\n-----\n\n## 🛠️ API Reference\n\n### `.set(params)`\n\nSets the UPI payment parameters.\n\n| Field | Type | Description | Required |\n| :--- | :--- | :--- | :--- |\n| `upiId` | String | The UPI ID of the payee (e.g., `user@bank`). | **Yes** |\n| `name` | String | The registered name of the payee. | **Yes** |\n| `amount`| Number | Amount to be paid. Omit for variable amount. | No |\n| `payeeMerchantCode` | String | Your Merchant Category Code. | No |\n| `transactionId` | String | A unique transaction ID for your reference. | No |\n| `transactionRef` | String | A reference ID for the transaction (e.g., Invoice \\#).| No |\n| `transactionNote` | String | A note for the payment (e.g., \"Coffee Payment\"). | No |\n| `minimumAmount` | Number | The minimum amount allowed for payment. | No |\n| `currency` | String | Currency code (defaults to `INR`). | No |\n\n### `.setOptions(options)`\n\nCustomizes the visual appearance of the generated QR code.\n\n| Field | Type | Description | Default |\n| :--- | :--- | :--- | :--- |\n| `outputType` | `'dataURL'`, `'svg'`, `'utf8'` | The desired output format of the QR code. | `'dataURL'` |\n| `width` | Number | The width of the QR code image in pixels. | `undefined` |\n| `margin` | Number | The width of the quiet zone border. | `4` |\n| `color.dark`| String (Hex)| The color of the dark modules (e.g., `#000000`). | `#000000FF`|\n| `color.light`| String (Hex)| The color of the light modules (e.g., `#FFFFFF`). | `#FFFFFFFF`|\n| `errorCorrectionLevel`| `'L'`, `'M'`, `'Q'`, `'H'` | The level of error correction. | `'M'` |\n\n### `.generate()`\n\nGenerates the QR code.\n\n  * **Returns:** `Promise<UPIQRResult>`\n  * `UPIQRResult` is an object: `{ qr: string, intent: string }`\n\n-----\n\n## 🤝 Contributing\n\nContributions, issues, and feature requests are welcome\\! Feel free to check the [issues page](https://www.google.com/search?q=https://github.com/adityavijay21/@adityavijay21/upiqr/issues).\n\n## 📄 License\n\nThis project is [MIT](https://www.google.com/url?sa=E&source=gmail&q=https://github.com/adityavijay21/@adityavijay21/upiqr/blob/main/LICENSE) licensed.\n","readmeFilename":"README.md","_rev":"1-3b0bceb58d6df9a85c00f434d9173ae5"}