- Updated `nuxt.config.ts` to include `@zxing/library` in the transpile list, ensuring compatibility with the new barcode scanning functionality.
- Modified `BarcodeInput.vue` and `FileInput.vue` components to wrap the `CameraUpload` component in a `<ClientOnly>` tag, preventing server-side rendering issues and improving the user experience during barcode scanning.
These changes aim to enhance the functionality of the barcode scanning feature while ensuring proper rendering in client-side environments.
- Replace SVG icon in BarcodeInput with a new Icon component for improved visual consistency.
- Update CameraUpload component to enhance styling and functionality, including:
- Add a barcode scanning overlay for better user experience during scanning.
- Refactor video and canvas elements to improve layout and responsiveness.
- Adjust button sizes and styles for better accessibility and usability.
- Implement more robust camera handling logic, including improved facing mode management and error handling for mobile devices.
These changes aim to enhance the user interface and overall functionality of the barcode scanning feature, ensuring a smoother experience for users.
* Add Barcode Input Component and Integrate Quagga for Scanning
- Introduced a new BarcodeInput component for scanning barcodes using the Quagga library.
- Updated package.json and package-lock.json to include Quagga as a dependency.
- Enhanced form themes to accommodate the new BarcodeInput component.
- Added localization support for barcode scanning actions in English.
- Updated blocks_types.json to register the new barcode input type.
These changes improve the application's functionality by allowing users to scan barcodes directly within forms, enhancing user experience and data input efficiency.
* Update Barcode scanner UI
* Barcode decoder as user selection
* improve barcode
Julien Nahum
Chirag Chhatrala