phloxcz / components-upload
Resumable chunked file upload UI Control for Nette Framework with drag & drop, progress bars, queue, and Bootstrap/Tailwind theme support.
v1.0.0
2026-03-22 18:30 UTC
Requires
- php: ^8.1
- nette/application: ^3.1
- nette/utils: ^4.0
Requires (Dev)
- nette/tester: ^2.5
- phpstan/phpstan: ^1.10
- phpstan/phpstan-nette: ^1.2
- phpunit/phpunit: ^10.0
- squizlabs/php_codesniffer: ^3.7
This package is auto-updated.
Last update: 2026-04-22 18:43:08 UTC
README
Resumable chunked file upload UI Control pro Nette Framework.
- Drag & drop zóna s fallbackem na klik, plně přístupná klávesnicí
- Resumable upload — přerušený přenos pokračuje od posledního odeslaného chunku
- Progress bar celkového postupu fronty + inline progress bar aktivního souboru
- Fronta souborů, která po dokončení položky vyfaduje
- Frontendové události
pu:uploaded,pu:allUploaded,pu:progressnadocument - Témata Bootstrap 5, Tailwind CSS nebo vlastní mapa CSS tříd
- PHP událost
onUploadedpro uložení metadat do DB - Plně lokalizovatelné texty přes
setTexts()
Požadavky
| Balíček | Verze |
|---|---|
| PHP | ≥ 8.1 |
| nette/application | ≥ 3.1 |
| nette/utils | ≥ 4.0 |
Instalace
composer require phloxcz/components-upload
Quickstart
1. Registrace factory v config.neon
services: - implement: Phlox\Components\Upload\UploadControlFactory
2. Komponenta v presenteru
use Phlox\Components\Upload\UploadControl; use Phlox\Components\Upload\UploadControlFactory; class FilePresenter extends Nette\Application\UI\Presenter { public function __construct( private readonly UploadControlFactory $uploadFactory, private readonly FileRepository $fileRepository, ) {} protected function createComponentUpload(): UploadControl { $upload = $this->uploadFactory->create('/var/storage/uploads'); $upload ->setChunkSize(2 * 1024 * 1024) ->setMultiple(true) ->setMaxFileSize(100 * 1024 * 1024) ->setTheme(UploadControl::THEME_BOOTSTRAP); $upload->onUploaded[] = function (array $fileInfo): void { $this->fileRepository->save([ 'original_name' => $fileInfo['originalName'], 'stored_name' => $fileInfo['storedName'], 'path' => $fileInfo['path'], 'size' => $fileInfo['size'], 'mime_type' => $fileInfo['mimeType'], ]); }; return $upload; } }
3. Šablona
{control upload}
4. Assets
// app.js import 'vendor/phloxcz/components-upload/assets/upload-control.css'; import 'vendor/phloxcz/components-upload/assets/upload-control.js';
Dokumentace
Podrobná dokumentace je v adresáři docs/: