← All @molecule/* packages · App templates
@molecule/app-file-upload-filepondProvider bond · file-upload · App (browser) · v1.0.1 · Apache-2.0
FilePond-style file upload provider for @molecule/app-file-upload
npm install @molecule/app-file-upload-filepondnpm · Source on GitHub · Implements @molecule/app-file-upload
@molecule/app-file-upload-filepond is a provider bond on the app (browser) side: it implements the file-upload core interface (@molecule/app-file-upload) with a concrete vendor or library behind it.
Your code calls the core; you wire this provider once at startup. Swapping vendors later is one line in that wiring, not a rewrite.
import { provider } from '@molecule/app-file-upload-filepond'
import { setProvider } from '@molecule/app-file-upload'
setProvider(provider)Works with: @molecule/app-file-upload, @molecule/app-i18n
Auto-generated, AI-first package reference for the molecule.dev ecosystem. It is written to be read by coding agents as much as by people, and is generated from this package's source — edit
src/index.tsJSDoc, not this file.
FilePond file upload provider for the molecule file upload interface.
Implements FileUploadProvider from @molecule/app-file-upload using a
headless upload engine with validation, progress tracking, concurrency
control, and image preview generation following FilePond's patterns.
import { provider } from '@molecule/app-file-upload-filepond'
import { setProvider } from '@molecule/app-file-upload'
setProvider(provider)
provider
npm install @molecule/app-file-upload-filepond @molecule/app-file-upload @molecule/app-i18n
FilepondConfigConfiguration options for the FilePond file upload provider.
interface FilepondConfig {
/**
* Timeout in milliseconds for individual upload requests.
* Set to `0` for no timeout. Defaults to `0`.
*/
timeout?: number
}
createFilepondProvider(config)Creates a FilePond-style file upload provider.
function createFilepondProvider(config?: FilepondConfig): FileUploadProvider
config — Optional FilePond-specific configuration.Returns: A FileUploadProvider backed by FilePond-style processing.
providerDefault FilePond file upload provider instance.
const provider: FileUploadProvider
Implements @molecule/app-file-upload interface.
Setup function to register this provider with the core interface:
import { setProvider } from '@molecule/app-file-upload'
import { provider } from '@molecule/app-file-upload-filepond'
export function setupFileUploadFilepond(): void {
setProvider(provider)
}
Peer dependencies:
@molecule/app-file-upload >=1.0.1@molecule/app-i18n >=1.0.1@molecule/app-file-upload@molecule/app-i18nTransport is ONE multipart/form-data request per file to
destination.url (default method POST, default field name 'file',
additionalData appended as extra fields); the response is parsed as
JSON when possible (else raw text) and can be reshaped with
destination.parseResponse. This is NOT FilePond's process/revert server
protocol — any endpoint accepting a multipart POST works. Files that fail
validation are reported via events.onValidationError and NEVER enter
the queue (they won't appear in getFiles()). timeout defaults to 0
(no timeout). Every error/validation message routes through t() under the
fileUpload.error.* namespace with an English defaultValue, so English
works out of the box. There is no dedicated companion locale bond yet —
to translate these, register fileUpload.error.* keys with your i18n
provider (e.g. addTranslations('fr', { 'fileUpload.error.timedOut': '…' })).
Interpolated messages expose {{maxSize}}, {{minSize}}, {{type}},
{{extension}}, {{maxFiles}}, and {{status}}.
Integration checklist — drive the real UI (live preview, no mocks), adapt each item to this app's actual screens/flows, and check every box off one by one. A box you can't check is an integration bug to fix — not a skip: