Uploader
Advanced file uploader with drag and drop, multi-selection, validation and aggregated progress, aligned with NeuralUI forms and dashboard workflows.
TypeScript
import { NeuUploaderComponent } from '@neural-ui/core/uploader';
import type { NeuUploaderError } from '@neural-ui/core/uploader';Product assets and attachments
Choose files
Drag files here or select them from your device. · Allowed types: image/*,.pdf · Max size: 2.0 MB
Upload in progress68%
Accepts images and PDF documents up to 2 MB.
TypeScript
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { NeuUploaderComponent, NeuUploaderError } from '@neural-ui/core/uploader';
@Component({
imports: [NeuUploaderComponent, ReactiveFormsModule],
template: <neu-uploader
label="Assets"
hint="PNG, JPG or PDF files up to 2 MB"
accept="image/*,.pdf"
[multiple]="true"
[showProgress]="true"
[maxFiles]="5"
[maxFileSize]="2097152"
[fileStates]="fileStates"
[formControl]="filesCtrl"
(filesRejected)="onRejected($event)"
(fileRetry)="retryUpload($event)"
/> })
export class MyUploaderComponent {
readonly filesCtrl = new FormControl<File[] | null>(null);
readonly fileStates = {
'contract.pdf': { status: 'uploading', progress: 64 },
'hero.png': { status: 'error', error: 'Network timeout' },
};
onRejected(errors: NeuUploaderError[]): void {
console.log(errors);
}
retryUpload(file: File): void {
console.log('retry', file.name);
}
}