qr-scanner-app 0.0.0 → 0.0.1

package/package.json

@@ -1,10 +1,13 @@
 {
   "name": "qr-scanner-app",
-  "version": "0.0.0",
+  "version": "0.0.1",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
     "build": "ng build",
+    "build:lib": "ng build ngx-custom-qr-scanner",
+    "pack:lib": "cd dist/ngx-custom-qr-scanner && npm pack",
+    "publish:lib": "cd dist/ngx-custom-qr-scanner && npm publish",
     "watch": "ng build --watch --configuration development",
     "test": "ng test"
   },

package/projects/ngx-custom-qr-scanner/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Dheeraj Prajapati
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/projects/ngx-custom-qr-scanner/README.md

@@ -1,63 +1,159 @@
-# NgxCustomQrScanner
+# ngx-custom-qr-scanner
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.2.0.
+A modern, feature-rich Angular QR code scanner library with an elegant UI, zoom controls, and torch/flash support. Built as a standalone component for Angular 19+.
 
-## Code scaffolding
+## ✨ Features
 
-Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+- 🎯 **Standalone Component** - Easy integration with Angular 19+
+- 📱 **Responsive Design** - Works on desktop and mobile devices
+- 🔦 **Torch/Flash Support** - Toggle flash for scanning in low light
+- 🔍 **Zoom Controls** - Adjustable zoom with vertical slider
+- 🎨 **Premium UI** - Modern interface with red sidebars and scan animations
+- 🔄 **Inverted QR Support** - Scans both normal and inverted (white on black) QR codes
+- 📸 **Auto-start** - Begins scanning immediately on component load
+- 🎯 **Environment Camera** - Defaults to back camera on mobile devices
+
+## 📦 Installation
 
 ```bash
-ng generate component component-name
+npm install ngx-custom-qr-scanner qr-scanner
 ```
 
-For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+> **Note:** `qr-scanner` is a peer dependency and must be installed separately.
 
-```bash
-ng generate --help
+## 🚀 Quick Start
+
+### 1. Import the Component
+
+Since this is a standalone component, you can import it directly into your component or module:
+
+```typescript
+import { Component } from '@angular/core';
+import { NgxCustomQrScannerComponent } from 'ngx-custom-qr-scanner';
+
+@Component({
+  selector: 'app-root',
+  standalone: true,
+  imports: [NgxCustomQrScannerComponent],
+  template: `<ngx-custom-qr-scanner></ngx-custom-qr-scanner>`
+})
+export class AppComponent { }
 ```
 
-## Building
+### 2. Use in Your Template
 
-To build the library, run:
+```html
+<ngx-custom-qr-scanner></ngx-custom-qr-scanner>
+```
 
-```bash
-ng build ngx-custom-qr-scanner
+That's it! The scanner will automatically start when the component loads.
+
+## 🎛️ Usage
+
+### Basic Implementation
+
+```typescript
+import { Component } from '@angular/core';
+import { NgxCustomQrScannerComponent } from 'ngx-custom-qr-scanner';
+
+@Component({
+  selector: 'app-scanner-page',
+  standalone: true,
+  imports: [NgxCustomQrScannerComponent],
+  template: `
+    <div class="scanner-wrapper">
+      <ngx-custom-qr-scanner></ngx-custom-qr-scanner>
+    </div>
+  `,
+  styles: [`
+    .scanner-wrapper {
+      width: 100vw;
+      height: 100vh;
+    }
+  `]
+})
+export class ScannerPageComponent { }
+```
+
+### In a Non-Standalone Module
+
+```typescript
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { NgxCustomQrScannerComponent } from 'ngx-custom-qr-scanner';
+import { AppComponent } from './app.component';
+
+@NgModule({
+  declarations: [AppComponent],
+  imports: [
+    BrowserModule,
+    NgxCustomQrScannerComponent  // Import the standalone component
+  ],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }
 ```
 
-This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
+## 🎨 UI Components
 
-### Publishing the Library
+The scanner includes:
 
-Once the project is built, you can publish your library by following these steps:
+- **Left Sidebar**: Displays "Tyre QR Code" text vertically with a thumbnail placeholder
+- **Center Area**: Live camera feed with scan region overlay and animated scan line
+- **Right Sidebar**: 
+  - Torch/Flash toggle button
+  - Vertical zoom slider with real-time zoom value display
 
-1. Navigate to the `dist` directory:
-   ```bash
-   cd dist/ngx-custom-qr-scanner
-   ```
+## 📱 Browser Compatibility
 
-2. Run the `npm publish` command to publish your library to the npm registry:
-   ```bash
-   npm publish
-   ```
+- Chrome/Edge 87+
+- Firefox 88+
+- Safari 14.1+
+- Mobile browsers with camera access
 
-## Running unit tests
+> **Note:** Requires HTTPS in production for camera access.
 
-To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+## 🔧 API Reference
 
-```bash
-ng test
+### Component Selector
+
+```typescript
+selector: 'ngx-custom-qr-scanner'
 ```
 
-## Running end-to-end tests
+### Public Properties
 
-For end-to-end (e2e) testing, run:
+The component currently handles QR scanning internally and displays results via alert. Future versions will include output events for custom handling.
 
-```bash
-ng e2e
-```
+## 🤝 Contributing
+
+Contributions are welcome! Please feel free to submit a Pull Request.
+
+1. Fork the repository
+2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
+3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
+4. Push to the branch (`git push origin feature/AmazingFeature`)
+5. Open a Pull Request
+
+## 📄 License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+
+## 👨‍💻 Author
+
+**Dheeraj Prajapati**
+- Email: dheerajprajapati9898@gmail.com
+- GitHub: [@dheerajprajapati9898](https://github.com/dheerajprajapati9898)
+
+## 🐛 Issues
+
+Found a bug? Please [open an issue](https://github.com/dheerajprajapati9898/ngx-custom-qr-scanner/issues) with a detailed description.
+
+## 🙏 Acknowledgments
 
-Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
+- Built with [qr-scanner](https://github.com/nimiq/qr-scanner) library
+- Designed for Angular 19+
 
-## Additional Resources
+---
 
-For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
+**Happy Scanning! 📱✨**

package/projects/ngx-custom-qr-scanner/package.json

@@ -10,11 +10,15 @@
   ],
   "private": false,
   "license": "MIT",
+  "homepage": "https://github.com/dheerajprajapati9898/ngx-custom-qr-scanner#readme",
   "repository": {
     "type": "git",
-    "url": "https://github.com/username/repo"
+    "url": "git+https://github.com/dheerajprajapati9898/ngx-custom-qr-scanner.git"
   },
-  "author": "Your Name",
+  "bugs": {
+    "url": "https://github.com/dheerajprajapati9898/ngx-custom-qr-scanner/issues"
+  },
+  "author": "Dheeraj Prajapati <dheerajprajapati9898@gmail.com>",
   "peerDependencies": {
     "@angular/common": "^19.2.0",
     "@angular/core": "^19.2.0",