@shipstatic/drop 0.1.12 → 0.1.13

package/README.md

@@ -85,7 +85,7 @@ function MyUploader() {
   });
 
   const handleUpload = async () => {
-    // ProcessedFile extends StaticFile - no conversion needed!
+    // Extract File objects from ProcessedFiles for Ship SDK
     await ship.deployments.create(drop.validFiles.map(f => f.file));
   };
 
@@ -476,27 +476,34 @@ Use `clearAll()` to reset and try again:
 
 ```typescript
 /**
- * ProcessedFile extends StaticFile from @shipstatic/types
- * This means it can be passed directly to ship.deployments.create()
+ * ProcessedFile - a file processed by Drop, ready for Ship SDK deployment
  *
+ * Use the `file` property to pass to ship.deployments.create()
  * Note: md5 is intentionally undefined - Ship SDK calculates it during deployment
  */
-interface ProcessedFile extends StaticFile {
-  // StaticFile properties (SDK compatibility)
-  content: File;        // File object (required by SDK)
-  path: string;         // Normalized path (webkitRelativePath or file.name)
-  size: number;         // File size in bytes
-  md5?: string;         // Undefined - Ship SDK calculates during deployment
-
-  // ProcessedFile-specific properties (UI functionality)
-  id: string;           // Unique identifier for React keys
-  file: File;           // Alias for 'content' (better DX)
-  name: string;         // File name without path
-  type: string;         // MIME type
+interface ProcessedFile {
+  /** Unique identifier for React keys */
+  id: string;
+  /** The File object - pass this to ship.deployments.create() */
+  file: File;
+  /** Relative path for deployment (e.g., "images/photo.jpg") */
+  path: string;
+  /** File size in bytes */
+  size: number;
+  /** MD5 hash (optional - Ship SDK calculates during deployment if not provided) */
+  md5?: string;
+  /** Filename without path */
+  name: string;
+  /** MIME type for UI icons/previews */
+  type: string;
+  /** Last modified timestamp */
   lastModified: number;
+  /** Current processing/upload status */
   status: FileStatus;
-  statusMessage?: string;  // Per-file error message
-  progress?: number;       // Upload progress (0-100)
+  /** Human-readable status message for UI */
+  statusMessage?: string;
+  /** Upload progress (0-100) - only set during upload */
+  progress?: number;
 }
 
 interface ClientError {
@@ -519,36 +526,30 @@ type FileStatus =
 
 ## Direct Ship SDK Integration
 
-**ProcessedFile extends StaticFile** - no conversion needed! Since `ProcessedFile` extends `StaticFile` from `@shipstatic/types`, you can pass the files directly to the Ship SDK:
+Extract the `file` property from ProcessedFiles to pass to Ship SDK:
 
 ```typescript
-const validFiles = drop.getValidFiles();
+// Get valid files and extract File objects for deployment
+const filesToDeploy = drop.validFiles.map(f => f.file);
 
-// ProcessedFile[] IS StaticFile[] - pass directly!
-await ship.deployments.create({ files: validFiles });
+// Pass File[] to Ship SDK
+await ship.deployments.create(filesToDeploy);
 ```
 
-### Type Compatibility
+### Why Extract `.file`?
+
+Ship SDK's browser `deployments.create()` accepts `File[]`. Drop's `ProcessedFile` wraps the File with additional UI metadata (id, status, progress). The `.file` property gives you the raw File object that Ship SDK expects.
 
 ```typescript
-// ✅ This works because ProcessedFile extends StaticFile
-interface ProcessedFile extends StaticFile {
-  content: File;   // Required by StaticFile
-  path: string;    // Required by StaticFile
-  size: number;    // Required by StaticFile
-  md5?: string;    // Required by StaticFile
-
-  // Additional UI properties
-  id: string;
-  file: File;      // Alias for 'content' (better DX)
-  name: string;
-  type: string;
-  status: FileStatus;
-  // ... etc
+// ProcessedFile structure
+interface ProcessedFile {
+  file: File;      // ← Pass this to Ship SDK
+  path: string;    // Normalized path (set on file.webkitRelativePath)
+  // ... UI properties (id, status, progress, etc.)
 }
 ```
 
-**Important**: The drop hook preserves folder structure via `webkitRelativePath` and processes paths with `stripCommonPrefix` automatically. The `path` property is always deployment-ready.
+**Important**: Drop automatically sets `webkitRelativePath` on each File to preserve folder structure. Ship SDK reads this property during deployment, so paths are handled correctly.
 
 ## Architecture Decisions
 
@@ -599,19 +600,19 @@ This is the same pattern used by popular libraries like `react-dropzone`, `downs
 **3. Loosely Coupled Integration**
 Following industry standards (Firebase hooks, Supabase utilities), we chose:
 - ✅ **Ship instance as dependency**: Validates using `ship.getConfig()`
-- ✅ **Simple output**: ProcessedFile[] can be passed directly to Ship SDK
+- ✅ **Simple output**: Extract `.file` from ProcessedFile[] for Ship SDK
 - ✅ **Testable**: Easy to mock Ship SDK for testing
 - ✅ **Flexible**: Host app controls WHEN to deploy
 
 **4. Type System Integration**
 
-ProcessedFile extends StaticFile from `@shipstatic/types` - the single source of truth for Ship SDK types:
+ProcessedFile wraps File objects with UI-specific metadata:
 
 ```
-File[] → ProcessedFile[] (which IS StaticFile[]) → ship.deployments.create()
+File[] → ProcessedFile[] → .map(f => f.file) → ship.deployments.create()
 ```
 
-No conversion needed. ProcessedFile adds UI-specific properties (id, name, status, progress) to StaticFile's base properties (content, path, size, md5).
+ProcessedFile adds UI properties (id, name, status, progress) while preserving the original File object. The `.file` property gives you direct access for Ship SDK deployment.
 
 **5. No Visual Components**
 

package/dist/index.cjs

@@ -2,7 +2,6 @@
 
 var react = require('react');
 var ship = require('@shipstatic/ship');
-var types = require('@shipstatic/types');
 
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -11703,6 +11702,42 @@ var require_mime_db = __commonJS({
   }
 });
 
+// node_modules/.pnpm/@shipstatic+types@0.3.18/node_modules/@shipstatic/types/dist/index.js
+var ErrorType;
+(function(ErrorType2) {
+  ErrorType2["Validation"] = "validation_failed";
+  ErrorType2["NotFound"] = "not_found";
+  ErrorType2["RateLimit"] = "rate_limit_exceeded";
+  ErrorType2["Authentication"] = "authentication_failed";
+  ErrorType2["Business"] = "business_logic_error";
+  ErrorType2["Api"] = "internal_server_error";
+  ErrorType2["Network"] = "network_error";
+  ErrorType2["Cancelled"] = "operation_cancelled";
+  ErrorType2["File"] = "file_error";
+  ErrorType2["Config"] = "config_error";
+})(ErrorType || (ErrorType = {}));
+({
+  client: /* @__PURE__ */ new Set([ErrorType.Business, ErrorType.Config, ErrorType.File, ErrorType.Validation]),
+  network: /* @__PURE__ */ new Set([ErrorType.Network]),
+  auth: /* @__PURE__ */ new Set([ErrorType.Authentication])
+});
+var FileValidationStatus = {
+  PENDING: "pending",
+  PROCESSING_ERROR: "processing_error",
+  EMPTY_FILE: "empty_file",
+  VALIDATION_FAILED: "validation_failed",
+  READY: "ready"
+};
+
+// src/types.ts
+var FILE_STATUSES = {
+  ...FileValidationStatus,
+  PROCESSING: "processing",
+  UPLOADING: "uploading",
+  COMPLETE: "complete",
+  ERROR: "error"
+};
+
 // src/utils/zipExtractor.ts
 var import_jszip = __toESM(require_jszip_min());
 
@@ -11778,15 +11813,6 @@ function normalizePath(path) {
 function isZipFile(file) {
   return file.type === "application/zip" || file.type === "application/x-zip-compressed" || file.name.toLowerCase().endsWith(".zip");
 }
-var FILE_STATUSES = {
-  ...types.FileValidationStatus,
-  PROCESSING: "processing",
-  UPLOADING: "uploading",
-  COMPLETE: "complete",
-  ERROR: "error"
-};
-
-// src/utils/fileProcessing.ts
 var formatFileSize = ship.formatFileSize;
 async function createProcessedFile(file, options) {
   const webkitPath = file.webkitRelativePath || "";
@@ -12028,7 +12054,17 @@ function useDrop(options) {
     e.preventDefault();
     setState((prev) => {
       if (prev.value !== "dragging") return prev;
-      const nextValue = prev.files.length > 0 ? prev.status?.title === "Ready" ? "ready" : "error" : "idle";
+      if (prev.files.length === 0) {
+        return { ...prev, value: "idle" };
+      }
+      const errorStatuses = [
+        FILE_STATUSES.VALIDATION_FAILED,
+        FILE_STATUSES.PROCESSING_ERROR,
+        FILE_STATUSES.EMPTY_FILE,
+        FILE_STATUSES.ERROR
+      ];
+      const hasErrors = prev.files.some((f) => errorStatuses.includes(f.status));
+      const nextValue = hasErrors ? "error" : "ready";
       return { ...prev, value: nextValue };
     });
   }, []);