PHPackages kukux/modern-file-upload - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [File & Storage](/categories/file-storage) 4. / 5. kukux/modern-file-upload ActiveLibrary[File & Storage](/categories/file-storage) kukux/modern-file-upload ======================== This is Modern File Upload v1.0.13(2mo ago)027MITJavaScriptPHP ^8.2 Since Feb 28Pushed 2mo agoCompare [ Source](https://github.com/cortejojicoy/modern-file-upload)[ Packagist](https://packagist.org/packages/kukux/modern-file-upload)[ RSS](/packages/kukux-modern-file-upload/feed)WikiDiscussions main Synced 1mo ago READMEChangelogDependencies (12)Versions (15)Used By (0) Modern File Upload for Filament =============================== [](#modern-file-upload-for-filament) [![Latest Version on Packagist](https://camo.githubusercontent.com/8a97364ead0bc4416db8ac006df423e60a67ad52148422b6e76c60aaccca925a/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6b756b75782f6d6f6465726e2d66696c652d75706c6f61642e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/kukux/modern-file-upload)[![Total Downloads](https://camo.githubusercontent.com/a2a06f63814bb5ab056b995136001db12b314e962084b911c3cb89e9c8437325/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6b756b75782f6d6f6465726e2d66696c652d75706c6f61642e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/kukux/modern-file-upload)[![License](https://camo.githubusercontent.com/f5fe2cc256f089b630044e6222740c6decec3407139d963842974eae8900b0aa/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f6b756b75782f6d6f6465726e2d66696c652d75706c6f61643f7374796c653d666c61742d737175617265)](LICENSE.md) A modern, React-powered file upload and file viewer plugin for [Filament](https://filamentphp.com). Supports Filament `^3.0`, `^4.0`, and `^5.0` with image previews, PDF thumbnails, gallery and list views, dark mode, and an optional document action system (verify/return) as a drop-in Filament form field and infolist entry. --- Features -------- [](#features) - **Custom file upload field** with drag & drop, progress tracking, and multi-file support - **PDF thumbnail rendering** using `pdfjs-dist` - **Image & file viewer** with zoom, pan, and page navigation - **Dark mode** support out of the box - **Gallery and list view** modes - **Optional file actions** — attach verify/return controls per file (e.g. for document approval workflows) - Assets loaded **on demand** — JS only loads on pages that use the components --- Requirements ------------ [](#requirements) - PHP `^8.2` - Laravel version compatible with your chosen Filament major - Filament `^3.0`, `^4.0`, or `^5.0` - Node.js (only needed if contributing or publishing changes) --- Installation ------------ [](#installation) Install via Composer: ``` composer require kukux/modern-file-upload ``` Important This plugin ships pre-built JS assets. After installation or package updates, run `php artisan filament:assets` in your app so Filament can publish the package assets. ### 1. Add Plugin Views to Your Tailwind Config [](#1-add-plugin-views-to-your-tailwind-config) If you are using a custom Filament theme (recommended), add the plugin's source paths so Tailwind includes its utility classes: ``` // tailwind.config.js export default { darkMode: 'class', content: [ // ... your existing paths './vendor/kukux/modern-file-upload/resources/views/**/*.blade.php', './vendor/kukux/modern-file-upload/resources/js/**/*.jsx', ], } ``` Then rebuild your theme: ``` npm run build ``` ### 2. Publish Filament Assets [](#2-publish-filament-assets) Run: ``` php artisan filament:assets ``` ### 3. Temporary Preview Behavior [](#3-temporary-preview-behavior) Fresh uploads are previewed in the browser before the form is saved, so no extra Livewire page trait is required for normal image or PDF previews. If your app still uses Livewire temporary preview configuration for PDFs, make sure the `preview_mimes` entry uses the extension format: ``` 'temporary_file_upload' => [ 'preview_mimes' => [ 'png', 'gif', 'bmp', 'svg', 'wav', 'mp4', 'mov', 'avi', 'wmv', 'mp3', 'm4a', 'jpg', 'jpeg', 'mpga', 'webp', 'wma', 'pdf', ], ], ``` Use `'pdf'`, not `'application/pdf'`. Usage ----- [](#usage) ### File Upload Field (Form) [](#file-upload-field-form) ``` use Kukux\ModernFileUpload\Forms\Components\FileUpload; public static function form(Form $form): Form { return $form->schema([ FileUpload::make('attachment') ->label('Upload File') ->disk('public') ->directory('uploads/attachments') ->accept('application/pdf') ->multiple() ]); } ``` ### File Viewer Entry (Infolist) [](#file-viewer-entry-infolist) ``` use Kukux\ModernFileUpload\Infolists\Components\FileViewer; public static function infolist(Infolist $infolist): Infolist { return $infolist->schema([ FileViewer::make('attachment') ->label('Attached File') ->showDownload() ->showPdfThumbnails(), ]); } ``` --- Optional: File Actions (Verify / Return) ---------------------------------------- [](#optional-file-actions-verify--return) For document approval workflows, you can attach per-file action controls (verify and return buttons) to any upload field. These only appear on **already saved** files — not on fresh temporary uploads. ### 1. Add a Livewire method to your resource or page [](#1-add-a-livewire-method-to-your-resource-or-page) ``` public function updateAction(int $fileId, string $action, ?string $remarks = null): void { $file = Attachment::findOrFail($fileId); $file->update([ 'status' => $action, 'remarks' => $remarks, ]); } ``` ### 2. Attach the action to your field [](#2-attach-the-action-to-your-field) ``` FileUpload::make('attachment') ->disk('public') ->directory('uploads/attachments') ->accept('application/pdf') ->fileAction(function ($record) { return [ 'method' => 'updateAction', // your Livewire method name 'fileId' => $record?->id, 'status' => $record?->status, // "verified" | "returned" | null ]; }) ``` The verify/return buttons will appear on each saved PDF thumbnail. A confirmation modal is shown before any action is taken. Returned documents require a remarks/reason field before confirming. --- Available Methods ----------------- [](#available-methods) ### `FileUpload` [](#fileupload) MethodDescription`->disk(string $disk)`Storage disk (default: `public`)`->directory(string $path)`Upload directory`->accept(string $mime)`Accepted MIME types (e.g. `application/pdf`, `image/*`)`->multiple(bool $condition)`Allow multiple file uploads`->fileAction(\Closure $callback)`Attach verify/return action controls### `FileViewer` [](#fileviewer) MethodDescription`->showDownload(bool $condition)`Show download button (default: `true`)`->showPdfThumbnails(bool $condition)`Render PDF first-page thumbnails (default: `true`)--- Changelog --------- [](#changelog) Please see [CHANGELOG](CHANGELOG.md) for what has changed in each release. Contributing ------------ [](#contributing) Contributions are welcome! Please see [CONTRIBUTING](.github/CONTRIBUTING.md) for details. Security -------- [](#security) If you discover a security vulnerability, please review our [Security Policy](.github/SECURITY.md). Credits ------- [](#credits) - [cortejojicoy](https://github.com/cortejojicoy) - [All Contributors](../../contributors) --- License ------- [](#license) The MIT License (MIT). Please see the [License File](LICENSE.md) for more information. ### Health Score 42 — FairBetter than 90% of packages Maintenance88 Actively maintained with recent releases Popularity10 Limited adoption so far Community8 Small or concentrated contributor base Maturity54 Maturing project, gaining track record Bus Factor1 Top contributor holds 68% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~1 days Total 14 Last Release 60d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/c6adf88c12735f824225543da2e1ed8d539d65257836011ceac56014484435d4?d=identicon)[cortejojicoy](/maintainers/cortejojicoy) --- Top Contributors [![cortejojicoy](https://avatars.githubusercontent.com/u/34363543?v=4)](https://github.com/cortejojicoy "cortejojicoy (17 commits)")[![Jicoy](https://avatars.githubusercontent.com/u/108109666?v=4)](https://github.com/Jicoy "Jicoy (8 commits)") --- Tags laravelfilament-pluginfilamentphpmodern-file-upload ### Code Quality TestsPest ### Embed Badge ![Health badge](/badges/kukux-modern-file-upload/health.svg) ``` [![Health](https://phpackages.com/badges/kukux-modern-file-upload/health.svg)](https://phpackages.com/packages/kukux-modern-file-upload) ``` ### Alternatives [bezhansalleh/filament-language-switch Zero config Language Switch(Changer/Localizer) plugin for filamentphp admin 3431.0M16](/packages/bezhansalleh-filament-language-switch)[bezhansalleh/filament-google-analytics Google Analytics integration for FilamentPHP 205144.8k5](/packages/bezhansalleh-filament-google-analytics)[jibaymcs/filament-tour Bring the power of DriverJs to your Filament panels and start a tour ! 12247.8k](/packages/jibaymcs-filament-tour)[guava/filament-modal-relation-managers Allows you to embed relation managers inside filament modals. 7565.0k4](/packages/guava-filament-modal-relation-managers)[mwguerra/filemanager A full-featured file manager package for Laravel and Filament v5 with dual operating modes, drag-and-drop uploads, S3/MinIO support, and comprehensive security features. 718.5k1](/packages/mwguerra-filemanager)[jiten14/jitone-ai jitone-ai is a powerful FilamentPHP plugin that integrates AI-powered features directly into your Filament forms. 213.1k](/packages/jiten14-jitone-ai) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)