Skip to content
muqiitf.tech
SOFTWARE RECORD

Filament QR Code - QR & Barcode Plugin for Filament v5

A powerful, modern, all-in-one open-source QR code plugin built exclusively for Filament v5 and Laravel 11/12/13. Features an interactive camera scanner, hardware barcode-gun support, sequential and batch scanning, and a full SVG/PNG QR generator suite for Forms, Tables, Infolists, and Actions.

RECORD TYPE

Web Application

TECHNOLOGIES

PHPLaravelFilamentPHPLivewireAlpine.jsTailwind CSS

LIVE SITE

Visit Live

SOURCE CODE

View Repository
Cover image for Filament QR Code - QR & Barcode Plugin for Filament v5

Detailed case study & architecture

Overview

Filament QR Code (https://filamentphp.com/plugins/mmuqiitf-qr-code) is an open-source Composer package that brings complete QR code and barcode workflows to Filament v5 admin panels. It is published on the official Filament plugin directory and Packagist as mmuqiitf/filament-qr-code.

The plugin covers both sides of the workflow — capturing codes (camera, image upload, or handheld hardware scanners) and generating codes (SVG/PNG with captions and logos) — so inventory, POS, ticketing, and asset-tracking apps can be built without stitching together multiple libraries.

Key Features

  • Interactive Camera Scanner: Real-time camera stream with rear-camera prioritization, remembered device choice, a decode box synced to the on-screen reticle, and an image upload fallback — bundled locally with zero CDN latency.
  • Sequential Scanning: QrScanSequence walks one shared camera feed through a multi-field checklist with editable or locked steps.
  • Hardware Scanner Support: Native burst-keystroke detection (<50ms) that swallows trailing Enter/Tab keys so barcode guns never submit forms prematurely.
  • Batch Collector: Continuous scanning into repeaters and lists with duplicate protection — ideal for stocktakes and receiving.
  • Full QR Generator Suite: SVG & PNG output with text overlays and logo embedding via QrCodeDisplay, QrColumn, QrEntry, DownloadQrAction, and bulk printable label sheets.
  • Sensory Confirmation: Zero-latency Web Audio beep and mobile haptic feedback, tunable per component.
  • Multi-Symbology: QR Code, Aztec, DataMatrix, Code128, Code39, EAN-13/8, UPC-A/E, and more.

Technical Highlights

  • Lazy-loaded decoder chunk (~375K) keeps the global bundle at ~20K; pages that only render QR images never fetch it.
  • Scanned values write through Livewire $wire.set, so validation and reactivity behave like typed input; camera DOM lives under wire:ignore to survive Livewire morphs.
  • Server-side generation cached in-process and in the Laravel cache; table previews load lazily through a signed image route.
  • Built-in php artisan qr-code:doctor diagnostics, scan audit events, translations, and PHPStan level 9 static analysis.

Installation

BASH
composer require mmuqiitf/filament-qr-code
PHP
use Mmuqiitf\FilamentQrCode\Forms\Components\QrScanner;

QrScanner::make('sku')->label('SKU');

Tech Stack

PHP 8.2+, Laravel, Filament v5, Livewire, Alpine.js, Tailwind CSS, html5-qrcode.