npm install @filelib/uppy@4.0.0-beta

npm install @uppy/react@~4  @uppy/core@~4 @uppy/dashboard@~4 \
@uppy/status-bar@~4 @uppy/progress-bar@~4 @filelib/uppy \
@uppy/file-input@~4 @uppy/drag-drop@~4

// You will need the following CSS files to be imported for the dashboard styling. 
import '@uppy/core/dist/style.min.css'
import '@uppy/dashboard/dist/style.min.css'
import { Config } from '@filelib/client'
import { Dashboard } from '@uppy/react'
import FilelibUppy from '@filelib/uppy'
import StatusBar from '@uppy/status-bar'
import Uppy from '@uppy/core'

const uppy = new Uppy({
    id: "UppyDashboard",
    restrictions: {
        maxFileSize: 5 * 1024 * 1024, // 5MB
        maxNumberOfFiles: 5,
        allowedFileTypes: ["image/*", "video/*", "audio/*", ".pdf", ".txt", ".zip", ".rar"]
    }
}).use(FilelibUppy, {
    // Get your key from https://filelib.com/dashboard/credentials
    authKey: '<your-credential-api-key>',
    onSuccess: (file) = >{
        console.log("Upload Success: Filelib File:", file)
    },
    onError: (e) = >{
        console.log("Upload Error: Filelib File:", e)
    },
    useCache: true,
    abortOnFail: false,
    clearCache: false,
    // Config object tells the SDK where to place your uploaded file.
    // You will need to configure a storage option and provide the name gere.
    // Configure and get the name here: https://filelib.com/dashboard/storage
    config: new Config({
        storage: "<your-storage-configuration-name>"
    })
})
.use(StatusBar, {
    hidePauseResumeButton: false
})

<Dashboard uppy={uppy} id={"UppyDashboard"} theme={"dark"|"light"} />