@osmandvc/react-upload-control 0.3.0 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +52 -37
  2. package/package.json +5 -1
package/README.md CHANGED
@@ -101,8 +101,6 @@ The upload handler receives two parameters:
101
101
  1. `files`: An array of `UploadedFile` objects to be uploaded
102
102
  2. `onProgressChange`: A callback function to update the upload progress
103
103
 
104
- The upload handler should return an array of `UploadFileResult` objects, which specify the success, error, and metadata for each file upload. The library will handle the UI updates based on the progress updates and final results you provide.
105
-
106
104
  Here are two examples of implementing an upload handler:
107
105
 
108
106
  ### Example 1: Simple Batch Upload
@@ -299,6 +297,58 @@ function MyFileUpload() {
299
297
  }
300
298
  ```
301
299
 
300
+ ### Understanding UploadFileResult
301
+
302
+ The upload handler must return an array of `UploadFileResult` objects - one for each uploaded file. Here's the structure:
303
+
304
+ ```typescript
305
+ type UploadFileResult = {
306
+ // The ID of the file that was uploaded (must match the original file.id)
307
+ fileId: string;
308
+
309
+ // Whether the upload was successful
310
+ success: boolean;
311
+
312
+ // Optional error information if success is false
313
+ error?: {
314
+ text: string; // Human-readable error message
315
+ code: string; // Error code for programmatic handling
316
+ };
317
+
318
+ // Optional metadata to attach to the file
319
+ metadata?: {
320
+ [key: string]: any; // Any additional data you want to store with the file
321
+ };
322
+ };
323
+ ```
324
+
325
+ Example of a successful upload result:
326
+
327
+ ```typescript
328
+ {
329
+ fileId: "file123",
330
+ success: true,
331
+ metadata: {
332
+ url: "https://example.com/uploads/file123.jpg",
333
+ uploadedAt: "2025-01-02T12:00:00Z",
334
+ size: 1024000
335
+ }
336
+ }
337
+ ```
338
+
339
+ Example of a failed upload result:
340
+
341
+ ```typescript
342
+ {
343
+ fileId: "file456",
344
+ success: false,
345
+ error: {
346
+ text: "File size exceeds server limit",
347
+ code: "SIZE_LIMIT_EXCEEDED"
348
+ }
349
+ }
350
+ ```
351
+
302
352
  ## onDelete Handler
303
353
 
304
354
  The `onDelete` handler is designed to be non-blocking and does not include progress tracking. This is intentional for better UX - since it's primarily used for cleanup when resetting a control with already finished uploads. Users should be able to reset the control immediately without waiting for deletion to complete or being blocked by deletion errors.
@@ -369,41 +419,6 @@ The provider component that manages the upload state and configuration.
369
419
  | disableFileSystem | boolean | false | Disable file system uploads |
370
420
  | className | string | undefined | Additional CSS classes |
371
421
 
372
- ## Understanding the UploadedFile Type
373
-
374
- When implementing your upload handlers, you'll work with the `UploadedFile` type, which provides access to various file properties:
375
-
376
- ```typescript
377
- interface UploadedFile {
378
- id: string; // Unique identifier for the file
379
- file?: File; // The actual File object
380
- name: string; // File name
381
- size?: number; // File size in bytes
382
- type: string; // MIME type
383
- base64Uri?: string; // Base64 encoded file content
384
- previewImg?: {
385
- // Preview image data (for images)
386
- imgBase64Uri: string;
387
- width?: number;
388
- height?: number;
389
- };
390
- uploadStatus: {
391
- // Current upload status
392
- stage?: "IDLE" | "FINISHED" | "FAILED" | "UPLOADING" | "REMOVING";
393
- progress?: number; // Upload progress (0-100)
394
- error?: {
395
- text: string; // Error message
396
- code: string; // Error code
397
- };
398
- };
399
- order?: number; // File order in the list
400
- metadata?: {
401
- // Custom metadata
402
- [key: string]: any;
403
- };
404
- }
405
- ```
406
-
407
422
  ## File Processing
408
423
 
409
424
  React Upload Control supports file processing through the optional [@osmandvc/react-upload-control-processors](https://www.npmjs.com/package/@osmandvc/react-upload-control-processors) package. This enables you to process files before or after upload, with built-in support for PDF manipulation and extensible architecture for custom processors.
package/package.json CHANGED
@@ -1,9 +1,13 @@
1
1
  {
2
2
  "name": "@osmandvc/react-upload-control",
3
- "version": "0.3.0",
3
+ "version": "0.3.1",
4
4
  "description": "A completely free and open-source file uploader library designed for modern react applications. This package focuses on delivering a feature-rich experience while prioritizing an exceptional developer experience (DX). Whether you're handling simple uploads or complex multi-file scenarios, this library offers powerful customization, seamless integration, and a smooth workflow for developers. Perfect for those who need an efficient, flexible, and easy-to-use file uploader solution in their projects.",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "https://github.com/osmandvc/react-upload-control.git"
10
+ },
7
11
  "files": [
8
12
  "dist",
9
13
  "dist/**/*.d.ts",