phloxcz/components-upload

Resumable chunked file upload UI Control for Nette Framework with drag & drop, progress bars, queue, and Bootstrap/Tailwind theme support.

Maintainers

Package info

github.com/phloxcz/components-upload

pkg:composer/phloxcz/components-upload

Statistics

Installs: 1

Dependents: 0

Suggesters: 0

Stars: 0

Open Issues: 0

v1.0.0 2026-03-22 18:30 UTC

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:progress na document
  • Témata Bootstrap 5, Tailwind CSS nebo vlastní mapa CSS tříd
  • PHP událost onUploaded pro 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/: