Skip to main content

Uploady Context

Package​

@rpldy/uploady

Installation​

npm install @rpldy/uploady

Details​

When working in React, The UploadyContext is the API provider for the uploader mechanism. It wraps the uploader and exposes everything the app using it needs.

Accessing the Context API should be done using the useUploady hook.

import { useUploady } from "@rpldy/uploady";
info

Can only be called from components rendered under (descendant of) an <Uploady> component

API​

showFileUpload​

(?UploadOptions) => void

Show the native file selection dialog. Optionally Pass options as a parameter to override options set as props on the Uploady component.

upload​

(files: UploadInfo | UploadInfo[], addOptions: ?UploadOptions) => void

Upload file(s). Optionally Pass options as the second parameter to override options set as props on the Uploady component.

processPending​

(uploadOptions?: UploadOptions) => void

Start uploading batches that were added with autoUpload = false

Upload Options can be added here to be (deep) merged with the options the batch(es) was added with.

clearPending​

() => void

Remove all batches that were added with autoUpload = false, and were not uploaded yet.

setOptions​

(UploadOptions) => void

Update the uploader instance with different options than the ones used to initialize

getOptions​

() => UploadOptions

get the current options used by the uploader

getExtension​

(name: any) => ?Object

get an extension registered by that name (through an enhancer)

abort​

(id?: string) => void

abort all files being uploaded or a single item by its ID

abortBatch​

(id: string) => void

abort a specific batch by its ID

on​

(name: any, cb: EventCallback) => OffMethod

register for an event

once​

(name: any, cb: EventCallback) => OffMethod

register once for an event

off​

(name: any, cb?: EventCallback) => void

unregister an event handler

Example​

import React from "react";
import Uploady, { useUploady } from "@rpldy/uploady";

const MyUploadCButton = () => {
    const uploady = useUploady();

    const onClick = () => {
        uploady.showFileUpload();
    };

    return <button onClick={onClick}>Custom Upload Button</button>;
}

const App = () => (
	<Uploady>
    <MyUploadCButton/>
	</Uploady>
);