React-Uploady

The @rpldy/uploady package is the core UI component of the React Uploady ecosystem. Its primary roles are:

1. Initialization: It initializes and exposes the underlying uploader functionality.
2. Provider: It contains the Provider component, which acts as the context provider that all other UI packages (like progress bars, upload lists, etc.) rely on to access upload state and logic.
3. Advanced Features: It provides multiple hooks that allow client applications to access advanced features and upload data.

The @rpldy/raw-uploader package is intended to be the base uploader for the React Uploady ecosystem. It is designed for scenarios where standard functionality (like xhr-sender or abort capabilities) is not required, or when you need to replace the core uploading logic with completely custom functionality.

Note: As of the current version, this is a placeholder package containing only Flow types and will be expanded in future updates.

The UploadDropZone component is a container that initiates file and folder uploads via drag-and-drop. It supports individual files and recursive directory uploads using html-dir-content.

Drop Zones can use configuration overrides that supersede the options passed to the parent Uploady component. Note that some options (like those influencing the file input directly, e.g., _multiple_) cannot be overridden.

import Uploady from "@rpldy/uploady";
import UploadDropZone from "@rpldy/upload-drop-zone";

const App = () => (
    <Uploady destination={destination}>
        <UploadDropZone onDragOverClassName="drag-over"
                        grouped
                        maxGroupSize={3}
        >
            <span>Drag&Drop File(s) Here</span>            
        </UploadDropZone>
    </Uploady>);

When featureDetection is enabled, the sender queries the server for supported extensions. If an option is requested that the server does not support, it will be automatically disabled.

Supported options subject to feature detection:

• parallel (requires concatenation extension)
• sendDataOnCreate (requires creation-with-upload extension)
• deferLength (requires creation-defer-length extension)

If you provide an onFeaturesDetected callback, you are responsible for returning an object that merges with the current options to override unsupported features.

CORS Requirement: For feature detection to work across different origins, the server must allow the Tus-Extension and Tus-Version headers to be read over CORS.

Enhancers are functions used to modify an uploader instance. They are passed as part of the options to the Uploady instance and are applied when the uploader instance is created. They can be used to change how the uploader operates or to provide different default behaviors.

(uploader: UploaderType, trigger: Trigger<mixed>) => UploaderType

The @rpldy/chunked-sender adds chunked upload capabilities on top of the regular XHR @rpldy/sender. It provides an UploaderEnhancer that replaces the default send method used by the uploader.

Limitations:

• Chunked uploading does not support grouped uploads (sending multiple files in a single XHR request).
• Chunked uploading does not support URL uploading.

If these unsupported features are used, the library will fall back to the default @rpldy/sender behavior.

The Uploader is a vanilla JavaScript processing and queuing engine. It represents each file as a Batch Item and groups them into Batches. While it is largely internal to the React-Uploady ecosystem, it manages the lifecycle of uploads by firing Batch and BatchItem events.

Note: If you are building a React application, you should generally use @rpldy/uploady instead of interacting with this package directly, as Uploady handles initialization and event registration for you.

Upload Options

Upload Options configure the uploader's behavior (e.g., whether files can be grouped in a single request). They are typically passed to the <Uploady> instance but can be overridden via:

• Props passed to an upload button.
• Dynamic parameters during upload processing.

Destination

A Destination is an object within the upload options that configures the server endpoint. At a minimum, it must contain a url property representing the server endpoint.