@uploadista/react 0.0.20-beta.2 → 0.0.20-beta.3
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.
- package/dist/components/index.d.mts +3 -3
- package/dist/components/index.mjs +1 -1
- package/dist/flow-upload-list-SbpCaxRq.mjs +2 -0
- package/dist/flow-upload-list-SbpCaxRq.mjs.map +1 -0
- package/dist/hooks/index.d.mts +3 -3
- package/dist/hooks/index.mjs +1 -1
- package/dist/index.d.mts +6 -6
- package/dist/index.mjs +1 -1
- package/dist/{uploadista-provider-D-N-eL2l.d.mts → uploadista-provider-C1l0iBc9.d.mts} +512 -318
- package/dist/uploadista-provider-C1l0iBc9.d.mts.map +1 -0
- package/dist/use-upload-BvvGROMR.mjs +2 -0
- package/dist/use-upload-BvvGROMR.mjs.map +1 -0
- package/dist/{use-uploadista-client-m9nF-irM.d.mts → use-uploadista-client-DHbLSpIb.d.mts} +120 -286
- package/dist/use-uploadista-client-DHbLSpIb.d.mts.map +1 -0
- package/dist/use-uploadista-events-BwUD-2Ck.mjs +2 -0
- package/dist/use-uploadista-events-BwUD-2Ck.mjs.map +1 -0
- package/dist/{use-upload-metrics-DhzS4lhG.d.mts → use-uploadista-events-CtDXJYrR.d.mts} +169 -371
- package/dist/use-uploadista-events-CtDXJYrR.d.mts.map +1 -0
- package/package.json +6 -6
- package/src/components/flow-primitives.tsx +839 -0
- package/src/components/index.tsx +31 -13
- package/src/hooks/index.ts +25 -37
- package/src/index.ts +90 -81
- package/dist/upload-zone-BjWHuP7p.mjs +0 -6
- package/dist/upload-zone-BjWHuP7p.mjs.map +0 -1
- package/dist/uploadista-provider-D-N-eL2l.d.mts.map +0 -1
- package/dist/use-upload-BDHVhQsI.mjs +0 -2
- package/dist/use-upload-BDHVhQsI.mjs.map +0 -1
- package/dist/use-upload-metrics-Df90wIos.mjs +0 -2
- package/dist/use-upload-metrics-Df90wIos.mjs.map +0 -1
- package/dist/use-upload-metrics-DhzS4lhG.d.mts.map +0 -1
- package/dist/use-uploadista-client-m9nF-irM.d.mts.map +0 -1
- package/src/components/flow-input.tsx +0 -299
- package/src/components/flow-upload-zone.tsx +0 -441
- package/src/hooks/use-flow-execution.ts +0 -502
- package/src/hooks/use-flow-upload.ts +0 -299
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import "../use-uploadista-client-
|
|
2
|
-
import { C as
|
|
3
|
-
export {
|
|
1
|
+
import "../use-uploadista-client-DHbLSpIb.mjs";
|
|
2
|
+
import { A as FlowInputPreviewProps, B as FlowStatusProps, C as FlowDropZoneProps, D as FlowInputContextValue, E as FlowErrorRenderProps, F as FlowInputsRenderProps, H as FlowSubmitProps, I as FlowProgressProps, L as FlowProgressRenderProps, M as FlowInputProps, N as FlowInputUrlFieldProps, O as FlowInputDropZoneProps, P as FlowInputsProps, R as FlowProps, S as FlowContextValue, T as FlowErrorProps, U as useFlowContext, V as FlowStatusRenderProps, W as useFlowInputContext, _ as SimpleFlowUploadListItem, a as UploadZone, b as Flow, c as SimpleUploadListItem, d as UploadListProps, f as UploadListRenderProps, g as SimpleFlowUploadList, h as FlowUploadListRenderProps, i as SimpleUploadZoneProps, j as FlowInputPreviewRenderProps, k as FlowInputDropZoneRenderProps, l as SimpleUploadListItemProps, m as FlowUploadListProps, n as useUploadistaContext, o as UploadZoneProps, p as FlowUploadList, r as SimpleUploadZone, s as UploadZoneRenderProps, t as UploadistaProvider, u as UploadList, v as SimpleFlowUploadListItemProps, w as FlowDropZoneRenderProps, x as FlowCancelProps, y as SimpleFlowUploadListProps, z as FlowResetProps } from "../uploadista-provider-C1l0iBc9.mjs";
|
|
3
|
+
export { Flow, type FlowCancelProps, type FlowContextValue, type FlowDropZoneProps, type FlowDropZoneRenderProps, type FlowErrorProps, type FlowErrorRenderProps, type FlowInputContextValue, type FlowInputDropZoneProps, type FlowInputDropZoneRenderProps, type FlowInputPreviewProps, type FlowInputPreviewRenderProps, type FlowInputProps, type FlowInputUrlFieldProps, type FlowInputsProps, type FlowInputsRenderProps, type FlowProgressProps, type FlowProgressRenderProps, type FlowProps, type FlowResetProps, type FlowStatusProps, type FlowStatusRenderProps, type FlowSubmitProps, FlowUploadList, type FlowUploadListProps, type FlowUploadListRenderProps, SimpleFlowUploadList, SimpleFlowUploadListItem, type SimpleFlowUploadListItemProps, type SimpleFlowUploadListProps, SimpleUploadListItem, type SimpleUploadListItemProps, SimpleUploadZone, type SimpleUploadZoneProps, UploadList, type UploadListProps, type UploadListRenderProps, UploadZone, type UploadZoneProps, type UploadZoneRenderProps, UploadistaProvider, useFlowContext, useFlowInputContext, useUploadistaContext };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{a as e,o as t}from"../use-upload-BvvGROMR.mjs";import{a as n,c as r,i,l as a,n as o,o as s,r as c,s as l,t as u,u as d}from"../flow-upload-list-SbpCaxRq.mjs";export{r as Flow,u as FlowUploadList,o as SimpleFlowUploadList,c as SimpleFlowUploadListItem,s as SimpleUploadListItem,i as SimpleUploadZone,l as UploadList,n as UploadZone,e as UploadistaProvider,a as useFlowContext,d as useFlowInputContext,t as useUploadistaContext};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{i as e,n as t,r as n,t as r,u as i}from"./use-upload-BvvGROMR.mjs";import{createContext as a,useCallback as o,useContext as s}from"react";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";const d=a(null);function f(){let e=s(d);if(!e)throw Error(`useFlowContext must be used within a <Flow> component. Wrap your component tree with <Flow flowId="..." storageId="...">`);return e}const p=a(null);function m(){let e=s(p);if(!e)throw Error(`useFlowInputContext must be used within a <Flow.Input> component. Wrap your component with <Flow.Input nodeId="...">`);return e}function h({flowId:t,storageId:n,outputNodeId:r,onSuccess:i,onError:a,onProgress:o,onFlowComplete:s,onAbort:c,children:u}){let f=e({flowConfig:{flowId:t,storageId:n,outputNodeId:r},onSuccess:i,onError:a,onProgress:o,onFlowComplete:s,onAbort:c}),p={state:f.state,inputMetadata:f.inputMetadata,inputs:f.inputs,inputStates:f.inputStates,setInput:f.setInput,execute:f.execute,upload:f.upload,abort:f.abort,pause:f.pause,reset:f.reset,isUploading:f.isUploading,isUploadingFile:f.isUploadingFile,isProcessing:f.isProcessing,isDiscoveringInputs:f.isDiscoveringInputs};return l(d.Provider,{value:p,children:u})}function g({accept:e,maxFileSize:t,children:n}){let r=f(),a=i({onFilesReceived:e=>{let t=e[0];t&&r.upload(t)},accept:e?e.split(`,`).map(e=>e.trim()):void 0,maxFileSize:t,multiple:!1});return l(c,{children:n({isDragging:a.state.isDragging,isOver:a.state.isOver,progress:r.state.progress,status:r.state.status,getRootProps:()=>a.dragHandlers,getInputProps:()=>a.inputProps,openFilePicker:a.openFilePicker,dragDropState:a.state})})}function _({children:e}){let t=f();return l(c,{children:e({inputs:t.inputMetadata??[],isLoading:t.isDiscoveringInputs})})}function v({nodeId:e,children:t}){let n=f(),r=n.inputMetadata?.find(t=>t.nodeId===e);if(!r)return null;let i={nodeId:e,metadata:r,value:n.inputs[e],setValue:t=>n.setInput(e,t),state:n.inputStates.get(e)};return l(p.Provider,{value:i,children:typeof t==`function`?t(i):t})}function y({accept:e,maxFileSize:t,children:n}){let r=m(),a=i({onFilesReceived:e=>{let t=e[0];t&&r.setValue(t)},accept:e?e.split(`,`).map(e=>e.trim()):void 0,maxFileSize:t,multiple:!1});return l(c,{children:n({isDragging:a.state.isDragging,isOver:a.state.isOver,value:r.value,progress:r.state?.progress??0,status:r.state?.status??`idle`,getRootProps:()=>a.dragHandlers,getInputProps:()=>a.inputProps,openFilePicker:a.openFilePicker,dragDropState:a.state})})}function b({placeholder:e=`https://example.com/file`,...t}){let n=m();return l(`input`,{type:`url`,value:typeof n.value==`string`?n.value:``,onChange:e=>n.setValue(e.target.value),placeholder:e,...t})}function x({children:e}){let t=m(),n=t.value instanceof File,r=typeof t.value==`string`&&t.value.length>0;return l(c,{children:e({value:t.value,isFile:n,isUrl:r,fileName:n?t.value.name:null,fileSize:n?t.value.size:null,clear:()=>t.setValue(void 0)})})}function S({children:e}){let t=f();return l(c,{children:e({progress:t.state.progress,bytesUploaded:t.state.bytesUploaded,totalBytes:t.state.totalBytes,status:t.state.status})})}function C({children:e}){let t=f();return l(c,{children:e({status:t.state.status,currentNodeName:t.state.currentNodeName,currentNodeType:t.state.currentNodeType,error:t.state.error,jobId:t.state.jobId,flowStarted:t.state.flowStarted,flowOutputs:t.state.flowOutputs})})}function w({children:e}){let t=f();return l(c,{children:e({error:t.state.error,hasError:t.state.status===`error`,message:t.state.error?.message??null,reset:t.reset})})}function T({children:e,disabled:t,...n}){let r=f();return l(`button`,{type:`button`,onClick:o(()=>{r.execute()},[r]),disabled:t||r.isUploading,...n,children:e})}function E({children:e,...t}){let n=f();return l(`button`,{type:`button`,onClick:o(()=>{n.abort()},[n]),...t,children:e})}function D({children:e,...t}){let n=f();return l(`button`,{type:`button`,onClick:o(()=>{n.reset()},[n]),...t,children:e})}const O=Object.assign(h,{DropZone:g,Inputs:_,Input:Object.assign(v,{DropZone:y,UrlField:b,Preview:x}),Progress:S,Status:C,Error:w,Submit:T,Cancel:E,Reset:D});function k({multiUpload:e,filter:t,sortBy:n,children:r}){let i=e.items;t&&(i=i.filter(t)),n&&(i=[...i].sort(n));let a={idle:i.filter(e=>e.state.status===`idle`),uploading:i.filter(e=>e.state.status===`uploading`),success:i.filter(e=>e.state.status===`success`),error:i.filter(e=>e.state.status===`error`),aborted:i.filter(e=>e.state.status===`aborted`)};return l(c,{children:r({items:i,itemsByStatus:a,multiUpload:e,actions:{removeItem:t=>{e.removeItem(t)},retryItem:t=>{e.retryFailed()},abortItem:t=>{e.removeItem(t.id)},startItem:t=>{e.startAll()}}})})}function A({item:e,actions:t,className:n=``,style:r={},showDetails:i=!0}){let a=e=>{switch(e){case`idle`:return`#6c757d`;case`uploading`:return`#007bff`;case`success`:return`#28a745`;case`error`:return`#dc3545`;case`aborted`:return`#6c757d`;default:return`#6c757d`}},o=e=>{switch(e){case`idle`:return`⏳`;case`uploading`:return`📤`;case`success`:return`✅`;case`error`:return`❌`;case`aborted`:return`⏹️`;default:return`❓`}},s=e=>{if(e===0)return`0 Bytes`;let t=1024,n=[`Bytes`,`KB`,`MB`,`GB`],r=Math.floor(Math.log(e)/Math.log(t));return`${parseFloat((e/t**r).toFixed(2))} ${n[r]}`};return u(`div`,{className:`upload-list-item upload-list-item--${e.state.status} ${n}`,style:{padding:`12px`,border:`1px solid #e0e0e0`,borderRadius:`6px`,marginBottom:`8px`,backgroundColor:`#fff`,transition:`all 0.2s ease`,...r},children:[u(`div`,{style:{display:`flex`,justifyContent:`space-between`,alignItems:`center`,marginBottom:`8px`},children:[u(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`,flex:1},children:[l(`span`,{style:{fontSize:`16px`},children:o(e.state.status)}),l(`span`,{style:{fontWeight:`500`,flex:1},children:e.file instanceof File?e.file.name:`File`})]}),l(`span`,{style:{fontSize:`12px`,color:a(e.state.status),fontWeight:`500`,textTransform:`uppercase`},children:e.state.status})]}),e.state.status===`uploading`&&u(`div`,{style:{marginBottom:`8px`},children:[u(`div`,{style:{display:`flex`,justifyContent:`space-between`,alignItems:`center`,marginBottom:`4px`},children:[u(`span`,{style:{fontSize:`12px`,color:`#666`},children:[e.state.progress,`%`]}),i&&e.state.totalBytes&&u(`span`,{style:{fontSize:`12px`,color:`#666`},children:[s(e.state.bytesUploaded),` /`,` `,s(e.state.totalBytes)]})]}),l(`div`,{style:{width:`100%`,height:`6px`,backgroundColor:`#e0e0e0`,borderRadius:`3px`,overflow:`hidden`},children:l(`div`,{style:{width:`${e.state.progress}%`,height:`100%`,backgroundColor:`#007bff`,transition:`width 0.2s ease`}})})]}),i&&u(`div`,{style:{fontSize:`12px`,color:`#666`,marginBottom:`8px`},children:[e.state.totalBytes&&l(`span`,{children:s(e.state.totalBytes)}),e.state.status===`uploading`&&e.state.progress>0&&u(`span`,{children:[` • Progress: `,e.state.progress,`%`]}),e.state.status===`error`&&e.state.error&&l(`div`,{style:{color:`#dc3545`,marginTop:`4px`},children:e.state.error.message})]}),u(`div`,{style:{display:`flex`,gap:`8px`,flexWrap:`wrap`},children:[e.state.status===`idle`&&u(c,{children:[l(`button`,{type:`button`,onClick:()=>t.startItem(e),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #007bff`,backgroundColor:`#007bff`,color:`white`,borderRadius:`4px`,cursor:`pointer`},children:`Start`}),l(`button`,{type:`button`,onClick:()=>t.removeItem(e.id),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #6c757d`,backgroundColor:`transparent`,color:`#6c757d`,borderRadius:`4px`,cursor:`pointer`},children:`Remove`})]}),e.state.status===`uploading`&&l(`button`,{type:`button`,onClick:()=>t.abortItem(e),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #dc3545`,backgroundColor:`transparent`,color:`#dc3545`,borderRadius:`4px`,cursor:`pointer`},children:`Cancel`}),e.state.status===`error`&&u(c,{children:[l(`button`,{type:`button`,onClick:()=>t.retryItem(e),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #28a745`,backgroundColor:`#28a745`,color:`white`,borderRadius:`4px`,cursor:`pointer`},children:`Retry`}),l(`button`,{type:`button`,onClick:()=>t.removeItem(e.id),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #6c757d`,backgroundColor:`transparent`,color:`#6c757d`,borderRadius:`4px`,cursor:`pointer`},children:`Remove`})]}),e.state.status===`success`&&l(`button`,{type:`button`,onClick:()=>t.removeItem(e.id),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #6c757d`,backgroundColor:`transparent`,color:`#6c757d`,borderRadius:`4px`,cursor:`pointer`},children:`Remove`}),e.state.status===`aborted`&&u(c,{children:[l(`button`,{type:`button`,onClick:()=>t.retryItem(e),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #007bff`,backgroundColor:`#007bff`,color:`white`,borderRadius:`4px`,cursor:`pointer`},children:`Retry`}),l(`button`,{type:`button`,onClick:()=>t.removeItem(e.id),style:{padding:`4px 8px`,fontSize:`12px`,border:`1px solid #6c757d`,backgroundColor:`transparent`,color:`#6c757d`,borderRadius:`4px`,cursor:`pointer`},children:`Remove`})]})]})]})}function j({children:e,multiple:n=!0,multiUploadOptions:a={},uploadOptions:s={},onUploadStart:u,onValidationError:d,...f}){let p=r(s),m=t(a),h=o(e=>{let t=[];if(!n&&e.length>1&&t.push(`Single file mode is enabled. Please select only one file. You selected ${e.length} files.`),f.accept&&f.accept.length>0){let n=e.filter(e=>!f.accept?.some(t=>{if(t.startsWith(`.`))return e.name.toLowerCase().endsWith(t.toLowerCase());if(t.endsWith(`/*`)){let n=t.slice(0,-2);return e.type.startsWith(n)}else return e.type===t}));if(n.length>0){let e=n.map(e=>`"${e.name}" (${e.type})`).join(`, `),r=f.accept.join(`, `);t.push(`Invalid file type(s): ${e}. Accepted types: ${r}.`)}}return t.length>0?t:null},[n,f.accept]),g=e=>{u?.(e),n&&m?(m.addFiles(e),setTimeout(()=>m.startAll(),0)):!n&&p&&e.length>0&&e[0]&&p.upload(e[0])},_=o(e=>{console.error(`Upload zone validation errors:`,e),d?.(e)},[d]),v=i({...f,multiple:n,validator:h,onFilesReceived:g,onValidationError:_}),y=v.state.isDragging||v.state.isOver,b=n?m?.state.isUploading??!1:p?.isUploading??!1;return l(c,{children:e({dragDrop:v,upload:p,multiUpload:m,openFilePicker:v.openFilePicker,isActive:y,isProcessing:b})})}function M({className:e=``,style:t={},text:n={},errorStyle:r={},children:i,...a}){let o={idle:a.multiple?`Drag files here or click to select`:`Drag a file here or click to select`,dragging:a.multiple?`Drop files here...`:`Drop file here...`,uploading:`Uploading...`,...n};return i?l(j,{...a,children:i}):l(j,{...a,children:({dragDrop:n,upload:i,multiUpload:a,openFilePicker:s,isActive:c,isProcessing:d})=>u(`button`,{type:`button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&s()},onKeyUp:e=>{(e.key===`Enter`||e.key===` `)&&s()},...n.dragHandlers,onClick:s,className:`upload-zone ${c?`upload-zone--active`:``} ${d?`upload-zone--processing`:``} ${e}`,style:{border:c?`2px dashed #007bff`:`2px dashed #ccc`,borderRadius:`8px`,padding:`2rem`,textAlign:`center`,cursor:`pointer`,backgroundColor:c?`#f8f9fa`:`transparent`,transition:`all 0.2s ease`,minHeight:`120px`,display:`flex`,flexDirection:`column`,alignItems:`center`,justifyContent:`center`,...t},children:[n.state.isDragging?l(`p`,{style:{margin:0,fontSize:`16px`,color:`#007bff`},children:o.dragging}):d?u(`div`,{style:{textAlign:`center`},children:[l(`p`,{style:{margin:`0 0 10px 0`,fontSize:`14px`},children:o.uploading}),i&&u(`div`,{children:[l(`progress`,{value:i.state.progress,max:100,style:{width:`200px`,height:`8px`}}),u(`p`,{style:{margin:`5px 0 0 0`,fontSize:`12px`,color:`#666`},children:[i.state.progress,`%`]})]}),a&&u(`div`,{children:[l(`progress`,{value:a.state.progress,max:100,style:{width:`200px`,height:`8px`}}),u(`p`,{style:{margin:`5px 0 0 0`,fontSize:`12px`,color:`#666`},children:[a.state.progress,`% (`,a.state.uploading,` `,`uploading, `,a.state.successful,` completed)`]})]})]}):l(`p`,{style:{margin:0,fontSize:`16px`,color:`#666`},children:o.idle}),n.state.errors.length>0&&u(`div`,{style:{marginTop:`10px`,padding:`8px 12px`,backgroundColor:`#f8d7da`,border:`1px solid #f5c6cb`,borderRadius:`4px`,maxWidth:`100%`,...r},children:[l(`p`,{style:{margin:`0 0 5px 0`,fontSize:`12px`,fontWeight:`bold`,color:`#721c24`},children:`Validation Errors:`}),n.state.errors.map((e,t)=>u(`p`,{style:{color:`#721c24`,fontSize:`11px`,margin:`2px 0`,lineHeight:`1.3`},children:[`• `,e]},t))]}),l(`input`,{...n.inputProps})]})})}function N({flowConfig:e,options:t,children:r}){let i=n({...t,flowConfig:e});return l(c,{children:r({items:i.state.items,totalProgress:i.state.totalProgress,activeUploads:i.state.activeUploads,completedUploads:i.state.completedUploads,failedUploads:i.state.failedUploads,isUploading:i.isUploading,addFiles:i.addFiles,removeFile:i.removeFile,startUpload:i.startUpload,abortUpload:i.abortUpload,abortAll:i.abortAll,clear:i.clear,retryUpload:i.retryUpload})})}function P({item:e,onAbort:t,onRetry:n,onRemove:r}){return u(`div`,{style:{display:`flex`,alignItems:`center`,gap:`12px`,padding:`8px`,borderBottom:`1px solid #eee`},children:[l(`span`,{style:{color:(()=>{switch(e.status){case`success`:return`green`;case`error`:return`red`;case`uploading`:return`blue`;case`aborted`:return`gray`;default:return`black`}})(),fontSize:`18px`},children:(()=>{switch(e.status){case`success`:return`✓`;case`error`:return`✗`;case`uploading`:return`⟳`;case`aborted`:return`⊘`;default:return`○`}})()}),u(`div`,{style:{flex:1,minWidth:0},children:[l(`div`,{style:{fontSize:`14px`,fontWeight:500,overflow:`hidden`,textOverflow:`ellipsis`,whiteSpace:`nowrap`},children:e.file instanceof File?e.file.name:`Upload`}),e.status===`uploading`&&u(`div`,{style:{marginTop:`4px`},children:[l(`progress`,{value:e.progress,max:100,style:{width:`100%`,height:`4px`}}),u(`div`,{style:{fontSize:`12px`,color:`#666`,marginTop:`2px`},children:[e.progress,`% • `,Math.round(e.bytesUploaded/1024),` KB /`,` `,Math.round(e.totalBytes/1024),` KB`]})]}),e.status===`error`&&l(`div`,{style:{fontSize:`12px`,color:`red`,marginTop:`2px`},children:e.error?.message||`Upload failed`}),e.status===`success`&&l(`div`,{style:{fontSize:`12px`,color:`green`,marginTop:`2px`},children:`Upload complete`})]}),u(`div`,{style:{display:`flex`,gap:`8px`},children:[e.status===`uploading`&&l(`button`,{type:`button`,onClick:t,style:{padding:`4px 8px`,fontSize:`12px`,borderRadius:`4px`,border:`1px solid #ccc`,backgroundColor:`#fff`,cursor:`pointer`},children:`Cancel`}),e.status===`error`&&l(`button`,{type:`button`,onClick:n,style:{padding:`4px 8px`,fontSize:`12px`,borderRadius:`4px`,border:`1px solid #ccc`,backgroundColor:`#fff`,cursor:`pointer`},children:`Retry`}),(e.status===`pending`||e.status===`error`||e.status===`aborted`)&&l(`button`,{type:`button`,onClick:r,style:{padding:`4px 8px`,fontSize:`12px`,borderRadius:`4px`,border:`1px solid #ccc`,backgroundColor:`#fff`,cursor:`pointer`},children:`Remove`})]})]})}function F({flowConfig:e,options:t,className:n=``,showFileInput:r=!0,accept:i}){return l(N,{flowConfig:e,options:t,children:({items:e,addFiles:t,startUpload:a,abortUpload:o,retryUpload:s,removeFile:c,totalProgress:d})=>u(`div`,{className:n,children:[r&&l(`div`,{style:{marginBottom:`16px`},children:l(`input`,{type:`file`,multiple:!0,accept:i,onChange:e=>{e.target.files&&(t(e.target.files),a())},style:{padding:`8px`,border:`1px solid #ccc`,borderRadius:`4px`}})}),e.length>0&&u(`div`,{children:[u(`div`,{style:{marginBottom:`8px`,fontSize:`14px`,color:`#666`},children:[`Total Progress: `,d,`%`]}),l(`div`,{style:{border:`1px solid #eee`,borderRadius:`8px`,overflow:`hidden`},children:e.map(e=>l(P,{item:e,onAbort:()=>o(e.id),onRetry:()=>s(e.id),onRemove:()=>c(e.id)},e.id))})]})]})})}export{j as a,O as c,M as i,f as l,F as n,A as o,P as r,k as s,N as t,m as u};
|
|
2
|
+
//# sourceMappingURL=flow-upload-list-SbpCaxRq.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"flow-upload-list-SbpCaxRq.mjs","names":["contextValue: FlowContextValue","contextValue: FlowInputContextValue","errors: string[]"],"sources":["../src/components/flow-primitives.tsx","../src/components/upload-list.tsx","../src/components/upload-zone.tsx","../src/components/flow-upload-list.tsx"],"sourcesContent":["\"use client\";\n\nimport type { FlowUploadOptions } from \"@uploadista/client-browser\";\nimport type {\n FlowUploadState,\n FlowUploadStatus,\n InputExecutionState,\n} from \"@uploadista/client-core\";\nimport type { TypedOutput } from \"@uploadista/core/flow\";\nimport {\n type ReactNode,\n createContext,\n useCallback,\n useContext,\n} from \"react\";\nimport {\n type DragDropState,\n type UseDragDropReturn,\n useDragDrop,\n} from \"../hooks/use-drag-drop\";\nimport { type FlowInputMetadata, useFlow } from \"../hooks/use-flow\";\n\n// Re-export types for convenience\nexport type {\n FlowUploadState,\n FlowUploadStatus,\n InputExecutionState,\n FlowInputMetadata,\n};\n\n// ============ FLOW CONTEXT ============\n\n/**\n * Context value provided by the Flow component root.\n * Contains all flow state and actions.\n */\nexport interface FlowContextValue {\n /** Current upload state */\n state: FlowUploadState;\n /** Discovered input nodes metadata (null until discovery completes) */\n inputMetadata: FlowInputMetadata[] | null;\n /** Current input values set via setInput() */\n inputs: Record<string, unknown>;\n /** Per-input execution state for multi-input flows */\n inputStates: ReadonlyMap<string, InputExecutionState>;\n\n /** Set an input value for a specific node */\n setInput: (nodeId: string, value: unknown) => void;\n /** Execute the flow with current inputs */\n execute: () => Promise<void>;\n /** Upload a single file through the flow */\n upload: (file: File | Blob) => Promise<void>;\n /** Abort the current upload */\n abort: () => void;\n /** Pause the current upload */\n pause: () => void;\n /** Reset the upload state and clear all inputs */\n reset: () => void;\n\n /** Whether an upload or flow execution is in progress */\n isUploading: boolean;\n /** Whether the file is currently being uploaded */\n isUploadingFile: boolean;\n /** Whether the flow is currently processing */\n isProcessing: boolean;\n /** Whether the hook is discovering flow inputs */\n isDiscoveringInputs: boolean;\n}\n\nconst FlowContext = createContext<FlowContextValue | null>(null);\n\n/**\n * Hook to access flow context from within a Flow component.\n * @throws Error if used outside of a Flow component\n */\nexport function useFlowContext(): FlowContextValue {\n const context = useContext(FlowContext);\n if (!context) {\n throw new Error(\n \"useFlowContext must be used within a <Flow> component. \" +\n \"Wrap your component tree with <Flow flowId=\\\"...\\\" storageId=\\\"...\\\">\",\n );\n }\n return context;\n}\n\n// ============ FLOW INPUT CONTEXT ============\n\n/**\n * Context value for a specific input node within a Flow.\n */\nexport interface FlowInputContextValue {\n /** Input node ID */\n nodeId: string;\n /** Input metadata from flow discovery */\n metadata: FlowInputMetadata;\n /** Current value for this input */\n value: unknown;\n /** Set the value for this input */\n setValue: (value: unknown) => void;\n /** Per-input execution state (if available) */\n state: InputExecutionState | undefined;\n}\n\nconst FlowInputContext = createContext<FlowInputContextValue | null>(null);\n\n/**\n * Hook to access flow input context from within a Flow.Input component.\n * @throws Error if used outside of a Flow.Input component\n */\nexport function useFlowInputContext(): FlowInputContextValue {\n const context = useContext(FlowInputContext);\n if (!context) {\n throw new Error(\n \"useFlowInputContext must be used within a <Flow.Input> component. \" +\n \"Wrap your component with <Flow.Input nodeId=\\\"...\\\">\",\n );\n }\n return context;\n}\n\n// ============ FLOW ROOT COMPONENT ============\n\n/**\n * Props for the Flow root component.\n */\nexport interface FlowProps {\n /** Flow ID to execute */\n flowId: string;\n /** Storage ID for file uploads */\n storageId: string;\n /** Optional output node ID to wait for */\n outputNodeId?: string;\n /** Called when flow completes successfully */\n onSuccess?: (outputs: TypedOutput[]) => void;\n /** Called when flow fails */\n onError?: (error: Error) => void;\n /** Called on upload progress */\n onProgress?: (\n uploadId: string,\n bytesUploaded: number,\n totalBytes: number | null,\n ) => void;\n /** Called when flow completes with all outputs */\n onFlowComplete?: (outputs: TypedOutput[]) => void;\n /** Called when upload is aborted */\n onAbort?: () => void;\n /** Children to render */\n children: ReactNode;\n}\n\n/**\n * Root component for flow-based uploads.\n * Provides context for all Flow sub-components.\n *\n * @example\n * ```tsx\n * <Flow flowId=\"image-optimizer\" storageId=\"s3\" onSuccess={handleSuccess}>\n * <Flow.DropZone accept=\"image/*\">\n * {({ isDragging, getRootProps, getInputProps }) => (\n * <div {...getRootProps()}>\n * <input {...getInputProps()} />\n * {isDragging ? \"Drop here\" : \"Drag or click\"}\n * </div>\n * )}\n * </Flow.DropZone>\n * </Flow>\n * ```\n */\nfunction FlowRoot({\n flowId,\n storageId,\n outputNodeId,\n onSuccess,\n onError,\n onProgress,\n onFlowComplete,\n onAbort,\n children,\n}: FlowProps) {\n const options: FlowUploadOptions = {\n flowConfig: {\n flowId,\n storageId,\n outputNodeId,\n },\n onSuccess,\n onError,\n onProgress,\n onFlowComplete,\n onAbort,\n };\n\n const flow = useFlow(options);\n\n const contextValue: FlowContextValue = {\n state: flow.state,\n inputMetadata: flow.inputMetadata,\n inputs: flow.inputs,\n inputStates: flow.inputStates,\n setInput: flow.setInput,\n execute: flow.execute,\n upload: flow.upload,\n abort: flow.abort,\n pause: flow.pause,\n reset: flow.reset,\n isUploading: flow.isUploading,\n isUploadingFile: flow.isUploadingFile,\n isProcessing: flow.isProcessing,\n isDiscoveringInputs: flow.isDiscoveringInputs,\n };\n\n return (\n <FlowContext.Provider value={contextValue}>{children}</FlowContext.Provider>\n );\n}\n\n// ============ DROP ZONE PRIMITIVE ============\n\n/**\n * Render props for Flow.DropZone component.\n */\nexport interface FlowDropZoneRenderProps {\n /** Whether files are being dragged over */\n isDragging: boolean;\n /** Whether drag is over the zone */\n isOver: boolean;\n /** Upload progress (0-100) */\n progress: number;\n /** Current flow status */\n status: FlowUploadStatus;\n /** Props to spread on the drop zone container */\n getRootProps: () => UseDragDropReturn[\"dragHandlers\"];\n /** Props to spread on the hidden file input */\n getInputProps: () => UseDragDropReturn[\"inputProps\"];\n /** Open file picker programmatically */\n openFilePicker: () => void;\n /** Current drag-drop state */\n dragDropState: DragDropState;\n}\n\n/**\n * Props for Flow.DropZone component.\n */\nexport interface FlowDropZoneProps {\n /** Accepted file types (e.g., \"image/*\", \".pdf\") */\n accept?: string;\n /** Maximum file size in bytes */\n maxFileSize?: number;\n /** Render function receiving drop zone state */\n children: (props: FlowDropZoneRenderProps) => ReactNode;\n}\n\n/**\n * Drop zone for single-file uploads within a Flow.\n * Automatically calls flow.upload() when a file is dropped.\n *\n * @example\n * ```tsx\n * <Flow.DropZone accept=\"image/*\">\n * {({ isDragging, progress, getRootProps, getInputProps }) => (\n * <div {...getRootProps()}>\n * <input {...getInputProps()} />\n * {isDragging ? \"Drop here\" : `Progress: ${progress}%`}\n * </div>\n * )}\n * </Flow.DropZone>\n * ```\n */\nfunction FlowDropZone({ accept, maxFileSize, children }: FlowDropZoneProps) {\n const flow = useFlowContext();\n\n const dragDrop = useDragDrop({\n onFilesReceived: (files) => {\n const file = files[0];\n if (file) {\n flow.upload(file);\n }\n },\n accept: accept ? accept.split(\",\").map((t) => t.trim()) : undefined,\n maxFileSize,\n multiple: false,\n });\n\n const renderProps: FlowDropZoneRenderProps = {\n isDragging: dragDrop.state.isDragging,\n isOver: dragDrop.state.isOver,\n progress: flow.state.progress,\n status: flow.state.status,\n getRootProps: () => dragDrop.dragHandlers,\n getInputProps: () => dragDrop.inputProps,\n openFilePicker: dragDrop.openFilePicker,\n dragDropState: dragDrop.state,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ INPUTS DISCOVERY PRIMITIVE ============\n\n/**\n * Render props for Flow.Inputs component.\n */\nexport interface FlowInputsRenderProps {\n /** Discovered input metadata */\n inputs: FlowInputMetadata[];\n /** Whether inputs are still being discovered */\n isLoading: boolean;\n}\n\n/**\n * Props for Flow.Inputs component.\n */\nexport interface FlowInputsProps {\n /** Render function receiving discovered inputs */\n children: (props: FlowInputsRenderProps) => ReactNode;\n}\n\n/**\n * Auto-discovers flow input nodes and provides them via render props.\n *\n * @example\n * ```tsx\n * <Flow.Inputs>\n * {({ inputs, isLoading }) => (\n * isLoading ? <Spinner /> : (\n * inputs.map(input => (\n * <Flow.Input key={input.nodeId} nodeId={input.nodeId}>\n * ...\n * </Flow.Input>\n * ))\n * )\n * )}\n * </Flow.Inputs>\n * ```\n */\nfunction FlowInputs({ children }: FlowInputsProps) {\n const flow = useFlowContext();\n\n const renderProps: FlowInputsRenderProps = {\n inputs: flow.inputMetadata ?? [],\n isLoading: flow.isDiscoveringInputs,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ INPUT PRIMITIVE ============\n\n/**\n * Props for Flow.Input component.\n */\nexport interface FlowInputProps {\n /** Input node ID */\n nodeId: string;\n /** Children (can be render function or regular children) */\n children: ReactNode | ((props: FlowInputContextValue) => ReactNode);\n}\n\n/**\n * Scoped input context provider for a specific input node.\n * Children can access input-specific state via useFlowInputContext().\n *\n * @example\n * ```tsx\n * <Flow.Input nodeId=\"video-input\">\n * {({ metadata, value, setValue }) => (\n * <div>\n * <label>{metadata.nodeName}</label>\n * <Flow.Input.DropZone>...</Flow.Input.DropZone>\n * </div>\n * )}\n * </Flow.Input>\n * ```\n */\nfunction FlowInput({ nodeId, children }: FlowInputProps) {\n const flow = useFlowContext();\n\n const metadata = flow.inputMetadata?.find((m) => m.nodeId === nodeId);\n\n if (!metadata) {\n // Input not yet discovered or doesn't exist\n return null;\n }\n\n const contextValue: FlowInputContextValue = {\n nodeId,\n metadata,\n value: flow.inputs[nodeId],\n setValue: (value) => flow.setInput(nodeId, value),\n state: flow.inputStates.get(nodeId),\n };\n\n return (\n <FlowInputContext.Provider value={contextValue}>\n {typeof children === \"function\" ? children(contextValue) : children}\n </FlowInputContext.Provider>\n );\n}\n\n// ============ INPUT DROP ZONE PRIMITIVE ============\n\n/**\n * Render props for Flow.Input.DropZone component.\n */\nexport interface FlowInputDropZoneRenderProps {\n /** Whether files are being dragged over */\n isDragging: boolean;\n /** Whether drag is over the zone */\n isOver: boolean;\n /** Current value for this input */\n value: unknown;\n /** Per-input progress (if available) */\n progress: number;\n /** Per-input status (if available) */\n status: string;\n /** Props to spread on the drop zone container */\n getRootProps: () => UseDragDropReturn[\"dragHandlers\"];\n /** Props to spread on the hidden file input */\n getInputProps: () => UseDragDropReturn[\"inputProps\"];\n /** Open file picker programmatically */\n openFilePicker: () => void;\n /** Current drag-drop state */\n dragDropState: DragDropState;\n}\n\n/**\n * Props for Flow.Input.DropZone component.\n */\nexport interface FlowInputDropZoneProps {\n /** Accepted file types (e.g., \"image/*\", \".pdf\") */\n accept?: string;\n /** Maximum file size in bytes */\n maxFileSize?: number;\n /** Render function receiving drop zone state */\n children: (props: FlowInputDropZoneRenderProps) => ReactNode;\n}\n\n/**\n * Drop zone for a specific input within a Flow.Input.\n * Sets the input value but does NOT trigger upload until Flow.Submit is clicked.\n */\nfunction FlowInputDropZone({\n accept,\n maxFileSize,\n children,\n}: FlowInputDropZoneProps) {\n const input = useFlowInputContext();\n\n const dragDrop = useDragDrop({\n onFilesReceived: (files) => {\n const file = files[0];\n if (file) {\n input.setValue(file);\n }\n },\n accept: accept ? accept.split(\",\").map((t) => t.trim()) : undefined,\n maxFileSize,\n multiple: false,\n });\n\n const renderProps: FlowInputDropZoneRenderProps = {\n isDragging: dragDrop.state.isDragging,\n isOver: dragDrop.state.isOver,\n value: input.value,\n progress: input.state?.progress ?? 0,\n status: input.state?.status ?? \"idle\",\n getRootProps: () => dragDrop.dragHandlers,\n getInputProps: () => dragDrop.inputProps,\n openFilePicker: dragDrop.openFilePicker,\n dragDropState: dragDrop.state,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ INPUT URL FIELD PRIMITIVE ============\n\n/**\n * Props for Flow.Input.UrlField component.\n */\nexport interface FlowInputUrlFieldProps\n extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n \"value\" | \"onChange\" | \"type\"\n > {\n /** Placeholder text */\n placeholder?: string;\n}\n\n/**\n * URL input field for a specific input within a Flow.Input.\n * Automatically binds to the input context value.\n */\nfunction FlowInputUrlField({\n placeholder = \"https://example.com/file\",\n ...props\n}: FlowInputUrlFieldProps) {\n const input = useFlowInputContext();\n const isUrl = typeof input.value === \"string\";\n\n return (\n <input\n type=\"url\"\n value={isUrl ? (input.value as string) : \"\"}\n onChange={(e) => input.setValue(e.target.value)}\n placeholder={placeholder}\n {...props}\n />\n );\n}\n\n// ============ INPUT PREVIEW PRIMITIVE ============\n\n/**\n * Render props for Flow.Input.Preview component.\n */\nexport interface FlowInputPreviewRenderProps {\n /** Current value */\n value: unknown;\n /** Whether value is a File */\n isFile: boolean;\n /** Whether value is a URL string */\n isUrl: boolean;\n /** File name (if value is File) */\n fileName: string | null;\n /** File size in bytes (if value is File) */\n fileSize: number | null;\n /** Clear the input value */\n clear: () => void;\n}\n\n/**\n * Props for Flow.Input.Preview component.\n */\nexport interface FlowInputPreviewProps {\n /** Render function receiving preview state */\n children: (props: FlowInputPreviewRenderProps) => ReactNode;\n}\n\n/**\n * Preview component for showing the selected value within a Flow.Input.\n */\nfunction FlowInputPreview({ children }: FlowInputPreviewProps) {\n const input = useFlowInputContext();\n\n const isFile = input.value instanceof File;\n const isUrl = typeof input.value === \"string\" && input.value.length > 0;\n\n const renderProps: FlowInputPreviewRenderProps = {\n value: input.value,\n isFile,\n isUrl,\n fileName: isFile ? (input.value as File).name : null,\n fileSize: isFile ? (input.value as File).size : null,\n clear: () => input.setValue(undefined),\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ PROGRESS PRIMITIVE ============\n\n/**\n * Render props for Flow.Progress component.\n */\nexport interface FlowProgressRenderProps {\n /** Progress percentage (0-100) */\n progress: number;\n /** Bytes uploaded so far */\n bytesUploaded: number;\n /** Total bytes to upload (null if unknown) */\n totalBytes: number | null;\n /** Current status */\n status: FlowUploadStatus;\n}\n\n/**\n * Props for Flow.Progress component.\n */\nexport interface FlowProgressProps {\n /** Render function receiving progress state */\n children: (props: FlowProgressRenderProps) => ReactNode;\n}\n\n/**\n * Progress display component within a Flow.\n */\nfunction FlowProgress({ children }: FlowProgressProps) {\n const flow = useFlowContext();\n\n const renderProps: FlowProgressRenderProps = {\n progress: flow.state.progress,\n bytesUploaded: flow.state.bytesUploaded,\n totalBytes: flow.state.totalBytes,\n status: flow.state.status,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ STATUS PRIMITIVE ============\n\n/**\n * Render props for Flow.Status component.\n */\nexport interface FlowStatusRenderProps {\n /** Current status */\n status: FlowUploadStatus;\n /** Current node being processed (if any) */\n currentNodeName: string | null;\n /** Current node type (if any) */\n currentNodeType: string | null;\n /** Error (if status is error) */\n error: Error | null;\n /** Job ID (if started) */\n jobId: string | null;\n /** Whether flow has started */\n flowStarted: boolean;\n /** Flow outputs (if completed) */\n flowOutputs: TypedOutput[] | null;\n}\n\n/**\n * Props for Flow.Status component.\n */\nexport interface FlowStatusProps {\n /** Render function receiving status state */\n children: (props: FlowStatusRenderProps) => ReactNode;\n}\n\n/**\n * Status display component within a Flow.\n */\nfunction FlowStatus({ children }: FlowStatusProps) {\n const flow = useFlowContext();\n\n const renderProps: FlowStatusRenderProps = {\n status: flow.state.status,\n currentNodeName: flow.state.currentNodeName,\n currentNodeType: flow.state.currentNodeType,\n error: flow.state.error,\n jobId: flow.state.jobId,\n flowStarted: flow.state.flowStarted,\n flowOutputs: flow.state.flowOutputs,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ ERROR PRIMITIVE ============\n\n/**\n * Render props for Flow.Error component.\n */\nexport interface FlowErrorRenderProps {\n /** Error object (null if no error) */\n error: Error | null;\n /** Whether there is an error */\n hasError: boolean;\n /** Error message */\n message: string | null;\n /** Reset the flow */\n reset: () => void;\n}\n\n/**\n * Props for Flow.Error component.\n */\nexport interface FlowErrorProps {\n /** Render function receiving error state */\n children: (props: FlowErrorRenderProps) => ReactNode;\n}\n\n/**\n * Error display component within a Flow.\n */\nfunction FlowError({ children }: FlowErrorProps) {\n const flow = useFlowContext();\n\n const renderProps: FlowErrorRenderProps = {\n error: flow.state.error,\n hasError: flow.state.status === \"error\",\n message: flow.state.error?.message ?? null,\n reset: flow.reset,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n// ============ ACTION PRIMITIVES ============\n\n/**\n * Props for Flow.Submit component.\n */\nexport interface FlowSubmitProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n /** Button content */\n children: ReactNode;\n}\n\n/**\n * Submit button that executes the flow with current inputs.\n * Automatically disabled when uploading.\n */\nfunction FlowSubmit({ children, disabled, ...props }: FlowSubmitProps) {\n const flow = useFlowContext();\n\n const handleClick = useCallback(() => {\n flow.execute();\n }, [flow]);\n\n return (\n <button\n type=\"button\"\n onClick={handleClick}\n disabled={disabled || flow.isUploading}\n {...props}\n >\n {children}\n </button>\n );\n}\n\n/**\n * Props for Flow.Cancel component.\n */\nexport interface FlowCancelProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n /** Button content */\n children: ReactNode;\n}\n\n/**\n * Cancel button that aborts the current upload.\n */\nfunction FlowCancel({ children, ...props }: FlowCancelProps) {\n const flow = useFlowContext();\n\n const handleClick = useCallback(() => {\n flow.abort();\n }, [flow]);\n\n return (\n <button type=\"button\" onClick={handleClick} {...props}>\n {children}\n </button>\n );\n}\n\n/**\n * Props for Flow.Reset component.\n */\nexport interface FlowResetProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n /** Button content */\n children: ReactNode;\n}\n\n/**\n * Reset button that clears all inputs and resets to idle state.\n */\nfunction FlowReset({ children, ...props }: FlowResetProps) {\n const flow = useFlowContext();\n\n const handleClick = useCallback(() => {\n flow.reset();\n }, [flow]);\n\n return (\n <button type=\"button\" onClick={handleClick} {...props}>\n {children}\n </button>\n );\n}\n\n// ============ COMPOUND COMPONENT EXPORT ============\n\n/**\n * Flow compound component for flow-based file uploads.\n *\n * Provides a composable, headless API for building flow upload interfaces.\n * All sub-components use render props for complete UI control.\n *\n * @example Simple Drop Zone\n * ```tsx\n * <Flow flowId=\"image-optimizer\" storageId=\"s3\" onSuccess={handleSuccess}>\n * <Flow.DropZone accept=\"image/*\">\n * {({ isDragging, progress, getRootProps, getInputProps }) => (\n * <div {...getRootProps()}>\n * <input {...getInputProps()} />\n * {isDragging ? \"Drop here\" : \"Drag or click\"}\n * {progress > 0 && <progress value={progress} max={100} />}\n * </div>\n * )}\n * </Flow.DropZone>\n * </Flow>\n * ```\n *\n * @example Multi-Input Flow\n * ```tsx\n * <Flow flowId=\"video-processor\" storageId=\"s3\">\n * <Flow.Inputs>\n * {({ inputs }) => inputs.map(input => (\n * <Flow.Input key={input.nodeId} nodeId={input.nodeId}>\n * {({ metadata }) => (\n * <div>\n * <label>{metadata.nodeName}</label>\n * <Flow.Input.DropZone accept=\"video/*\">\n * {({ getRootProps, getInputProps }) => (\n * <div {...getRootProps()}>\n * <input {...getInputProps()} />\n * </div>\n * )}\n * </Flow.Input.DropZone>\n * </div>\n * )}\n * </Flow.Input>\n * ))}\n * </Flow.Inputs>\n * <Flow.Submit>Process</Flow.Submit>\n * </Flow>\n * ```\n */\nexport const Flow = Object.assign(FlowRoot, {\n DropZone: FlowDropZone,\n Inputs: FlowInputs,\n Input: Object.assign(FlowInput, {\n DropZone: FlowInputDropZone,\n UrlField: FlowInputUrlField,\n Preview: FlowInputPreview,\n }),\n Progress: FlowProgress,\n Status: FlowStatus,\n Error: FlowError,\n Submit: FlowSubmit,\n Cancel: FlowCancel,\n Reset: FlowReset,\n});\n","import type React from \"react\";\nimport type {\n UploadItem,\n UseMultiUploadReturn,\n} from \"../hooks/use-multi-upload\";\nimport type { UploadStatus } from \"../hooks/use-upload\";\n\n/**\n * Render props passed to the UploadList children function.\n * Provides organized access to upload items, status groupings, and actions.\n *\n * @property items - All upload items (filtered and sorted if configured)\n * @property itemsByStatus - Upload items grouped by their current status\n * @property multiUpload - Complete multi-upload hook instance\n * @property actions - Helper functions for common item operations\n * @property actions.removeItem - Remove an item from the list\n * @property actions.retryItem - Retry a failed upload\n * @property actions.abortItem - Cancel an active upload\n * @property actions.startItem - Begin uploading an idle item\n */\nexport interface UploadListRenderProps {\n /**\n * All upload items\n */\n items: UploadItem[];\n\n /**\n * Items filtered by status\n */\n itemsByStatus: {\n idle: UploadItem[];\n uploading: UploadItem[];\n success: UploadItem[];\n error: UploadItem[];\n aborted: UploadItem[];\n };\n\n /**\n * Multi-upload state and controls\n */\n multiUpload: UseMultiUploadReturn;\n\n /**\n * Helper functions for item management\n */\n actions: {\n removeItem: (id: string) => void;\n retryItem: (item: UploadItem) => void;\n abortItem: (item: UploadItem) => void;\n startItem: (item: UploadItem) => void;\n };\n}\n\n/**\n * Props for the UploadList component.\n *\n * @property multiUpload - Multi-upload hook instance to display\n * @property filter - Optional function to filter which items to show\n * @property sortBy - Optional comparator function to sort items\n * @property children - Render function receiving list state and actions\n */\nexport interface UploadListProps {\n /**\n * Multi-upload instance from useMultiUpload hook\n */\n multiUpload: UseMultiUploadReturn;\n\n /**\n * Optional filter for which items to display\n */\n filter?: (item: UploadItem) => boolean;\n\n /**\n * Optional sorting function for items\n */\n sortBy?: (a: UploadItem, b: UploadItem) => number;\n\n /**\n * Render prop that receives upload list state and actions\n */\n children: (props: UploadListRenderProps) => React.ReactNode;\n}\n\n/**\n * Headless upload list component that provides flexible rendering for upload items.\n * Uses render props pattern to give full control over how upload items are displayed.\n *\n * @param props - Upload list configuration and render prop\n * @returns Rendered upload list using the provided render prop\n *\n * @example\n * ```tsx\n * // Basic upload list with progress bars\n * <UploadList multiUpload={multiUpload}>\n * {({ items, actions }) => (\n * <div>\n * <h3>Upload Queue ({items.length} files)</h3>\n * {items.map((item) => (\n * <div key={item.id} style={{\n * padding: '1rem',\n * border: '1px solid #ccc',\n * marginBottom: '0.5rem',\n * borderRadius: '4px'\n * }}>\n * <div style={{ display: 'flex', justifyContent: 'space-between' }}>\n * <span>{item.file.name}</span>\n * <span>{item.state.status}</span>\n * </div>\n *\n * {item.state.status === 'uploading' && (\n * <div>\n * <progress value={item.state.progress} max={100} />\n * <span>{item.state.progress}%</span>\n * <button onClick={() => actions.abortItem(item)}>Cancel</button>\n * </div>\n * )}\n *\n * {item.state.status === 'error' && (\n * <div>\n * <p style={{ color: 'red' }}>Error: {item.state.error?.message}</p>\n * <button onClick={() => actions.retryItem(item)}>Retry</button>\n * <button onClick={() => actions.removeItem(item.id)}>Remove</button>\n * </div>\n * )}\n *\n * {item.state.status === 'success' && (\n * <div>\n * <p style={{ color: 'green' }}>✓ Uploaded successfully</p>\n * <button onClick={() => actions.removeItem(item.id)}>Remove</button>\n * </div>\n * )}\n *\n * {item.state.status === 'idle' && (\n * <div>\n * <button onClick={() => actions.startItem(item)}>Start Upload</button>\n * <button onClick={() => actions.removeItem(item.id)}>Remove</button>\n * </div>\n * )}\n * </div>\n * ))}\n * </div>\n * )}\n * </UploadList>\n *\n * // Upload list with status filtering and sorting\n * <UploadList\n * multiUpload={multiUpload}\n * filter={(item) => item.state.status !== 'success'} // Hide successful uploads\n * sortBy={(a, b) => {\n * // Sort by status priority, then by filename\n * const statusPriority = { error: 0, uploading: 1, idle: 2, success: 3, aborted: 4 };\n * const aPriority = statusPriority[a.state.status];\n * const bPriority = statusPriority[b.state.status];\n *\n * if (aPriority !== bPriority) {\n * return aPriority - bPriority;\n * }\n *\n * return a.file.name.localeCompare(b.file.name);\n * }}\n * >\n * {({ items, itemsByStatus, multiUpload, actions }) => (\n * <div>\n * {itemsByStatus.error.length > 0 && (\n * <div>\n * <h4 style={{ color: 'red' }}>Failed Uploads ({itemsByStatus.error.length})</h4>\n * {itemsByStatus.error.map((item) => (\n * <UploadListItem key={item.id} item={item} actions={actions} />\n * ))}\n * </div>\n * )}\n *\n * {itemsByStatus.uploading.length > 0 && (\n * <div>\n * <h4>Uploading ({itemsByStatus.uploading.length})</h4>\n * {itemsByStatus.uploading.map((item) => (\n * <UploadListItem key={item.id} item={item} actions={actions} />\n * ))}\n * </div>\n * )}\n *\n * {itemsByStatus.idle.length > 0 && (\n * <div>\n * <h4>Pending ({itemsByStatus.idle.length})</h4>\n * {itemsByStatus.idle.map((item) => (\n * <UploadListItem key={item.id} item={item} actions={actions} />\n * ))}\n * </div>\n * )}\n * </div>\n * )}\n * </UploadList>\n * ```\n */\nexport function UploadList({\n multiUpload,\n filter,\n sortBy,\n children,\n}: UploadListProps) {\n // Apply filtering\n let items = multiUpload.items;\n if (filter) {\n items = items.filter(filter);\n }\n\n // Apply sorting\n if (sortBy) {\n items = [...items].sort(sortBy);\n }\n\n // Group items by status\n const itemsByStatus = {\n idle: items.filter((item) => item.state.status === \"idle\"),\n uploading: items.filter((item) => item.state.status === \"uploading\"),\n success: items.filter((item) => item.state.status === \"success\"),\n error: items.filter((item) => item.state.status === \"error\"),\n aborted: items.filter((item) => item.state.status === \"aborted\"),\n };\n\n // Create action helpers\n const actions = {\n removeItem: (id: string) => {\n multiUpload.removeItem(id);\n },\n retryItem: (_item: UploadItem) => {\n // Retry failed uploads using multiUpload method\n multiUpload.retryFailed();\n },\n abortItem: (item: UploadItem) => {\n // Remove the item to effectively abort it\n multiUpload.removeItem(item.id);\n },\n startItem: (_item: UploadItem) => {\n // Start all pending uploads\n multiUpload.startAll();\n },\n };\n\n // Create render props object\n const renderProps: UploadListRenderProps = {\n items,\n itemsByStatus,\n multiUpload,\n actions,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n/**\n * Props for the SimpleUploadListItem component.\n *\n * @property item - The upload item to display\n * @property actions - Action functions from UploadList render props\n * @property className - Additional CSS class name\n * @property style - Inline styles for the item container\n * @property showDetails - Whether to display file size and upload details\n */\nexport interface SimpleUploadListItemProps {\n /**\n * The upload item to render\n */\n item: UploadItem;\n\n /**\n * Actions from UploadList render props\n */\n actions: UploadListRenderProps[\"actions\"];\n\n /**\n * Additional CSS class name\n */\n className?: string;\n\n /**\n * Inline styles\n */\n style?: React.CSSProperties;\n\n /**\n * Whether to show detailed information (file size, speed, etc.)\n */\n showDetails?: boolean;\n}\n\n/**\n * Pre-styled upload list item component with status indicators and action buttons.\n * Displays file info, progress, errors, and contextual actions based on upload status.\n *\n * Features:\n * - Status-specific color coding and icons\n * - Progress bar for active uploads\n * - Error message display\n * - File size formatting\n * - Contextual action buttons (start, cancel, retry, remove)\n *\n * @param props - Upload item and configuration\n * @returns Styled upload list item component\n *\n * @example\n * ```tsx\n * // Use with UploadList\n * <UploadList multiUpload={multiUpload}>\n * {({ items, actions }) => (\n * <div>\n * {items.map((item) => (\n * <SimpleUploadListItem\n * key={item.id}\n * item={item}\n * actions={actions}\n * showDetails={true}\n * />\n * ))}\n * </div>\n * )}\n * </UploadList>\n *\n * // Custom styling\n * <SimpleUploadListItem\n * item={uploadItem}\n * actions={actions}\n * className=\"my-upload-item\"\n * style={{ borderRadius: '12px', margin: '1rem' }}\n * showDetails={true}\n * />\n * ```\n */\nexport function SimpleUploadListItem({\n item,\n actions,\n className = \"\",\n style = {},\n showDetails = true,\n}: SimpleUploadListItemProps) {\n const getStatusColor = (status: UploadStatus) => {\n switch (status) {\n case \"idle\":\n return \"#6c757d\";\n case \"uploading\":\n return \"#007bff\";\n case \"success\":\n return \"#28a745\";\n case \"error\":\n return \"#dc3545\";\n case \"aborted\":\n return \"#6c757d\";\n default:\n return \"#6c757d\";\n }\n };\n\n const getStatusIcon = (status: UploadStatus) => {\n switch (status) {\n case \"idle\":\n return \"⏳\";\n case \"uploading\":\n return \"📤\";\n case \"success\":\n return \"✅\";\n case \"error\":\n return \"❌\";\n case \"aborted\":\n return \"⏹️\";\n default:\n return \"❓\";\n }\n };\n\n const formatFileSize = (bytes: number) => {\n if (bytes === 0) return \"0 Bytes\";\n const k = 1024;\n const sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\"];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return `${parseFloat((bytes / k ** i).toFixed(2))} ${sizes[i]}`;\n };\n\n return (\n <div\n className={`upload-list-item upload-list-item--${item.state.status} ${className}`}\n style={{\n padding: \"12px\",\n border: \"1px solid #e0e0e0\",\n borderRadius: \"6px\",\n marginBottom: \"8px\",\n backgroundColor: \"#fff\",\n transition: \"all 0.2s ease\",\n ...style,\n }}\n >\n {/* Header with filename and status */}\n <div\n style={{\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n marginBottom: \"8px\",\n }}\n >\n <div\n style={{ display: \"flex\", alignItems: \"center\", gap: \"8px\", flex: 1 }}\n >\n <span style={{ fontSize: \"16px\" }}>\n {getStatusIcon(item.state.status)}\n </span>\n <span style={{ fontWeight: \"500\", flex: 1 }}>\n {item.file instanceof File ? item.file.name : \"File\"}\n </span>\n </div>\n <span\n style={{\n fontSize: \"12px\",\n color: getStatusColor(item.state.status),\n fontWeight: \"500\",\n textTransform: \"uppercase\",\n }}\n >\n {item.state.status}\n </span>\n </div>\n\n {/* Progress bar for uploading items */}\n {item.state.status === \"uploading\" && (\n <div style={{ marginBottom: \"8px\" }}>\n <div\n style={{\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n marginBottom: \"4px\",\n }}\n >\n <span style={{ fontSize: \"12px\", color: \"#666\" }}>\n {item.state.progress}%\n </span>\n {showDetails && item.state.totalBytes && (\n <span style={{ fontSize: \"12px\", color: \"#666\" }}>\n {formatFileSize(item.state.bytesUploaded)} /{\" \"}\n {formatFileSize(item.state.totalBytes)}\n </span>\n )}\n </div>\n <div\n style={{\n width: \"100%\",\n height: \"6px\",\n backgroundColor: \"#e0e0e0\",\n borderRadius: \"3px\",\n overflow: \"hidden\",\n }}\n >\n <div\n style={{\n width: `${item.state.progress}%`,\n height: \"100%\",\n backgroundColor: \"#007bff\",\n transition: \"width 0.2s ease\",\n }}\n />\n </div>\n </div>\n )}\n\n {/* Details section */}\n {showDetails && (\n <div style={{ fontSize: \"12px\", color: \"#666\", marginBottom: \"8px\" }}>\n {item.state.totalBytes && (\n <span>{formatFileSize(item.state.totalBytes)}</span>\n )}\n {item.state.status === \"uploading\" && item.state.progress > 0 && (\n <span> • Progress: {item.state.progress}%</span>\n )}\n {item.state.status === \"error\" && item.state.error && (\n <div style={{ color: \"#dc3545\", marginTop: \"4px\" }}>\n {item.state.error.message}\n </div>\n )}\n </div>\n )}\n\n {/* Action buttons */}\n <div style={{ display: \"flex\", gap: \"8px\", flexWrap: \"wrap\" }}>\n {item.state.status === \"idle\" && (\n <>\n <button\n type=\"button\"\n onClick={() => actions.startItem(item)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #007bff\",\n backgroundColor: \"#007bff\",\n color: \"white\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Start\n </button>\n <button\n type=\"button\"\n onClick={() => actions.removeItem(item.id)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #6c757d\",\n backgroundColor: \"transparent\",\n color: \"#6c757d\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Remove\n </button>\n </>\n )}\n\n {item.state.status === \"uploading\" && (\n <button\n type=\"button\"\n onClick={() => actions.abortItem(item)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #dc3545\",\n backgroundColor: \"transparent\",\n color: \"#dc3545\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Cancel\n </button>\n )}\n\n {item.state.status === \"error\" && (\n <>\n <button\n type=\"button\"\n onClick={() => actions.retryItem(item)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #28a745\",\n backgroundColor: \"#28a745\",\n color: \"white\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Retry\n </button>\n <button\n type=\"button\"\n onClick={() => actions.removeItem(item.id)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #6c757d\",\n backgroundColor: \"transparent\",\n color: \"#6c757d\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Remove\n </button>\n </>\n )}\n\n {item.state.status === \"success\" && (\n <button\n type=\"button\"\n onClick={() => actions.removeItem(item.id)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #6c757d\",\n backgroundColor: \"transparent\",\n color: \"#6c757d\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Remove\n </button>\n )}\n\n {item.state.status === \"aborted\" && (\n <>\n <button\n type=\"button\"\n onClick={() => actions.retryItem(item)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #007bff\",\n backgroundColor: \"#007bff\",\n color: \"white\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Retry\n </button>\n <button\n type=\"button\"\n onClick={() => actions.removeItem(item.id)}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n border: \"1px solid #6c757d\",\n backgroundColor: \"transparent\",\n color: \"#6c757d\",\n borderRadius: \"4px\",\n cursor: \"pointer\",\n }}\n >\n Remove\n </button>\n </>\n )}\n </div>\n </div>\n );\n}\n","/**\n * Upload Zone Components\n *\n * Enhanced error handling features:\n * - MIME type validation with detailed error messages\n * - File count validation (single vs multiple mode)\n * - Custom validation error callbacks\n * - Built-in error display in SimpleUploadZone\n * - Configurable error styling\n */\n\nimport type React from \"react\";\nimport { useCallback } from \"react\";\nimport type {\n DragDropOptions,\n UseDragDropReturn,\n} from \"../hooks/use-drag-drop\";\nimport { useDragDrop } from \"../hooks/use-drag-drop\";\nimport type {\n MultiUploadOptions,\n UseMultiUploadReturn,\n} from \"../hooks/use-multi-upload\";\nimport { useMultiUpload } from \"../hooks/use-multi-upload\";\nimport type { UseUploadOptions, UseUploadReturn } from \"../hooks/use-upload\";\nimport { useUpload } from \"../hooks/use-upload\";\n\n/**\n * Render props passed to the UploadZone children function.\n * Provides access to drag-drop state, upload controls, and helper functions.\n *\n * @property dragDrop - Complete drag-and-drop state and event handlers\n * @property upload - Single upload hook (null when multiple=true)\n * @property multiUpload - Multi-upload hook (null when multiple=false)\n * @property openFilePicker - Programmatically trigger file selection dialog\n * @property isActive - True when dragging over zone or files selected\n * @property isProcessing - True when uploads are in progress\n */\nexport interface UploadZoneRenderProps {\n /**\n * Drag and drop state and handlers\n */\n dragDrop: UseDragDropReturn;\n\n /**\n * Single upload functionality (if not using multi-upload)\n */\n upload: UseUploadReturn | null;\n\n /**\n * Multi-upload functionality (if using multi-upload)\n */\n multiUpload: UseMultiUploadReturn | null;\n\n /**\n * Helper function to open file picker\n */\n openFilePicker: () => void;\n\n /**\n * Whether the zone is currently active (dragging or uploading)\n */\n isActive: boolean;\n\n /**\n * Whether files are being processed\n */\n isProcessing: boolean;\n}\n\n/**\n * Props for the UploadZone component.\n * Combines drag-drop options with upload configuration.\n *\n * @property multiple - Enable multi-file selection and upload (default: true)\n * @property multiUploadOptions - Configuration for multi-upload mode\n * @property uploadOptions - Configuration for single-upload mode\n * @property children - Render function receiving upload zone state\n * @property onUploadStart - Called when files pass validation and upload begins\n * @property onValidationError - Called when file validation fails\n * @property accept - Accepted file types (e.g., ['image/*', '.pdf'])\n * @property maxFiles - Maximum number of files allowed\n * @property maxFileSize - Maximum file size in bytes\n * @property validator - Custom validation function\n */\nexport interface UploadZoneProps\n extends Omit<DragDropOptions, \"onFilesReceived\"> {\n /**\n * Whether to enable multi-file upload mode\n */\n multiple?: boolean;\n\n /**\n * Multi-upload specific options (only used when multiple=true)\n */\n multiUploadOptions?: MultiUploadOptions;\n\n /**\n * Single upload specific options (only used when multiple=false)\n */\n uploadOptions?: UseUploadOptions;\n\n /**\n * Render prop that receives upload zone state and handlers\n */\n children: (props: UploadZoneRenderProps) => React.ReactNode;\n\n /**\n * Called when files are processed and uploads begin\n */\n onUploadStart?: (files: File[]) => void;\n\n /**\n * Called when validation errors occur\n */\n onValidationError?: (errors: string[]) => void;\n}\n\n/**\n * Headless upload zone component that combines drag and drop functionality\n * with upload management. Uses render props pattern for maximum flexibility.\n * Includes enhanced error handling for MIME type validation and file count validation.\n *\n * @param props - Upload zone configuration and render prop\n * @returns Rendered upload zone using the provided render prop\n *\n * @example\n * ```tsx\n * // Single file upload zone with error handling\n * <UploadZone\n * multiple={false}\n * accept={['image/*']}\n * maxFileSize={5 * 1024 * 1024}\n * onValidationError={(errors) => {\n * console.error('Validation errors:', errors);\n * }}\n * uploadOptions={{\n * onSuccess: (result) => console.log('Upload complete:', result),\n * onError: (error) => console.error('Upload failed:', error),\n * }}\n * >\n * {({ dragDrop, upload, openFilePicker, isActive }) => (\n * <div {...dragDrop.dragHandlers} onClick={openFilePicker}>\n * {dragDrop.state.isDragging ? (\n * <p>Drop file here...</p>\n * ) : upload?.isUploading ? (\n * <p>Uploading... {upload.state.progress}%</p>\n * ) : (\n * <p>Drag a file here or click to select</p>\n * )}\n *\n * {dragDrop.state.errors.length > 0 && (\n * <div style={{ color: 'red' }}>\n * {dragDrop.state.errors.map((error, index) => (\n * <p key={index}>{error}</p>\n * ))}\n * </div>\n * )}\n *\n * <input {...dragDrop.inputProps} />\n * </div>\n * )}\n * </UploadZone>\n * ```\n */\nexport function UploadZone({\n children,\n multiple = true,\n multiUploadOptions = {},\n uploadOptions = {},\n onUploadStart,\n onValidationError,\n ...dragDropOptions\n}: UploadZoneProps) {\n // Always initialize both hooks, but only use the appropriate one\n const singleUpload = useUpload(uploadOptions);\n const multiUpload = useMultiUpload(multiUploadOptions);\n\n // Enhanced validation function for better error handling\n const enhancedValidator = useCallback(\n (files: File[]): string[] | null => {\n const errors: string[] = [];\n\n // Check file count based on multiple setting\n if (!multiple && files.length > 1) {\n errors.push(\n `Single file mode is enabled. Please select only one file. You selected ${files.length} files.`,\n );\n }\n\n // Enhanced MIME type validation with better error messages\n if (dragDropOptions.accept && dragDropOptions.accept.length > 0) {\n const invalidFiles = files.filter((file) => {\n return !dragDropOptions.accept?.some((acceptType) => {\n if (acceptType.startsWith(\".\")) {\n // File extension check\n return file.name.toLowerCase().endsWith(acceptType.toLowerCase());\n } else {\n // MIME type check (supports wildcards like image/*)\n if (acceptType.endsWith(\"/*\")) {\n const baseType = acceptType.slice(0, -2);\n return file.type.startsWith(baseType);\n } else {\n return file.type === acceptType;\n }\n }\n });\n });\n\n if (invalidFiles.length > 0) {\n const fileNames = invalidFiles\n .map((f) => `\"${f.name}\" (${f.type})`)\n .join(\", \");\n const acceptedTypes = dragDropOptions.accept.join(\", \");\n errors.push(\n `Invalid file type(s): ${fileNames}. Accepted types: ${acceptedTypes}.`,\n );\n }\n }\n\n return errors.length > 0 ? errors : null;\n },\n [multiple, dragDropOptions.accept],\n );\n\n // Handle file processing\n const handleFilesReceived = (files: File[]) => {\n onUploadStart?.(files);\n\n if (multiple && multiUpload) {\n // Add files to multi-upload queue\n multiUpload.addFiles(files);\n\n // Auto-start uploads if configured to do so\n // Note: This could be made configurable with an autoStart prop\n setTimeout(() => multiUpload.startAll(), 0);\n } else if (!multiple && singleUpload && files.length > 0 && files[0]) {\n // Start single file upload\n singleUpload.upload(files[0]);\n }\n };\n\n // Handle validation errors\n const handleValidationError = useCallback(\n (errors: string[]) => {\n console.error(\"Upload zone validation errors:\", errors);\n // Call the custom error handler if provided\n onValidationError?.(errors);\n },\n [onValidationError],\n );\n\n // Initialize drag and drop with enhanced validation\n const dragDrop = useDragDrop({\n ...dragDropOptions,\n multiple,\n validator: enhancedValidator,\n onFilesReceived: handleFilesReceived,\n onValidationError: handleValidationError,\n });\n\n // Determine active state\n const isActive = dragDrop.state.isDragging || dragDrop.state.isOver;\n\n // Determine processing state\n const isProcessing = multiple\n ? (multiUpload?.state.isUploading ?? false)\n : (singleUpload?.isUploading ?? false);\n\n // Create render props object\n const renderProps: UploadZoneRenderProps = {\n dragDrop,\n upload: singleUpload,\n multiUpload,\n openFilePicker: dragDrop.openFilePicker,\n isActive,\n isProcessing,\n };\n\n return <>{children(renderProps)}</>;\n}\n\n/**\n * Props for the SimpleUploadZone component with built-in styling.\n *\n * @property className - CSS class name for custom styling\n * @property style - Inline styles for the upload zone container\n * @property text - Custom text labels for different states\n * @property text.idle - Text shown when zone is idle\n * @property text.dragging - Text shown when dragging files over zone\n * @property text.uploading - Text shown during upload\n * @property errorStyle - Custom styles for validation error display\n */\nexport interface SimpleUploadZoneProps extends UploadZoneProps {\n /**\n * Additional CSS class name for styling\n */\n className?: string;\n\n /**\n * Inline styles for the upload zone\n */\n style?: React.CSSProperties;\n\n /**\n * Custom text to display in different states\n */\n text?: {\n idle?: string;\n dragging?: string;\n uploading?: string;\n };\n\n /**\n * Custom error message styling\n */\n errorStyle?: React.CSSProperties;\n}\n\n/**\n * Simple pre-styled upload zone component with built-in UI and error handling.\n * Provides a ready-to-use drag-and-drop upload interface with minimal configuration.\n *\n * Features:\n * - Built-in drag-and-drop visual feedback\n * - Automatic progress display\n * - File validation error display\n * - Customizable text and styling\n * - Keyboard accessible\n *\n * @param props - Upload zone configuration with styling options\n * @returns Styled upload zone component\n *\n * @example\n * ```tsx\n * // Multi-file upload with validation\n * <SimpleUploadZone\n * multiple={true}\n * accept={['image/*', '.pdf']}\n * maxFiles={5}\n * maxFileSize={10 * 1024 * 1024} // 10MB\n * onUploadStart={(files) => console.log('Starting uploads:', files.length)}\n * onValidationError={(errors) => {\n * errors.forEach(err => console.error(err));\n * }}\n * multiUploadOptions={{\n * maxConcurrent: 3,\n * onComplete: (results) => {\n * console.log(`${results.successful.length}/${results.total} uploaded`);\n * },\n * }}\n * style={{\n * width: '400px',\n * height: '200px',\n * margin: '20px auto',\n * }}\n * text={{\n * idle: 'Drop your files here or click to browse',\n * dragging: 'Release to upload',\n * uploading: 'Uploading files...',\n * }}\n * errorStyle={{\n * backgroundColor: '#fff3cd',\n * borderColor: '#ffeaa7',\n * }}\n * />\n *\n * // Single file upload\n * <SimpleUploadZone\n * multiple={false}\n * accept={['image/*']}\n * uploadOptions={{\n * onSuccess: (result) => console.log('Uploaded:', result),\n * onError: (error) => console.error('Failed:', error),\n * }}\n * text={{\n * idle: 'Click or drag an image to upload',\n * }}\n * />\n * ```\n */\nexport function SimpleUploadZone({\n className = \"\",\n style = {},\n text = {},\n errorStyle = {},\n children,\n ...uploadZoneProps\n}: SimpleUploadZoneProps) {\n const defaultText = {\n idle: uploadZoneProps.multiple\n ? \"Drag files here or click to select\"\n : \"Drag a file here or click to select\",\n dragging: uploadZoneProps.multiple\n ? \"Drop files here...\"\n : \"Drop file here...\",\n uploading: \"Uploading...\",\n };\n\n const displayText = { ...defaultText, ...text };\n\n // If children render prop is provided, use UploadZone directly\n if (children) {\n return <UploadZone {...uploadZoneProps}>{children}</UploadZone>;\n }\n\n // Otherwise, provide default UI\n return (\n <UploadZone {...uploadZoneProps}>\n {({\n dragDrop,\n upload,\n multiUpload,\n openFilePicker,\n isActive,\n isProcessing,\n }) => (\n <button\n type=\"button\"\n onKeyDown={(e) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n openFilePicker();\n }\n }}\n onKeyUp={(e) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n openFilePicker();\n }\n }}\n {...dragDrop.dragHandlers}\n onClick={openFilePicker}\n className={`upload-zone ${isActive ? \"upload-zone--active\" : \"\"} ${isProcessing ? \"upload-zone--processing\" : \"\"} ${className}`}\n style={{\n border: isActive ? \"2px dashed #007bff\" : \"2px dashed #ccc\",\n borderRadius: \"8px\",\n padding: \"2rem\",\n textAlign: \"center\",\n cursor: \"pointer\",\n backgroundColor: isActive ? \"#f8f9fa\" : \"transparent\",\n transition: \"all 0.2s ease\",\n minHeight: \"120px\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...style,\n }}\n >\n {dragDrop.state.isDragging ? (\n <p style={{ margin: 0, fontSize: \"16px\", color: \"#007bff\" }}>\n {displayText.dragging}\n </p>\n ) : isProcessing ? (\n <div style={{ textAlign: \"center\" }}>\n <p style={{ margin: \"0 0 10px 0\", fontSize: \"14px\" }}>\n {displayText.uploading}\n </p>\n {upload && (\n <div>\n <progress\n value={upload.state.progress}\n max={100}\n style={{ width: \"200px\", height: \"8px\" }}\n />\n <p\n style={{\n margin: \"5px 0 0 0\",\n fontSize: \"12px\",\n color: \"#666\",\n }}\n >\n {upload.state.progress}%\n </p>\n </div>\n )}\n {multiUpload && (\n <div>\n <progress\n value={multiUpload.state.progress}\n max={100}\n style={{ width: \"200px\", height: \"8px\" }}\n />\n <p\n style={{\n margin: \"5px 0 0 0\",\n fontSize: \"12px\",\n color: \"#666\",\n }}\n >\n {multiUpload.state.progress}% ({multiUpload.state.uploading}{\" \"}\n uploading, {multiUpload.state.successful} completed)\n </p>\n </div>\n )}\n </div>\n ) : (\n <p style={{ margin: 0, fontSize: \"16px\", color: \"#666\" }}>\n {displayText.idle}\n </p>\n )}\n\n {dragDrop.state.errors.length > 0 && (\n <div\n style={{\n marginTop: \"10px\",\n padding: \"8px 12px\",\n backgroundColor: \"#f8d7da\",\n border: \"1px solid #f5c6cb\",\n borderRadius: \"4px\",\n maxWidth: \"100%\",\n ...errorStyle,\n }}\n >\n <p\n style={{\n margin: \"0 0 5px 0\",\n fontSize: \"12px\",\n fontWeight: \"bold\",\n color: \"#721c24\",\n }}\n >\n Validation Errors:\n </p>\n {dragDrop.state.errors.map((error, index) => (\n <p\n // biome-ignore lint/suspicious/noArrayIndexKey: index is used as key\n key={index}\n style={{\n color: \"#721c24\",\n fontSize: \"11px\",\n margin: \"2px 0\",\n lineHeight: \"1.3\",\n }}\n >\n • {error}\n </p>\n ))}\n </div>\n )}\n\n <input {...dragDrop.inputProps} />\n </button>\n )}\n </UploadZone>\n );\n}\n","import type {\n BrowserUploadInput,\n FlowUploadConfig,\n FlowUploadItem,\n MultiFlowUploadOptions,\n} from \"@uploadista/client-browser\";\nimport type { ReactNode } from \"react\";\nimport { useMultiFlowUpload } from \"../hooks/use-multi-flow-upload\";\n\n/**\n * Render props passed to the FlowUploadList children function.\n * Provides access to upload items, aggregate statistics, and control methods.\n *\n * @property items - All flow upload items in the queue\n * @property totalProgress - Average progress across all uploads (0-100)\n * @property activeUploads - Count of currently uploading items\n * @property completedUploads - Count of successfully completed uploads\n * @property failedUploads - Count of failed uploads\n * @property isUploading - True when any uploads are in progress\n * @property addFiles - Add new files to the upload queue\n * @property removeFile - Remove a specific file from the queue\n * @property startUpload - Begin uploading all pending files\n * @property abortUpload - Cancel a specific active upload\n * @property abortAll - Cancel all active uploads\n * @property clear - Remove all items from the queue\n * @property retryUpload - Retry a specific failed upload\n */\nexport interface FlowUploadListRenderProps {\n /**\n * List of upload items\n */\n items: FlowUploadItem<BrowserUploadInput>[];\n\n /**\n * Total progress across all uploads\n */\n totalProgress: number;\n\n /**\n * Number of active uploads\n */\n activeUploads: number;\n\n /**\n * Number of completed uploads\n */\n completedUploads: number;\n\n /**\n * Number of failed uploads\n */\n failedUploads: number;\n\n /**\n * Whether any uploads are in progress\n */\n isUploading: boolean;\n\n /**\n * Add files to the upload queue\n */\n addFiles: (files: File[] | FileList) => void;\n\n /**\n * Remove a file from the queue\n */\n removeFile: (id: string) => void;\n\n /**\n * Start uploading all pending files\n */\n startUpload: () => void;\n\n /**\n * Abort a specific upload\n */\n abortUpload: (id: string) => void;\n\n /**\n * Abort all uploads\n */\n abortAll: () => void;\n\n /**\n * Clear all items\n */\n clear: () => void;\n\n /**\n * Retry a failed upload\n */\n retryUpload: (id: string) => void;\n}\n\n/**\n * Props for the FlowUploadList component.\n *\n * @property flowConfig - Flow execution configuration (flowId, storageId, etc.)\n * @property options - Multi-flow upload options (callbacks, concurrency, etc.)\n * @property children - Render function receiving flow upload list state\n */\nexport interface FlowUploadListProps {\n /**\n * Flow configuration\n */\n flowConfig: FlowUploadConfig;\n\n /**\n * Multi-upload options\n */\n options?: Omit<MultiFlowUploadOptions<BrowserUploadInput>, \"flowConfig\">;\n\n /**\n * Render function for the upload list\n */\n children: (props: FlowUploadListRenderProps) => ReactNode;\n}\n\n/**\n * Headless flow upload list component for managing batch file uploads through a flow.\n * Uses render props pattern to provide complete control over the UI while handling\n * concurrent uploads and flow processing.\n *\n * Each file is uploaded and processed independently through the specified flow,\n * with automatic queue management and concurrency control.\n *\n * Must be used within an UploadistaProvider.\n *\n * @param props - Flow upload list configuration and render prop\n * @returns Rendered flow upload list using the provided render prop\n *\n * @example\n * ```tsx\n * // Batch image processing with custom UI\n * <FlowUploadList\n * flowConfig={{\n * flowId: \"image-batch-processing\",\n * storageId: \"s3-images\",\n * outputNodeId: \"optimized\",\n * }}\n * options={{\n * maxConcurrent: 3,\n * onItemSuccess: (item) => {\n * console.log(`${item.file.name} processed successfully`);\n * },\n * onComplete: (items) => {\n * const successful = items.filter(i => i.status === 'success');\n * console.log(`Batch complete: ${successful.length}/${items.length} successful`);\n * },\n * }}\n * >\n * {({\n * items,\n * totalProgress,\n * activeUploads,\n * completedUploads,\n * failedUploads,\n * addFiles,\n * startUpload,\n * abortUpload,\n * retryUpload,\n * clear,\n * }) => (\n * <div>\n * <input\n * type=\"file\"\n * multiple\n * accept=\"image/*\"\n * onChange={(e) => {\n * if (e.target.files) {\n * addFiles(e.target.files);\n * startUpload();\n * }\n * }}\n * />\n *\n * <div style={{ marginTop: '1rem' }}>\n * <h3>Upload Progress</h3>\n * <div>Overall: {totalProgress}%</div>\n * <div>\n * Active: {activeUploads}, Completed: {completedUploads}, Failed: {failedUploads}\n * </div>\n * <button onClick={clear}>Clear All</button>\n * </div>\n *\n * <ul style={{ listStyle: 'none', padding: 0 }}>\n * {items.map((item) => (\n * <li key={item.id} style={{\n * padding: '1rem',\n * border: '1px solid #ccc',\n * marginBottom: '0.5rem'\n * }}>\n * <div>{item.file instanceof File ? item.file.name : 'File'}</div>\n * <div>Status: {item.status}</div>\n *\n * {item.status === \"uploading\" && (\n * <div>\n * <progress value={item.progress} max={100} style={{ width: '100%' }} />\n * <div>{item.progress}%</div>\n * <button onClick={() => abortUpload(item.id)}>Cancel</button>\n * </div>\n * )}\n *\n * {item.status === \"error\" && (\n * <div>\n * <div style={{ color: 'red' }}>{item.error?.message}</div>\n * <button onClick={() => retryUpload(item.id)}>Retry</button>\n * </div>\n * )}\n *\n * {item.status === \"success\" && (\n * <div style={{ color: 'green' }}>✓ Complete</div>\n * )}\n * </li>\n * ))}\n * </ul>\n * </div>\n * )}\n * </FlowUploadList>\n * ```\n *\n * @see {@link SimpleFlowUploadList} for a pre-styled version\n * @see {@link useMultiFlowUpload} for the underlying hook\n */\nexport function FlowUploadList({\n flowConfig,\n options,\n children,\n}: FlowUploadListProps) {\n const multiUpload = useMultiFlowUpload({\n ...options,\n flowConfig,\n });\n\n return (\n <>\n {children({\n items: multiUpload.state.items,\n totalProgress: multiUpload.state.totalProgress,\n activeUploads: multiUpload.state.activeUploads,\n completedUploads: multiUpload.state.completedUploads,\n failedUploads: multiUpload.state.failedUploads,\n isUploading: multiUpload.isUploading,\n addFiles: multiUpload.addFiles,\n removeFile: multiUpload.removeFile,\n startUpload: multiUpload.startUpload,\n abortUpload: multiUpload.abortUpload,\n abortAll: multiUpload.abortAll,\n clear: multiUpload.clear,\n retryUpload: multiUpload.retryUpload,\n })}\n </>\n );\n}\n\n/**\n * Props for the SimpleFlowUploadListItem component.\n *\n * @property item - The flow upload item to display\n * @property onAbort - Called when the abort button is clicked\n * @property onRetry - Called when the retry button is clicked\n * @property onRemove - Called when the remove button is clicked\n */\nexport interface SimpleFlowUploadListItemProps {\n /**\n * Upload item\n */\n item: FlowUploadItem<BrowserUploadInput>;\n\n /**\n * Abort the upload\n */\n onAbort: () => void;\n\n /**\n * Retry the upload\n */\n onRetry: () => void;\n\n /**\n * Remove the item\n */\n onRemove: () => void;\n}\n\n/**\n * Pre-styled flow upload list item component with status indicators.\n * Displays file name, upload progress, status, and contextual action buttons.\n *\n * Features:\n * - Status-specific icons and colors\n * - Progress bar with percentage and byte count\n * - Error message display\n * - Contextual action buttons (cancel, retry, remove)\n *\n * @param props - Upload item and callback functions\n * @returns Styled flow upload list item component\n *\n * @example\n * ```tsx\n * <SimpleFlowUploadListItem\n * item={uploadItem}\n * onAbort={() => console.log('Abort')}\n * onRetry={() => console.log('Retry')}\n * onRemove={() => console.log('Remove')}\n * />\n * ```\n */\nexport function SimpleFlowUploadListItem({\n item,\n onAbort,\n onRetry,\n onRemove,\n}: SimpleFlowUploadListItemProps) {\n const getStatusIcon = () => {\n switch (item.status) {\n case \"success\":\n return \"✓\";\n case \"error\":\n return \"✗\";\n case \"uploading\":\n return \"⟳\";\n case \"aborted\":\n return \"⊘\";\n default:\n return \"○\";\n }\n };\n\n const getStatusColor = () => {\n switch (item.status) {\n case \"success\":\n return \"green\";\n case \"error\":\n return \"red\";\n case \"uploading\":\n return \"blue\";\n case \"aborted\":\n return \"gray\";\n default:\n return \"black\";\n }\n };\n\n return (\n <div\n style={{\n display: \"flex\",\n alignItems: \"center\",\n gap: \"12px\",\n padding: \"8px\",\n borderBottom: \"1px solid #eee\",\n }}\n >\n <span style={{ color: getStatusColor(), fontSize: \"18px\" }}>\n {getStatusIcon()}\n </span>\n\n <div style={{ flex: 1, minWidth: 0 }}>\n <div\n style={{\n fontSize: \"14px\",\n fontWeight: 500,\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }}\n >\n {item.file instanceof File ? item.file.name : \"Upload\"}\n </div>\n\n {item.status === \"uploading\" && (\n <div style={{ marginTop: \"4px\" }}>\n <progress\n value={item.progress}\n max={100}\n style={{ width: \"100%\", height: \"4px\" }}\n />\n <div style={{ fontSize: \"12px\", color: \"#666\", marginTop: \"2px\" }}>\n {item.progress}% • {Math.round(item.bytesUploaded / 1024)} KB /{\" \"}\n {Math.round(item.totalBytes / 1024)} KB\n </div>\n </div>\n )}\n\n {item.status === \"error\" && (\n <div style={{ fontSize: \"12px\", color: \"red\", marginTop: \"2px\" }}>\n {item.error?.message || \"Upload failed\"}\n </div>\n )}\n\n {item.status === \"success\" && (\n <div style={{ fontSize: \"12px\", color: \"green\", marginTop: \"2px\" }}>\n Upload complete\n </div>\n )}\n </div>\n\n <div style={{ display: \"flex\", gap: \"8px\" }}>\n {item.status === \"uploading\" && (\n <button\n type=\"button\"\n onClick={onAbort}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n borderRadius: \"4px\",\n border: \"1px solid #ccc\",\n backgroundColor: \"#fff\",\n cursor: \"pointer\",\n }}\n >\n Cancel\n </button>\n )}\n\n {item.status === \"error\" && (\n <button\n type=\"button\"\n onClick={onRetry}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n borderRadius: \"4px\",\n border: \"1px solid #ccc\",\n backgroundColor: \"#fff\",\n cursor: \"pointer\",\n }}\n >\n Retry\n </button>\n )}\n\n {(item.status === \"pending\" ||\n item.status === \"error\" ||\n item.status === \"aborted\") && (\n <button\n type=\"button\"\n onClick={onRemove}\n style={{\n padding: \"4px 8px\",\n fontSize: \"12px\",\n borderRadius: \"4px\",\n border: \"1px solid #ccc\",\n backgroundColor: \"#fff\",\n cursor: \"pointer\",\n }}\n >\n Remove\n </button>\n )}\n </div>\n </div>\n );\n}\n\n/**\n * Props for the SimpleFlowUploadList component.\n *\n * @property flowConfig - Flow execution configuration\n * @property options - Multi-flow upload options (callbacks, concurrency)\n * @property className - CSS class name for the container\n * @property showFileInput - Whether to display the file input (default: true)\n * @property accept - Accepted file types for the file input\n */\nexport interface SimpleFlowUploadListProps {\n /**\n * Flow configuration\n */\n flowConfig: FlowUploadConfig;\n\n /**\n * Multi-upload options\n */\n options?: Omit<MultiFlowUploadOptions<BrowserUploadInput>, \"flowConfig\">;\n\n /**\n * CSS class for the container\n */\n className?: string;\n\n /**\n * Show file input\n */\n showFileInput?: boolean;\n\n /**\n * File input accept attribute\n */\n accept?: string;\n}\n\n/**\n * Simple pre-styled flow upload list component with built-in UI.\n * Provides a ready-to-use interface for batch file uploads with flow processing.\n *\n * Features:\n * - Built-in file input\n * - Overall progress display\n * - Individual item progress tracking\n * - Status indicators and action buttons\n * - Automatic upload start on file selection\n *\n * @param props - Flow upload list configuration with styling options\n * @returns Styled flow upload list component\n *\n * @example\n * ```tsx\n * // Basic batch image upload\n * <SimpleFlowUploadList\n * flowConfig={{\n * flowId: \"image-batch-processing\",\n * storageId: \"s3-images\",\n * }}\n * options={{\n * maxConcurrent: 3,\n * onItemSuccess: (item) => {\n * console.log(`${item.file.name} processed`);\n * },\n * onComplete: (items) => {\n * console.log(\"Batch complete:\", items.length);\n * },\n * }}\n * accept=\"image/*\"\n * className=\"my-upload-list\"\n * />\n *\n * // Without file input (add files programmatically)\n * <SimpleFlowUploadList\n * flowConfig={{\n * flowId: \"document-processing\",\n * storageId: \"docs\",\n * }}\n * showFileInput={false}\n * options={{\n * maxConcurrent: 2,\n * }}\n * />\n * ```\n *\n * @see {@link FlowUploadList} for the headless version with full control\n */\nexport function SimpleFlowUploadList({\n flowConfig,\n options,\n className = \"\",\n showFileInput = true,\n accept,\n}: SimpleFlowUploadListProps) {\n return (\n <FlowUploadList flowConfig={flowConfig} options={options}>\n {({\n items,\n addFiles,\n startUpload,\n abortUpload,\n retryUpload,\n removeFile,\n totalProgress,\n }) => (\n <div className={className}>\n {showFileInput && (\n <div style={{ marginBottom: \"16px\" }}>\n <input\n type=\"file\"\n multiple\n accept={accept}\n onChange={(e) => {\n if (e.target.files) {\n addFiles(e.target.files);\n startUpload();\n }\n }}\n style={{\n padding: \"8px\",\n border: \"1px solid #ccc\",\n borderRadius: \"4px\",\n }}\n />\n </div>\n )}\n\n {items.length > 0 && (\n <div>\n <div\n style={{ marginBottom: \"8px\", fontSize: \"14px\", color: \"#666\" }}\n >\n Total Progress: {totalProgress}%\n </div>\n\n <div\n style={{\n border: \"1px solid #eee\",\n borderRadius: \"8px\",\n overflow: \"hidden\",\n }}\n >\n {items.map((item) => (\n <SimpleFlowUploadListItem\n key={item.id}\n item={item}\n onAbort={() => abortUpload(item.id)}\n onRetry={() => retryUpload(item.id)}\n onRemove={() => removeFile(item.id)}\n />\n ))}\n </div>\n </div>\n )}\n </div>\n )}\n </FlowUploadList>\n );\n}\n"],"mappings":"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"}
|
package/dist/hooks/index.d.mts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { C as
|
|
2
|
-
import {
|
|
3
|
-
export { type DragDropOptions, type DragDropState, type FileUploadMetrics, type FlowInputMetadata, type FlowUploadState, type FlowUploadStatus, type
|
|
1
|
+
import { C as useDragDrop, S as UseDragDropReturn, _ as InputExecutionState, a as MultiUploadState, b as DragDropOptions, c as useMultiUpload, d as UseUploadOptions, f as UseUploadReturn, g as FlowUploadStatus, h as FlowUploadState, i as MultiUploadOptions, l as UploadState, m as FlowInputMetadata, n as UseUploadistaClientReturn, o as UploadItem, p as useUpload, r as useUploadistaClient, s as UseMultiUploadReturn, t as UseUploadistaClientOptions, u as UploadStatus, v as UseFlowReturn, x as DragDropState, y as useFlow } from "../use-uploadista-client-DHbLSpIb.mjs";
|
|
2
|
+
import { _ as UseFlowEventsOptions, a as UseUploadMetricsReturn, b as isUploadEvent, c as UploadFileEventData, d as UploadValidationSuccessEventData, f as UploadValidationWarningEventData, g as useMultiFlowUpload, h as UseMultiFlowUploadReturn, i as UseUploadMetricsOptions, l as UploadProgressEventData, m as useUploadEvents, n as FileUploadMetrics, o as useUploadMetrics, p as UseUploadEventsOptions, r as UploadMetrics, s as UploadFailedEventData, t as useUploadistaEvents, u as UploadValidationFailedEventData, v as useFlowEvents, y as isFlowEvent } from "../use-uploadista-events-CtDXJYrR.mjs";
|
|
3
|
+
export { type DragDropOptions, type DragDropState, type FileUploadMetrics, type FlowInputMetadata, type FlowUploadState, type FlowUploadStatus, type InputExecutionState, type MultiUploadOptions, type MultiUploadState, type UploadFailedEventData, type UploadFileEventData, type UploadItem, type UploadMetrics, type UploadProgressEventData, type UploadState, type UploadStatus, type UploadValidationFailedEventData, type UploadValidationSuccessEventData, type UploadValidationWarningEventData, type UseDragDropReturn, type UseFlowEventsOptions, type UseFlowReturn, type UseMultiFlowUploadReturn, type UseMultiUploadReturn, type UseUploadEventsOptions, type UseUploadMetricsOptions, type UseUploadMetricsReturn, type UseUploadOptions, type UseUploadReturn, type UseUploadistaClientOptions, type UseUploadistaClientReturn, isFlowEvent, isUploadEvent, useDragDrop, useFlow, useFlowEvents, useMultiFlowUpload, useMultiUpload, useUpload, useUploadEvents, useUploadMetrics, useUploadistaClient, useUploadistaEvents };
|
package/dist/hooks/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{i as e,n as t,r as n,s as r,t as i,u as a}from"../use-upload-BvvGROMR.mjs";import{a as o,i as s,n as c,o as l,r as u,t as d}from"../use-uploadista-events-BwUD-2Ck.mjs";export{o as isFlowEvent,l as isUploadEvent,a as useDragDrop,e as useFlow,s as useFlowEvents,n as useMultiFlowUpload,t as useMultiUpload,i as useUpload,u as useUploadEvents,c as useUploadMetrics,r as useUploadistaClient,d as useUploadistaEvents};
|
package/dist/index.d.mts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { C as
|
|
2
|
-
import { C as
|
|
3
|
-
import {
|
|
1
|
+
import { C as useDragDrop, S as UseDragDropReturn, _ as InputExecutionState, a as MultiUploadState, b as DragDropOptions, c as useMultiUpload, d as UseUploadOptions, f as UseUploadReturn, g as FlowUploadStatus, h as FlowUploadState, i as MultiUploadOptions, l as UploadState, m as FlowInputMetadata, n as UseUploadistaClientReturn, o as UploadItem, p as useUpload, r as useUploadistaClient, s as UseMultiUploadReturn, t as UseUploadistaClientOptions, u as UploadStatus, v as UseFlowReturn, x as DragDropState, y as useFlow } from "./use-uploadista-client-DHbLSpIb.mjs";
|
|
2
|
+
import { A as FlowInputPreviewProps, B as FlowStatusProps, C as FlowDropZoneProps, D as FlowInputContextValue, E as FlowErrorRenderProps, F as FlowInputsRenderProps, H as FlowSubmitProps, I as FlowProgressProps, L as FlowProgressRenderProps, M as FlowInputProps, N as FlowInputUrlFieldProps, O as FlowInputDropZoneProps, P as FlowInputsProps, R as FlowProps, S as FlowContextValue, T as FlowErrorProps, U as useFlowContext, V as FlowStatusRenderProps, W as useFlowInputContext, _ as SimpleFlowUploadListItem, a as UploadZone, b as Flow, c as SimpleUploadListItem, d as UploadListProps, f as UploadListRenderProps, g as SimpleFlowUploadList, h as FlowUploadListRenderProps, i as SimpleUploadZoneProps, j as FlowInputPreviewRenderProps, k as FlowInputDropZoneRenderProps, l as SimpleUploadListItemProps, m as FlowUploadListProps, n as useUploadistaContext, o as UploadZoneProps, p as FlowUploadList, r as SimpleUploadZone, s as UploadZoneRenderProps, t as UploadistaProvider, u as UploadList, v as SimpleFlowUploadListItemProps, w as FlowDropZoneRenderProps, x as FlowCancelProps, y as SimpleFlowUploadListProps, z as FlowResetProps } from "./uploadista-provider-C1l0iBc9.mjs";
|
|
3
|
+
import { _ as UseFlowEventsOptions, a as UseUploadMetricsReturn, b as isUploadEvent, c as UploadFileEventData, d as UploadValidationSuccessEventData, f as UploadValidationWarningEventData, g as useMultiFlowUpload, h as UseMultiFlowUploadReturn, i as UseUploadMetricsOptions, l as UploadProgressEventData, m as useUploadEvents, n as FileUploadMetrics, o as useUploadMetrics, p as UseUploadEventsOptions, r as UploadMetrics, s as UploadFailedEventData, t as useUploadistaEvents, u as UploadValidationFailedEventData, v as useFlowEvents, y as isFlowEvent } from "./use-uploadista-events-CtDXJYrR.mjs";
|
|
4
4
|
import { ReactNode } from "react";
|
|
5
5
|
import { FlowManager, FlowManagerCallbacks } from "@uploadista/client-core";
|
|
6
|
-
import * as
|
|
6
|
+
import * as react_jsx_runtime20 from "react/jsx-runtime";
|
|
7
7
|
import { FlowUploadOptions } from "@uploadista/client-browser";
|
|
8
8
|
|
|
9
9
|
//#region src/contexts/flow-manager-context.d.ts
|
|
@@ -54,7 +54,7 @@ interface FlowManagerProviderProps {
|
|
|
54
54
|
*/
|
|
55
55
|
declare function FlowManagerProvider({
|
|
56
56
|
children
|
|
57
|
-
}: FlowManagerProviderProps):
|
|
57
|
+
}: FlowManagerProviderProps): react_jsx_runtime20.JSX.Element;
|
|
58
58
|
/**
|
|
59
59
|
* Hook to access the FlowManager context.
|
|
60
60
|
* Must be used within a FlowManagerProvider.
|
|
@@ -72,5 +72,5 @@ declare function FlowManagerProvider({
|
|
|
72
72
|
*/
|
|
73
73
|
declare function useFlowManagerContext(): FlowManagerContextValue;
|
|
74
74
|
//#endregion
|
|
75
|
-
export { type DragDropOptions, type DragDropState, type FileUploadMetrics,
|
|
75
|
+
export { type DragDropOptions, type DragDropState, type FileUploadMetrics, Flow, type FlowCancelProps, type FlowContextValue, type FlowDropZoneProps, type FlowDropZoneRenderProps, type FlowErrorProps, type FlowErrorRenderProps, type FlowInputContextValue, type FlowInputDropZoneProps, type FlowInputDropZoneRenderProps, type FlowInputMetadata, type FlowInputPreviewProps, type FlowInputPreviewRenderProps, type FlowInputProps, type FlowInputUrlFieldProps, type FlowInputsProps, type FlowInputsRenderProps, FlowManagerProvider, type FlowProgressProps, type FlowProgressRenderProps, type FlowProps, type FlowResetProps, type FlowStatusProps, type FlowStatusRenderProps, type FlowSubmitProps, FlowUploadList, type FlowUploadListProps, type FlowUploadListRenderProps, type FlowUploadState, type FlowUploadStatus, type InputExecutionState, type MultiUploadOptions, type MultiUploadState, SimpleFlowUploadList, SimpleFlowUploadListItem, type SimpleFlowUploadListItemProps, type SimpleFlowUploadListProps, SimpleUploadListItem, type SimpleUploadListItemProps, SimpleUploadZone, type SimpleUploadZoneProps, type UploadFailedEventData, type UploadFileEventData, type UploadItem, UploadList, type UploadListProps, type UploadListRenderProps, type UploadMetrics, type UploadProgressEventData, type UploadState, type UploadStatus, type UploadValidationFailedEventData, type UploadValidationSuccessEventData, type UploadValidationWarningEventData, UploadZone, type UploadZoneProps, type UploadZoneRenderProps, UploadistaProvider, type UseDragDropReturn, type UseFlowEventsOptions, type UseFlowReturn, type UseMultiFlowUploadReturn, type UseMultiUploadReturn, type UseUploadEventsOptions, type UseUploadMetricsOptions, type UseUploadMetricsReturn, type UseUploadOptions, type UseUploadReturn, type UseUploadistaClientOptions, type UseUploadistaClientReturn, isFlowEvent, isUploadEvent, useDragDrop, useFlow, useFlowContext, useFlowEvents, useFlowInputContext, useFlowManagerContext, useMultiFlowUpload, useMultiUpload, useUpload, useUploadEvents, useUploadMetrics, useUploadistaClient, useUploadistaContext, useUploadistaEvents };
|
|
76
76
|
//# sourceMappingURL=index.d.mts.map
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,i as n,
|
|
1
|
+
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"./use-upload-BvvGROMR.mjs";import{a as u,c as d,i as f,l as p,n as m,o as h,r as g,s as _,t as v,u as y}from"./flow-upload-list-SbpCaxRq.mjs";import{a as b,i as x,n as S,o as C,r as w,t as T}from"./use-uploadista-events-BwUD-2Ck.mjs";export{d as Flow,t as FlowManagerProvider,v as FlowUploadList,m as SimpleFlowUploadList,g as SimpleFlowUploadListItem,h as SimpleUploadListItem,f as SimpleUploadZone,_ as UploadList,u as UploadZone,e as UploadistaProvider,b as isFlowEvent,C as isUploadEvent,l as useDragDrop,n as useFlow,p as useFlowContext,x as useFlowEvents,y as useFlowInputContext,r as useFlowManagerContext,o as useMultiFlowUpload,i as useMultiUpload,c as useUpload,w as useUploadEvents,S as useUploadMetrics,s as useUploadistaClient,a as useUploadistaContext,T as useUploadistaEvents};
|