@uploadista/vue 0.0.3 → 0.0.6

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.
@@ -0,0 +1,1419 @@
1
+ import * as vue1 from "vue";
2
+ import { App, InjectionKey, Ref } from "vue";
3
+ import * as _uploadista_client_browser0 from "@uploadista/client-browser";
4
+ import { BrowserUploadInput, FlowUploadConfig, MultiFlowUploadOptions, UploadOptions, UploadistaClientOptions, UploadistaEvent, createUploadistaClient } from "@uploadista/client-browser";
5
+ import { UploadFile } from "@uploadista/core/types";
6
+ import * as _uploadista_client_core0 from "@uploadista/client-core";
7
+ import * as _uploadista_core0 from "@uploadista/core";
8
+
9
+ //#region src/composables/plugin.d.ts
10
+ interface UploadistaPluginOptions extends UploadistaClientOptions {
11
+ /**
12
+ * Global event handler for all upload and flow events from this client
13
+ */
14
+ onEvent?: UploadistaClientOptions["onEvent"];
15
+ }
16
+ declare const UPLOADISTA_CLIENT_KEY: InjectionKey<ReturnType<typeof createUploadistaClient>>;
17
+ declare const UPLOADISTA_EVENT_SUBSCRIBERS_KEY: InjectionKey<Ref<Set<(event: UploadistaEvent) => void>>>;
18
+ /**
19
+ * Vue plugin for providing Uploadista client instance globally.
20
+ * Uses Vue's provide/inject pattern to make the client available
21
+ * throughout the component tree.
22
+ *
23
+ * @param options - Uploadista client configuration options
24
+ * @returns Vue plugin object
25
+ *
26
+ * @example
27
+ * ```typescript
28
+ * import { createApp } from 'vue';
29
+ * import { createUploadistaPlugin } from '@uploadista/vue';
30
+ * import App from './App.vue';
31
+ *
32
+ * const app = createApp(App);
33
+ *
34
+ * app.use(createUploadistaPlugin({
35
+ * baseUrl: 'https://api.example.com',
36
+ * storageId: 'my-storage',
37
+ * chunkSize: 1024 * 1024, // 1MB
38
+ * storeFingerprintForResuming: true,
39
+ * onEvent: (event) => {
40
+ * console.log('Upload event:', event);
41
+ * }
42
+ * }));
43
+ *
44
+ * app.mount('#app');
45
+ * ```
46
+ */
47
+ declare function createUploadistaPlugin(options: UploadistaPluginOptions): {
48
+ install(app: App): void;
49
+ };
50
+ //#endregion
51
+ //#region src/composables/useDragDrop.d.ts
52
+ interface DragDropOptions {
53
+ /**
54
+ * Accept specific file types (MIME types or file extensions)
55
+ */
56
+ accept?: string[];
57
+ /**
58
+ * Maximum number of files allowed
59
+ */
60
+ maxFiles?: number;
61
+ /**
62
+ * Maximum file size in bytes
63
+ */
64
+ maxFileSize?: number;
65
+ /**
66
+ * Whether to allow multiple files
67
+ */
68
+ multiple?: boolean;
69
+ /**
70
+ * Custom validation function for files
71
+ */
72
+ validator?: (files: File[]) => string[] | null;
73
+ /**
74
+ * Called when files are dropped or selected
75
+ */
76
+ onFilesReceived?: (files: File[]) => void;
77
+ /**
78
+ * Called when validation fails
79
+ */
80
+ onValidationError?: (errors: string[]) => void;
81
+ /**
82
+ * Called when drag state changes
83
+ */
84
+ onDragStateChange?: (isDragging: boolean) => void;
85
+ }
86
+ interface DragDropState {
87
+ /**
88
+ * Whether files are currently being dragged over the drop zone
89
+ */
90
+ isDragging: boolean;
91
+ /**
92
+ * Whether the drag is currently over the drop zone
93
+ */
94
+ isOver: boolean;
95
+ /**
96
+ * Whether the dragged items are valid files
97
+ */
98
+ isValid: boolean;
99
+ /**
100
+ * Current validation errors
101
+ */
102
+ errors: string[];
103
+ }
104
+ /**
105
+ * Vue composable for handling drag and drop file uploads with validation.
106
+ * Provides drag state management, file validation, and file picker integration.
107
+ *
108
+ * @param options - Configuration and event handlers
109
+ * @returns Drag and drop state and handlers
110
+ *
111
+ * @example
112
+ * ```vue
113
+ * <script setup lang="ts">
114
+ * import { useDragDrop } from '@uploadista/vue';
115
+ * import { ref } from 'vue';
116
+ *
117
+ * const inputRef = ref<HTMLInputElement>();
118
+ *
119
+ * const dragDrop = useDragDrop({
120
+ * accept: ['image/*', '.pdf'],
121
+ * maxFiles: 5,
122
+ * maxFileSize: 10 * 1024 * 1024, // 10MB
123
+ * multiple: true,
124
+ * onFilesReceived: (files) => {
125
+ * console.log('Received files:', files);
126
+ * // Process files with upload composables
127
+ * },
128
+ * onValidationError: (errors) => {
129
+ * console.error('Validation errors:', errors);
130
+ * },
131
+ * });
132
+ *
133
+ * const openFilePicker = () => {
134
+ * inputRef.value?.click();
135
+ * };
136
+ * </script>
137
+ *
138
+ * <template>
139
+ * <div>
140
+ * <div
141
+ * @dragenter="dragDrop.onDragEnter"
142
+ * @dragover="dragDrop.onDragOver"
143
+ * @dragleave="dragDrop.onDragLeave"
144
+ * @drop="dragDrop.onDrop"
145
+ * @click="openFilePicker"
146
+ * :style="{
147
+ * border: dragDrop.state.isDragging ? '2px dashed #007bff' : '2px dashed #ccc',
148
+ * backgroundColor: dragDrop.state.isOver ? '#f8f9fa' : 'transparent',
149
+ * padding: '2rem',
150
+ * textAlign: 'center',
151
+ * cursor: 'pointer',
152
+ * }"
153
+ * >
154
+ * <p v-if="dragDrop.state.isDragging">Drop files here...</p>
155
+ * <p v-else>Drag files here or click to select</p>
156
+ *
157
+ * <div v-if="dragDrop.state.errors.length > 0" style="color: red; margin-top: 1rem">
158
+ * <p v-for="(error, index) in dragDrop.state.errors" :key="index">{{ error }}</p>
159
+ * </div>
160
+ * </div>
161
+ *
162
+ * <input
163
+ * ref="inputRef"
164
+ * type="file"
165
+ * :multiple="dragDrop.inputProps.multiple"
166
+ * :accept="dragDrop.inputProps.accept"
167
+ * @change="dragDrop.onInputChange"
168
+ * style="display: none"
169
+ * />
170
+ * </div>
171
+ * </template>
172
+ * ```
173
+ */
174
+ declare function useDragDrop(options?: DragDropOptions): {
175
+ state: Readonly<vue1.Ref<{
176
+ readonly isDragging: boolean;
177
+ readonly isOver: boolean;
178
+ readonly isValid: boolean;
179
+ readonly errors: readonly string[];
180
+ }, {
181
+ readonly isDragging: boolean;
182
+ readonly isOver: boolean;
183
+ readonly isValid: boolean;
184
+ readonly errors: readonly string[];
185
+ }>>;
186
+ onDragEnter: (event: DragEvent) => void;
187
+ onDragOver: (event: DragEvent) => void;
188
+ onDragLeave: (event: DragEvent) => void;
189
+ onDrop: (event: DragEvent) => void;
190
+ onInputChange: (event: Event) => void;
191
+ inputProps: vue1.ComputedRef<{
192
+ type: "file";
193
+ multiple: boolean;
194
+ accept: string | undefined;
195
+ }>;
196
+ processFiles: (files: File[]) => void;
197
+ reset: () => void;
198
+ };
199
+ //#endregion
200
+ //#region src/composables/useFlowUpload.d.ts
201
+ type FlowUploadStatus = "idle" | "uploading" | "processing" | "success" | "error" | "aborted";
202
+ interface FlowUploadState<TOutput = UploadFile> {
203
+ status: FlowUploadStatus;
204
+ progress: number;
205
+ bytesUploaded: number;
206
+ totalBytes: number | null;
207
+ error: Error | null;
208
+ result: TOutput | null;
209
+ jobId: string | null;
210
+ flowStarted: boolean;
211
+ currentNodeName: string | null;
212
+ currentNodeType: string | null;
213
+ flowOutputs: Record<string, unknown> | null;
214
+ }
215
+ interface UseFlowUploadOptions<TOutput = UploadFile> {
216
+ /**
217
+ * Flow configuration
218
+ */
219
+ flowConfig: FlowUploadConfig;
220
+ /**
221
+ * Called when upload progress updates
222
+ */
223
+ onProgress?: (progress: number, bytesUploaded: number, totalBytes: number | null) => void;
224
+ /**
225
+ * Called when a chunk completes
226
+ */
227
+ onChunkComplete?: (chunkSize: number, bytesAccepted: number, bytesTotal: number | null) => void;
228
+ /**
229
+ * Called when the flow completes successfully (receives full flow outputs)
230
+ * This is the recommended callback for multi-output flows
231
+ * Format: { [outputNodeId]: result, ... }
232
+ */
233
+ onFlowComplete?: (outputs: Record<string, unknown>) => void;
234
+ /**
235
+ * Called when upload succeeds (legacy, single-output flows)
236
+ * For single-output flows, receives the value from the specified outputNodeId
237
+ * or the first output node if outputNodeId is not specified
238
+ */
239
+ onSuccess?: (result: TOutput) => void;
240
+ /**
241
+ * Called when upload fails
242
+ */
243
+ onError?: (error: Error) => void;
244
+ /**
245
+ * Called when upload is aborted
246
+ */
247
+ onAbort?: () => void;
248
+ /**
249
+ * Custom retry logic
250
+ */
251
+ onShouldRetry?: (error: Error, retryAttempt: number) => boolean;
252
+ }
253
+ /**
254
+ * Vue composable for uploading files through a flow.
255
+ *
256
+ * This composable provides a simple interface for uploading files through a flow.
257
+ * The flow handles the upload process and can perform post-processing like
258
+ * saving to storage, optimizing images, etc.
259
+ *
260
+ * Must be used within a component tree that has the Uploadista plugin installed.
261
+ * Events are automatically wired up through the plugin.
262
+ *
263
+ * @example
264
+ * ```vue
265
+ * <script setup lang="ts">
266
+ * import { useFlowUpload } from '@uploadista/vue';
267
+ *
268
+ * const flowUpload = useFlowUpload({
269
+ * flowConfig: {
270
+ * flowId: "my-upload-flow",
271
+ * storageId: "my-storage",
272
+ * },
273
+ * onSuccess: (result) => {
274
+ * console.log("Upload complete:", result);
275
+ * },
276
+ * });
277
+ *
278
+ * const handleFileChange = (event: Event) => {
279
+ * const file = (event.target as HTMLInputElement).files?.[0];
280
+ * if (file) flowUpload.upload(file);
281
+ * };
282
+ * </script>
283
+ *
284
+ * <template>
285
+ * <input type="file" @change="handleFileChange" />
286
+ * </template>
287
+ * ```
288
+ */
289
+ declare function useFlowUpload<TOutput = UploadFile>(options: UseFlowUploadOptions<TOutput>): {
290
+ state: Readonly<vue1.Ref<{
291
+ readonly status: FlowUploadStatus;
292
+ readonly progress: number;
293
+ readonly bytesUploaded: number;
294
+ readonly totalBytes: number | null;
295
+ readonly error: Error | null;
296
+ readonly result: vue1.DeepReadonly<vue1.UnwrapRef<TOutput>> | null;
297
+ readonly jobId: string | null;
298
+ readonly flowStarted: boolean;
299
+ readonly currentNodeName: string | null;
300
+ readonly currentNodeType: string | null;
301
+ readonly flowOutputs: {
302
+ readonly [x: string]: Readonly<unknown>;
303
+ } | null;
304
+ }, {
305
+ readonly status: FlowUploadStatus;
306
+ readonly progress: number;
307
+ readonly bytesUploaded: number;
308
+ readonly totalBytes: number | null;
309
+ readonly error: Error | null;
310
+ readonly result: vue1.DeepReadonly<vue1.UnwrapRef<TOutput>> | null;
311
+ readonly jobId: string | null;
312
+ readonly flowStarted: boolean;
313
+ readonly currentNodeName: string | null;
314
+ readonly currentNodeType: string | null;
315
+ readonly flowOutputs: {
316
+ readonly [x: string]: Readonly<unknown>;
317
+ } | null;
318
+ }>>;
319
+ upload: (file: File | Blob) => Promise<void>;
320
+ abort: () => void;
321
+ reset: () => void;
322
+ isUploading: vue1.ComputedRef<boolean>;
323
+ isUploadingFile: vue1.ComputedRef<boolean>;
324
+ isProcessing: vue1.ComputedRef<boolean>;
325
+ };
326
+ //#endregion
327
+ //#region src/composables/useMultiFlowUpload.d.ts
328
+ /**
329
+ * Vue composable for uploading multiple files through a flow.
330
+ *
331
+ * Must be used within a component tree that has the Uploadista plugin installed.
332
+ *
333
+ * @example
334
+ * ```vue
335
+ * <script setup lang="ts">
336
+ * import { useMultiFlowUpload } from '@uploadista/vue';
337
+ *
338
+ * const multiFlowUpload = useMultiFlowUpload({
339
+ * flowConfig: {
340
+ * flowId: "batch-upload-flow",
341
+ * inputNodeId: "upload-node",
342
+ * storageId: "my-storage",
343
+ * },
344
+ * maxConcurrent: 3,
345
+ * onComplete: (items) => {
346
+ * console.log("All uploads complete:", items);
347
+ * },
348
+ * });
349
+ *
350
+ * const handleFileChange = (event: Event) => {
351
+ * const files = (event.target as HTMLInputElement).files;
352
+ * if (files) {
353
+ * multiFlowUpload.addFiles(files);
354
+ * multiFlowUpload.startUpload();
355
+ * }
356
+ * };
357
+ * </script>
358
+ *
359
+ * <template>
360
+ * <div>
361
+ * <input type="file" multiple @change="handleFileChange" />
362
+ *
363
+ * <div v-for="item in multiFlowUpload.state.items" :key="item.id">
364
+ * <span>{{ item.file.name }}</span>
365
+ * <progress :value="item.progress" :max="100" />
366
+ * <button
367
+ * v-if="item.status === 'uploading'"
368
+ * @click="multiFlowUpload.abortUpload(item.id)"
369
+ * >
370
+ * Cancel
371
+ * </button>
372
+ * </div>
373
+ * </div>
374
+ * </template>
375
+ * ```
376
+ */
377
+ declare function useMultiFlowUpload(options: MultiFlowUploadOptions<BrowserUploadInput>): {
378
+ state: Readonly<vue1.Ref<{
379
+ readonly items: readonly {
380
+ readonly id: string;
381
+ readonly file: {
382
+ readonly lastModified: number;
383
+ readonly name: string;
384
+ readonly webkitRelativePath: string;
385
+ readonly size: number;
386
+ readonly type: string;
387
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
388
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
389
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
390
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
391
+ readonly text: () => Promise<string>;
392
+ } | {
393
+ readonly size: number;
394
+ readonly type: string;
395
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
396
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
397
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
398
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
399
+ readonly text: () => Promise<string>;
400
+ };
401
+ readonly status: "pending" | "uploading" | "success" | "error" | "aborted";
402
+ readonly progress: number;
403
+ readonly bytesUploaded: number;
404
+ readonly totalBytes: number;
405
+ readonly error: Error | null;
406
+ readonly result: {
407
+ readonly id: string;
408
+ readonly offset: number;
409
+ readonly storage: {
410
+ readonly id: string;
411
+ readonly type: string;
412
+ readonly path?: string | undefined | undefined;
413
+ readonly uploadId?: string | undefined | undefined;
414
+ readonly bucket?: string | undefined | undefined;
415
+ };
416
+ readonly flow?: {
417
+ readonly flowId: string;
418
+ readonly nodeId: string;
419
+ readonly jobId: string;
420
+ } | undefined;
421
+ readonly size?: number | undefined | undefined;
422
+ readonly metadata?: {
423
+ readonly [x: string]: string | number | boolean;
424
+ } | undefined;
425
+ readonly creationDate?: string | undefined | undefined;
426
+ readonly url?: string | undefined | undefined;
427
+ readonly sizeIsDeferred?: boolean | undefined | undefined;
428
+ readonly checksum?: string | undefined | undefined;
429
+ readonly checksumAlgorithm?: string | undefined | undefined;
430
+ } | null;
431
+ readonly jobId: string | null;
432
+ }[];
433
+ readonly totalProgress: number;
434
+ readonly activeUploads: number;
435
+ readonly completedUploads: number;
436
+ readonly failedUploads: number;
437
+ }, {
438
+ readonly items: readonly {
439
+ readonly id: string;
440
+ readonly file: {
441
+ readonly lastModified: number;
442
+ readonly name: string;
443
+ readonly webkitRelativePath: string;
444
+ readonly size: number;
445
+ readonly type: string;
446
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
447
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
448
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
449
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
450
+ readonly text: () => Promise<string>;
451
+ } | {
452
+ readonly size: number;
453
+ readonly type: string;
454
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
455
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
456
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
457
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
458
+ readonly text: () => Promise<string>;
459
+ };
460
+ readonly status: "pending" | "uploading" | "success" | "error" | "aborted";
461
+ readonly progress: number;
462
+ readonly bytesUploaded: number;
463
+ readonly totalBytes: number;
464
+ readonly error: Error | null;
465
+ readonly result: {
466
+ readonly id: string;
467
+ readonly offset: number;
468
+ readonly storage: {
469
+ readonly id: string;
470
+ readonly type: string;
471
+ readonly path?: string | undefined | undefined;
472
+ readonly uploadId?: string | undefined | undefined;
473
+ readonly bucket?: string | undefined | undefined;
474
+ };
475
+ readonly flow?: {
476
+ readonly flowId: string;
477
+ readonly nodeId: string;
478
+ readonly jobId: string;
479
+ } | undefined;
480
+ readonly size?: number | undefined | undefined;
481
+ readonly metadata?: {
482
+ readonly [x: string]: string | number | boolean;
483
+ } | undefined;
484
+ readonly creationDate?: string | undefined | undefined;
485
+ readonly url?: string | undefined | undefined;
486
+ readonly sizeIsDeferred?: boolean | undefined | undefined;
487
+ readonly checksum?: string | undefined | undefined;
488
+ readonly checksumAlgorithm?: string | undefined | undefined;
489
+ } | null;
490
+ readonly jobId: string | null;
491
+ }[];
492
+ readonly totalProgress: number;
493
+ readonly activeUploads: number;
494
+ readonly completedUploads: number;
495
+ readonly failedUploads: number;
496
+ }>>;
497
+ addFiles: (files: File[] | FileList) => void;
498
+ removeFile: (id: string) => void;
499
+ startUpload: () => void;
500
+ abortUpload: (id: string) => void;
501
+ abortAll: () => void;
502
+ clear: () => void;
503
+ retryUpload: (id: string) => void;
504
+ isUploading: vue1.ComputedRef<boolean>;
505
+ };
506
+ //#endregion
507
+ //#region src/composables/useUpload.d.ts
508
+ type UploadInput = File | Blob;
509
+ type ChunkMetrics = any;
510
+ type PerformanceInsights = any;
511
+ type UploadSessionMetrics = any;
512
+ type UploadStatus = "idle" | "uploading" | "success" | "error" | "aborted";
513
+ interface UploadState {
514
+ status: UploadStatus;
515
+ progress: number;
516
+ bytesUploaded: number;
517
+ totalBytes: number | null;
518
+ error: Error | null;
519
+ result: UploadFile | null;
520
+ }
521
+ interface UploadMetrics {
522
+ /**
523
+ * Get performance insights from the upload client
524
+ */
525
+ getInsights: () => PerformanceInsights;
526
+ /**
527
+ * Export detailed metrics from the upload client
528
+ */
529
+ exportMetrics: () => {
530
+ session: Partial<UploadSessionMetrics>;
531
+ chunks: ChunkMetrics[];
532
+ insights: PerformanceInsights;
533
+ };
534
+ /**
535
+ * Get current network metrics
536
+ */
537
+ getNetworkMetrics: () => unknown;
538
+ /**
539
+ * Get current network condition
540
+ */
541
+ getNetworkCondition: () => unknown;
542
+ /**
543
+ * Reset all metrics
544
+ */
545
+ resetMetrics: () => void;
546
+ }
547
+ /**
548
+ * Vue composable for managing individual file uploads with full state management.
549
+ * Provides upload progress tracking, error handling, abort functionality, and retry logic.
550
+ *
551
+ * Must be used within a component tree that has the Uploadista plugin installed.
552
+ *
553
+ * @param options - Upload configuration and event handlers
554
+ * @returns Upload state and control methods
555
+ *
556
+ * @example
557
+ * ```vue
558
+ * <script setup lang="ts">
559
+ * import { useUpload } from '@uploadista/vue';
560
+ *
561
+ * const upload = useUpload({
562
+ * onSuccess: (result) => console.log('Upload complete:', result),
563
+ * onError: (error) => console.error('Upload failed:', error),
564
+ * onProgress: (progress) => console.log('Progress:', progress + '%'),
565
+ * });
566
+ *
567
+ * const handleFileChange = (event: Event) => {
568
+ * const file = (event.target as HTMLInputElement).files?.[0];
569
+ * if (file) upload.upload(file);
570
+ * };
571
+ * </script>
572
+ *
573
+ * <template>
574
+ * <div>
575
+ * <input type="file" @change="handleFileChange" />
576
+ * <div v-if="upload.isUploading">Progress: {{ upload.state.progress }}%</div>
577
+ * <div v-if="upload.state.error">Error: {{ upload.state.error.message }}</div>
578
+ * <button v-if="upload.canRetry" @click="upload.retry">Retry</button>
579
+ * <button @click="upload.abort" :disabled="!upload.isUploading">Abort</button>
580
+ * </div>
581
+ * </template>
582
+ * ```
583
+ */
584
+ declare function useUpload(options?: UploadOptions): {
585
+ state: Readonly<vue1.Ref<{
586
+ readonly status: UploadStatus;
587
+ readonly progress: number;
588
+ readonly bytesUploaded: number;
589
+ readonly totalBytes: number | null;
590
+ readonly error: Error | null;
591
+ readonly result: {
592
+ readonly id: string;
593
+ readonly offset: number;
594
+ readonly storage: {
595
+ readonly id: string;
596
+ readonly type: string;
597
+ readonly path?: string | undefined | undefined;
598
+ readonly uploadId?: string | undefined | undefined;
599
+ readonly bucket?: string | undefined | undefined;
600
+ };
601
+ readonly flow?: {
602
+ readonly flowId: string;
603
+ readonly nodeId: string;
604
+ readonly jobId: string;
605
+ } | undefined;
606
+ readonly size?: number | undefined | undefined;
607
+ readonly metadata?: {
608
+ readonly [x: string]: string | number | boolean;
609
+ } | undefined;
610
+ readonly creationDate?: string | undefined | undefined;
611
+ readonly url?: string | undefined | undefined;
612
+ readonly sizeIsDeferred?: boolean | undefined | undefined;
613
+ readonly checksum?: string | undefined | undefined;
614
+ readonly checksumAlgorithm?: string | undefined | undefined;
615
+ } | null;
616
+ }, {
617
+ readonly status: UploadStatus;
618
+ readonly progress: number;
619
+ readonly bytesUploaded: number;
620
+ readonly totalBytes: number | null;
621
+ readonly error: Error | null;
622
+ readonly result: {
623
+ readonly id: string;
624
+ readonly offset: number;
625
+ readonly storage: {
626
+ readonly id: string;
627
+ readonly type: string;
628
+ readonly path?: string | undefined | undefined;
629
+ readonly uploadId?: string | undefined | undefined;
630
+ readonly bucket?: string | undefined | undefined;
631
+ };
632
+ readonly flow?: {
633
+ readonly flowId: string;
634
+ readonly nodeId: string;
635
+ readonly jobId: string;
636
+ } | undefined;
637
+ readonly size?: number | undefined | undefined;
638
+ readonly metadata?: {
639
+ readonly [x: string]: string | number | boolean;
640
+ } | undefined;
641
+ readonly creationDate?: string | undefined | undefined;
642
+ readonly url?: string | undefined | undefined;
643
+ readonly sizeIsDeferred?: boolean | undefined | undefined;
644
+ readonly checksum?: string | undefined | undefined;
645
+ readonly checksumAlgorithm?: string | undefined | undefined;
646
+ } | null;
647
+ }>>;
648
+ upload: (file: UploadInput) => void;
649
+ abort: () => void;
650
+ reset: () => void;
651
+ retry: () => void;
652
+ isUploading: vue1.ComputedRef<boolean>;
653
+ canRetry: vue1.ComputedRef<boolean>;
654
+ metrics: UploadMetrics;
655
+ };
656
+ //#endregion
657
+ //#region src/composables/useMultiUpload.d.ts
658
+ interface UploadItem {
659
+ id: string;
660
+ file: UploadInput;
661
+ state: UploadState;
662
+ }
663
+ interface MultiUploadOptions extends Omit<UploadOptions, "onSuccess" | "onError" | "onProgress"> {
664
+ /**
665
+ * Maximum number of concurrent uploads
666
+ */
667
+ maxConcurrent?: number;
668
+ /**
669
+ * Called when an individual file upload starts
670
+ */
671
+ onUploadStart?: (item: UploadItem) => void;
672
+ /**
673
+ * Called when an individual file upload progresses
674
+ */
675
+ onUploadProgress?: (item: UploadItem, progress: number, bytesUploaded: number, totalBytes: number | null) => void;
676
+ /**
677
+ * Called when an individual file upload succeeds
678
+ */
679
+ onUploadSuccess?: (item: UploadItem, result: UploadFile) => void;
680
+ /**
681
+ * Called when an individual file upload fails
682
+ */
683
+ onUploadError?: (item: UploadItem, error: Error) => void;
684
+ /**
685
+ * Called when all uploads complete (successfully or with errors)
686
+ */
687
+ onComplete?: (results: {
688
+ successful: UploadItem[];
689
+ failed: UploadItem[];
690
+ total: number;
691
+ }) => void;
692
+ }
693
+ interface MultiUploadState {
694
+ /**
695
+ * Total number of uploads
696
+ */
697
+ total: number;
698
+ /**
699
+ * Number of completed uploads (successful + failed)
700
+ */
701
+ completed: number;
702
+ /**
703
+ * Number of successful uploads
704
+ */
705
+ successful: number;
706
+ /**
707
+ * Number of failed uploads
708
+ */
709
+ failed: number;
710
+ /**
711
+ * Number of currently uploading files
712
+ */
713
+ uploading: number;
714
+ /**
715
+ * Overall progress as a percentage (0-100)
716
+ */
717
+ progress: number;
718
+ /**
719
+ * Total bytes uploaded across all files
720
+ */
721
+ totalBytesUploaded: number;
722
+ /**
723
+ * Total bytes to upload across all files
724
+ */
725
+ totalBytes: number;
726
+ /**
727
+ * Whether any uploads are currently active
728
+ */
729
+ isUploading: boolean;
730
+ /**
731
+ * Whether all uploads have completed
732
+ */
733
+ isComplete: boolean;
734
+ }
735
+ /**
736
+ * Vue composable for managing multiple file uploads with queue management,
737
+ * concurrent upload limits, and batch operations.
738
+ *
739
+ * Must be used within a component tree that has the Uploadista plugin installed.
740
+ *
741
+ * @param options - Multi-upload configuration and event handlers
742
+ * @returns Multi-upload state and control methods
743
+ *
744
+ * @example
745
+ * ```vue
746
+ * <script setup lang="ts">
747
+ * import { useMultiUpload } from '@uploadista/vue';
748
+ *
749
+ * const multiUpload = useMultiUpload({
750
+ * maxConcurrent: 3,
751
+ * onUploadSuccess: (item, result) => {
752
+ * console.log(`${item.file.name} uploaded successfully`);
753
+ * },
754
+ * onComplete: (results) => {
755
+ * console.log(`Upload batch complete: ${results.successful.length}/${results.total} successful`);
756
+ * },
757
+ * });
758
+ *
759
+ * const handleFileChange = (event: Event) => {
760
+ * const files = (event.target as HTMLInputElement).files;
761
+ * if (files) {
762
+ * multiUpload.addFiles(Array.from(files));
763
+ * }
764
+ * };
765
+ * </script>
766
+ *
767
+ * <template>
768
+ * <div>
769
+ * <input type="file" multiple @change="handleFileChange" />
770
+ *
771
+ * <div>Progress: {{ multiUpload.state.progress }}%</div>
772
+ * <div>
773
+ * {{ multiUpload.state.uploading }} uploading,
774
+ * {{ multiUpload.state.successful }} successful,
775
+ * {{ multiUpload.state.failed }} failed
776
+ * </div>
777
+ *
778
+ * <button @click="multiUpload.startAll" :disabled="multiUpload.state.isUploading">
779
+ * Start All
780
+ * </button>
781
+ * <button @click="multiUpload.abortAll" :disabled="!multiUpload.state.isUploading">
782
+ * Abort All
783
+ * </button>
784
+ * <button @click="multiUpload.retryFailed" :disabled="multiUpload.state.failed === 0">
785
+ * Retry Failed
786
+ * </button>
787
+ *
788
+ * <div v-for="item in multiUpload.items" :key="item.id">
789
+ * {{ item.file.name }}: {{ item.state.status }} ({{ item.state.progress }}%)
790
+ * </div>
791
+ * </div>
792
+ * </template>
793
+ * ```
794
+ */
795
+ declare function useMultiUpload(options?: MultiUploadOptions): {
796
+ state: Readonly<vue1.Ref<{
797
+ readonly total: number;
798
+ readonly completed: number;
799
+ readonly successful: number;
800
+ readonly failed: number;
801
+ readonly uploading: number;
802
+ readonly progress: number;
803
+ readonly totalBytesUploaded: number;
804
+ readonly totalBytes: number;
805
+ readonly isUploading: boolean;
806
+ readonly isComplete: boolean;
807
+ }, {
808
+ readonly total: number;
809
+ readonly completed: number;
810
+ readonly successful: number;
811
+ readonly failed: number;
812
+ readonly uploading: number;
813
+ readonly progress: number;
814
+ readonly totalBytesUploaded: number;
815
+ readonly totalBytes: number;
816
+ readonly isUploading: boolean;
817
+ readonly isComplete: boolean;
818
+ }>>;
819
+ items: Readonly<vue1.Ref<readonly {
820
+ readonly id: string;
821
+ readonly file: {
822
+ readonly lastModified: number;
823
+ readonly name: string;
824
+ readonly webkitRelativePath: string;
825
+ readonly size: number;
826
+ readonly type: string;
827
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
828
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
829
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
830
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
831
+ readonly text: () => Promise<string>;
832
+ } | {
833
+ readonly size: number;
834
+ readonly type: string;
835
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
836
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
837
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
838
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
839
+ readonly text: () => Promise<string>;
840
+ };
841
+ readonly state: {
842
+ readonly status: UploadStatus;
843
+ readonly progress: number;
844
+ readonly bytesUploaded: number;
845
+ readonly totalBytes: number | null;
846
+ readonly error: Error | null;
847
+ readonly result: {
848
+ readonly id: string;
849
+ readonly offset: number;
850
+ readonly storage: {
851
+ readonly id: string;
852
+ readonly type: string;
853
+ readonly path?: string | undefined | undefined;
854
+ readonly uploadId?: string | undefined | undefined;
855
+ readonly bucket?: string | undefined | undefined;
856
+ };
857
+ readonly flow?: {
858
+ readonly flowId: string;
859
+ readonly nodeId: string;
860
+ readonly jobId: string;
861
+ } | undefined;
862
+ readonly size?: number | undefined | undefined;
863
+ readonly metadata?: {
864
+ readonly [x: string]: string | number | boolean;
865
+ } | undefined;
866
+ readonly creationDate?: string | undefined | undefined;
867
+ readonly url?: string | undefined | undefined;
868
+ readonly sizeIsDeferred?: boolean | undefined | undefined;
869
+ readonly checksum?: string | undefined | undefined;
870
+ readonly checksumAlgorithm?: string | undefined | undefined;
871
+ } | null;
872
+ };
873
+ }[], readonly {
874
+ readonly id: string;
875
+ readonly file: {
876
+ readonly lastModified: number;
877
+ readonly name: string;
878
+ readonly webkitRelativePath: string;
879
+ readonly size: number;
880
+ readonly type: string;
881
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
882
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
883
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
884
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
885
+ readonly text: () => Promise<string>;
886
+ } | {
887
+ readonly size: number;
888
+ readonly type: string;
889
+ readonly arrayBuffer: () => Promise<ArrayBuffer>;
890
+ readonly bytes: () => Promise<Uint8Array<ArrayBuffer>>;
891
+ readonly slice: (start?: number, end?: number, contentType?: string) => Blob;
892
+ readonly stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
893
+ readonly text: () => Promise<string>;
894
+ };
895
+ readonly state: {
896
+ readonly status: UploadStatus;
897
+ readonly progress: number;
898
+ readonly bytesUploaded: number;
899
+ readonly totalBytes: number | null;
900
+ readonly error: Error | null;
901
+ readonly result: {
902
+ readonly id: string;
903
+ readonly offset: number;
904
+ readonly storage: {
905
+ readonly id: string;
906
+ readonly type: string;
907
+ readonly path?: string | undefined | undefined;
908
+ readonly uploadId?: string | undefined | undefined;
909
+ readonly bucket?: string | undefined | undefined;
910
+ };
911
+ readonly flow?: {
912
+ readonly flowId: string;
913
+ readonly nodeId: string;
914
+ readonly jobId: string;
915
+ } | undefined;
916
+ readonly size?: number | undefined | undefined;
917
+ readonly metadata?: {
918
+ readonly [x: string]: string | number | boolean;
919
+ } | undefined;
920
+ readonly creationDate?: string | undefined | undefined;
921
+ readonly url?: string | undefined | undefined;
922
+ readonly sizeIsDeferred?: boolean | undefined | undefined;
923
+ readonly checksum?: string | undefined | undefined;
924
+ readonly checksumAlgorithm?: string | undefined | undefined;
925
+ } | null;
926
+ };
927
+ }[]>>;
928
+ addFiles: (files: UploadInput[]) => void;
929
+ removeItem: (id: string) => void;
930
+ removeFile: (id: string) => void;
931
+ startAll: () => void;
932
+ abortUpload: (id: string) => void;
933
+ abortAll: () => void;
934
+ retryUpload: (id: string) => void;
935
+ retryFailed: () => void;
936
+ clearCompleted: () => void;
937
+ clearAll: () => void;
938
+ getItemsByStatus: (status: UploadStatus) => {
939
+ id: string;
940
+ file: {
941
+ readonly lastModified: number;
942
+ readonly name: string;
943
+ readonly webkitRelativePath: string;
944
+ readonly size: number;
945
+ readonly type: string;
946
+ arrayBuffer: () => Promise<ArrayBuffer>;
947
+ bytes: () => Promise<Uint8Array<ArrayBuffer>>;
948
+ slice: (start?: number, end?: number, contentType?: string) => Blob;
949
+ stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
950
+ text: () => Promise<string>;
951
+ } | {
952
+ readonly size: number;
953
+ readonly type: string;
954
+ arrayBuffer: () => Promise<ArrayBuffer>;
955
+ bytes: () => Promise<Uint8Array<ArrayBuffer>>;
956
+ slice: (start?: number, end?: number, contentType?: string) => Blob;
957
+ stream: () => ReadableStream<Uint8Array<ArrayBuffer>>;
958
+ text: () => Promise<string>;
959
+ };
960
+ state: {
961
+ status: UploadStatus;
962
+ progress: number;
963
+ bytesUploaded: number;
964
+ totalBytes: number | null;
965
+ error: Error | null;
966
+ result: {
967
+ id: string;
968
+ offset: number;
969
+ storage: {
970
+ id: string;
971
+ type: string;
972
+ path?: string | undefined | undefined;
973
+ uploadId?: string | undefined | undefined;
974
+ bucket?: string | undefined | undefined;
975
+ };
976
+ flow?: {
977
+ flowId: string;
978
+ nodeId: string;
979
+ jobId: string;
980
+ } | undefined;
981
+ size?: number | undefined | undefined;
982
+ metadata?: Record<string, string | number | boolean> | undefined;
983
+ creationDate?: string | undefined | undefined;
984
+ url?: string | undefined | undefined;
985
+ sizeIsDeferred?: boolean | undefined | undefined;
986
+ checksum?: string | undefined | undefined;
987
+ checksumAlgorithm?: string | undefined | undefined;
988
+ } | null;
989
+ };
990
+ }[];
991
+ metrics: UploadMetrics;
992
+ };
993
+ //#endregion
994
+ //#region src/composables/useUploadistaClient.d.ts
995
+ /**
996
+ * Access the Uploadista client instance from the plugin or provider.
997
+ * Must be used within a component tree that has the Uploadista plugin or provider installed.
998
+ *
999
+ * @returns Uploadista client instance with event subscription
1000
+ * @throws Error if used outside of Uploadista plugin/provider context
1001
+ *
1002
+ * @example
1003
+ * ```vue
1004
+ * <script setup lang="ts">
1005
+ * import { useUploadistaClient } from '@uploadista/vue';
1006
+ *
1007
+ * const { client, subscribeToEvents } = useUploadistaClient();
1008
+ *
1009
+ * // Subscribe to all events
1010
+ * const unsubscribe = subscribeToEvents((event) => {
1011
+ * console.log('Upload event:', event);
1012
+ * });
1013
+ *
1014
+ * // Clean up on unmount
1015
+ * onUnmounted(() => {
1016
+ * unsubscribe();
1017
+ * });
1018
+ * </script>
1019
+ * ```
1020
+ */
1021
+ declare function useUploadistaClient(): {
1022
+ client: {
1023
+ upload: (file: _uploadista_client_browser0.BrowserUploadInput, {
1024
+ uploadLengthDeferred,
1025
+ uploadSize,
1026
+ onProgress,
1027
+ onChunkComplete,
1028
+ onSuccess,
1029
+ onShouldRetry,
1030
+ onError
1031
+ }?: _uploadista_client_core0.UploadistaUploadOptions) => Promise<{
1032
+ abort: () => void;
1033
+ }>;
1034
+ uploadWithFlow: (file: _uploadista_client_browser0.BrowserUploadInput, flowConfig: _uploadista_client_core0.FlowUploadConfig, {
1035
+ onProgress,
1036
+ onChunkComplete,
1037
+ onSuccess,
1038
+ onShouldRetry,
1039
+ onJobStart,
1040
+ onError
1041
+ }?: Omit<_uploadista_client_core0.UploadistaUploadOptions, "uploadLengthDeferred" | "uploadSize" | "metadata">) => Promise<{
1042
+ abort: () => void;
1043
+ jobId: string;
1044
+ }>;
1045
+ abort: (params: Parameters<({
1046
+ uploadId,
1047
+ uploadIdStorageKey,
1048
+ retryTimeout,
1049
+ shouldTerminate,
1050
+ abortController,
1051
+ uploadistaApi,
1052
+ platformService,
1053
+ retryDelays,
1054
+ clientStorage
1055
+ }: {
1056
+ uploadId: string;
1057
+ uploadIdStorageKey: string | undefined;
1058
+ retryTimeout: _uploadista_client_core0.Timeout | null;
1059
+ shouldTerminate: boolean;
1060
+ abortController: _uploadista_client_core0.AbortControllerLike;
1061
+ uploadistaApi: _uploadista_client_core0.UploadistaApi;
1062
+ platformService: _uploadista_client_core0.PlatformService;
1063
+ retryDelays?: number[];
1064
+ clientStorage: _uploadista_client_core0.ClientStorage;
1065
+ }) => Promise<void>>[0]) => Promise<void>;
1066
+ getFlow: (flowId: string) => Promise<{
1067
+ status: number;
1068
+ flow: _uploadista_core0.FlowData;
1069
+ }>;
1070
+ runFlow: ({
1071
+ flowId,
1072
+ inputs,
1073
+ storageId: flowStorageId
1074
+ }: {
1075
+ flowId: string;
1076
+ inputs: Record<string, unknown>;
1077
+ storageId?: string;
1078
+ }) => Promise<{
1079
+ status: number;
1080
+ job: _uploadista_core0.FlowJob;
1081
+ }>;
1082
+ continueFlow: ({
1083
+ jobId,
1084
+ nodeId,
1085
+ newData,
1086
+ contentType
1087
+ }: {
1088
+ jobId: string;
1089
+ nodeId: string;
1090
+ newData: unknown;
1091
+ contentType?: "application/json" | "application/octet-stream";
1092
+ }) => Promise<_uploadista_core0.FlowJob>;
1093
+ getJobStatus: (jobId: string) => Promise<_uploadista_core0.FlowJob>;
1094
+ openUploadWebSocket: (uploadId: string) => Promise<_uploadista_client_core0.WebSocketLike>;
1095
+ openFlowWebSocket: (jobId: string) => Promise<_uploadista_client_core0.WebSocketLike>;
1096
+ openWebSocket: (id: string) => Promise<_uploadista_client_core0.WebSocketLike>;
1097
+ closeWebSocket: (id: string) => void;
1098
+ closeAllWebSockets: () => void;
1099
+ sendPing: (jobId: string) => boolean;
1100
+ isWebSocketConnected: (id: string) => boolean;
1101
+ getWebSocketConnectionCount: () => number;
1102
+ getWebSocketConnectionCountByType: () => {
1103
+ upload: number;
1104
+ flow: number;
1105
+ total: number;
1106
+ };
1107
+ getNetworkMetrics: () => _uploadista_client_core0.NetworkMetrics;
1108
+ getNetworkCondition: () => _uploadista_client_core0.NetworkCondition;
1109
+ getChunkingInsights: () => _uploadista_client_core0.PerformanceInsights;
1110
+ exportMetrics: () => {
1111
+ session: Partial<_uploadista_client_core0.UploadSessionMetrics>;
1112
+ chunks: _uploadista_client_core0.ChunkMetrics[];
1113
+ insights: _uploadista_client_core0.PerformanceInsights;
1114
+ };
1115
+ getConnectionMetrics: () => _uploadista_client_core0.ConnectionMetrics;
1116
+ getDetailedConnectionMetrics: () => _uploadista_client_core0.DetailedConnectionMetrics;
1117
+ warmupConnections: (urls: string[]) => Promise<void>;
1118
+ getConnectionPoolingInsights: () => Promise<{
1119
+ isOptimized: boolean;
1120
+ reuseRate: number;
1121
+ recommendedMinChunkSize: number;
1122
+ connectionOverhead: number;
1123
+ }>;
1124
+ resetMetrics: () => Promise<void>;
1125
+ validateConfiguration: (options: _uploadista_client_core0.UploadistaClientOptions<_uploadista_client_browser0.BrowserUploadInput>) => {
1126
+ valid: boolean;
1127
+ errors: string[];
1128
+ warnings: string[];
1129
+ };
1130
+ validateConfigurationAsync: (options: _uploadista_client_core0.UploadistaClientOptions<_uploadista_client_browser0.BrowserUploadInput>) => Promise<{
1131
+ valid: boolean;
1132
+ errors: string[];
1133
+ warnings: string[];
1134
+ capabilities: _uploadista_core0.DataStoreCapabilities;
1135
+ }>;
1136
+ getCapabilities: () => Promise<_uploadista_core0.DataStoreCapabilities>;
1137
+ };
1138
+ subscribeToEvents: (handler: (event: UploadistaEvent) => void) => () => void;
1139
+ };
1140
+ type UseUploadistaClientReturn = ReturnType<typeof useUploadistaClient>;
1141
+ //#endregion
1142
+ //#region src/composables/useUploadMetrics.d.ts
1143
+ type ChunkMetrics$1 = any;
1144
+ type PerformanceInsights$1 = any;
1145
+ type UploadSessionMetrics$1 = any;
1146
+ interface UploadMetrics$1 {
1147
+ /**
1148
+ * Total bytes uploaded across all files
1149
+ */
1150
+ totalBytesUploaded: number;
1151
+ /**
1152
+ * Total bytes to upload across all files
1153
+ */
1154
+ totalBytes: number;
1155
+ /**
1156
+ * Overall upload speed in bytes per second
1157
+ */
1158
+ averageSpeed: number;
1159
+ /**
1160
+ * Current upload speed in bytes per second
1161
+ */
1162
+ currentSpeed: number;
1163
+ /**
1164
+ * Estimated time remaining in milliseconds
1165
+ */
1166
+ estimatedTimeRemaining: number | null;
1167
+ /**
1168
+ * Total number of files being tracked
1169
+ */
1170
+ totalFiles: number;
1171
+ /**
1172
+ * Number of files completed
1173
+ */
1174
+ completedFiles: number;
1175
+ /**
1176
+ * Number of files currently uploading
1177
+ */
1178
+ activeUploads: number;
1179
+ /**
1180
+ * Overall progress as percentage (0-100)
1181
+ */
1182
+ progress: number;
1183
+ /**
1184
+ * Peak upload speed achieved
1185
+ */
1186
+ peakSpeed: number;
1187
+ /**
1188
+ * Start time of the first upload
1189
+ */
1190
+ startTime: number | null;
1191
+ /**
1192
+ * End time of the last completed upload
1193
+ */
1194
+ endTime: number | null;
1195
+ /**
1196
+ * Total duration of all uploads
1197
+ */
1198
+ totalDuration: number | null;
1199
+ /**
1200
+ * Detailed performance insights from the upload client
1201
+ */
1202
+ insights: PerformanceInsights$1;
1203
+ /**
1204
+ * Session metrics for completed uploads
1205
+ */
1206
+ sessionMetrics: Partial<UploadSessionMetrics$1>[];
1207
+ /**
1208
+ * Detailed chunk metrics from recent uploads
1209
+ */
1210
+ chunkMetrics: ChunkMetrics$1[];
1211
+ }
1212
+ interface FileUploadMetrics {
1213
+ id: string;
1214
+ filename: string;
1215
+ size: number;
1216
+ bytesUploaded: number;
1217
+ progress: number;
1218
+ speed: number;
1219
+ startTime: number;
1220
+ endTime: number | null;
1221
+ duration: number | null;
1222
+ isComplete: boolean;
1223
+ }
1224
+ interface UseUploadMetricsOptions {
1225
+ /**
1226
+ * Interval for calculating current speed (in milliseconds)
1227
+ */
1228
+ speedCalculationInterval?: number;
1229
+ /**
1230
+ * Number of speed samples to keep for average calculation
1231
+ */
1232
+ speedSampleSize?: number;
1233
+ /**
1234
+ * Called when metrics are updated
1235
+ */
1236
+ onMetricsUpdate?: (metrics: UploadMetrics$1) => void;
1237
+ /**
1238
+ * Called when a file upload starts
1239
+ */
1240
+ onFileStart?: (fileMetrics: FileUploadMetrics) => void;
1241
+ /**
1242
+ * Called when a file upload progresses
1243
+ */
1244
+ onFileProgress?: (fileMetrics: FileUploadMetrics) => void;
1245
+ /**
1246
+ * Called when a file upload completes
1247
+ */
1248
+ onFileComplete?: (fileMetrics: FileUploadMetrics) => void;
1249
+ }
1250
+ /**
1251
+ * Vue composable for tracking detailed upload metrics and performance statistics.
1252
+ * Provides comprehensive monitoring of upload progress, speed, and timing data.
1253
+ *
1254
+ * @param options - Configuration and event handlers
1255
+ * @returns Upload metrics state and control methods
1256
+ *
1257
+ * @example
1258
+ * ```vue
1259
+ * <script setup lang="ts">
1260
+ * import { useUploadMetrics } from '@uploadista/vue';
1261
+ *
1262
+ * const uploadMetrics = useUploadMetrics({
1263
+ * speedCalculationInterval: 1000, // Update speed every second
1264
+ * speedSampleSize: 10, // Keep last 10 speed samples for average
1265
+ * onMetricsUpdate: (metrics) => {
1266
+ * console.log(`Overall progress: ${metrics.progress}%`);
1267
+ * console.log(`Speed: ${(metrics.currentSpeed / 1024).toFixed(1)} KB/s`);
1268
+ * console.log(`ETA: ${metrics.estimatedTimeRemaining}ms`);
1269
+ * },
1270
+ * onFileComplete: (fileMetrics) => {
1271
+ * console.log(`${fileMetrics.filename} completed in ${fileMetrics.duration}ms`);
1272
+ * },
1273
+ * });
1274
+ *
1275
+ * // Start tracking a file
1276
+ * const handleFileStart = (file: File) => {
1277
+ * uploadMetrics.startFileUpload(file.name, file.name, file.size);
1278
+ * };
1279
+ *
1280
+ * // Update progress during upload
1281
+ * const handleProgress = (fileId: string, bytesUploaded: number) => {
1282
+ * uploadMetrics.updateFileProgress(fileId, bytesUploaded);
1283
+ * };
1284
+ * </script>
1285
+ *
1286
+ * <template>
1287
+ * <div>
1288
+ * <div>Overall Progress: {{ uploadMetrics.metrics.progress }}%</div>
1289
+ * <div>Speed: {{ (uploadMetrics.metrics.currentSpeed / 1024).toFixed(1) }} KB/s</div>
1290
+ * <div>Files: {{ uploadMetrics.metrics.completedFiles }}/{{ uploadMetrics.metrics.totalFiles }}</div>
1291
+ *
1292
+ * <div v-if="uploadMetrics.metrics.estimatedTimeRemaining">
1293
+ * ETA: {{ Math.round(uploadMetrics.metrics.estimatedTimeRemaining / 1000) }}s
1294
+ * </div>
1295
+ *
1296
+ * <div v-for="file in uploadMetrics.fileMetrics" :key="file.id">
1297
+ * {{ file.filename }}: {{ file.progress }}% ({{ (file.speed / 1024).toFixed(1) }} KB/s)
1298
+ * </div>
1299
+ * </div>
1300
+ * </template>
1301
+ * ```
1302
+ */
1303
+ declare function useUploadMetrics(options?: UseUploadMetricsOptions): {
1304
+ metrics: Readonly<vue1.Ref<{
1305
+ readonly totalBytesUploaded: number;
1306
+ readonly totalBytes: number;
1307
+ readonly averageSpeed: number;
1308
+ readonly currentSpeed: number;
1309
+ readonly estimatedTimeRemaining: number | null;
1310
+ readonly totalFiles: number;
1311
+ readonly completedFiles: number;
1312
+ readonly activeUploads: number;
1313
+ readonly progress: number;
1314
+ readonly peakSpeed: number;
1315
+ readonly startTime: number | null;
1316
+ readonly endTime: number | null;
1317
+ readonly totalDuration: number | null;
1318
+ readonly insights: PerformanceInsights$1;
1319
+ readonly sessionMetrics: readonly {
1320
+ readonly [x: string]: any;
1321
+ }[];
1322
+ readonly chunkMetrics: readonly any[];
1323
+ }, {
1324
+ readonly totalBytesUploaded: number;
1325
+ readonly totalBytes: number;
1326
+ readonly averageSpeed: number;
1327
+ readonly currentSpeed: number;
1328
+ readonly estimatedTimeRemaining: number | null;
1329
+ readonly totalFiles: number;
1330
+ readonly completedFiles: number;
1331
+ readonly activeUploads: number;
1332
+ readonly progress: number;
1333
+ readonly peakSpeed: number;
1334
+ readonly startTime: number | null;
1335
+ readonly endTime: number | null;
1336
+ readonly totalDuration: number | null;
1337
+ readonly insights: PerformanceInsights$1;
1338
+ readonly sessionMetrics: readonly {
1339
+ readonly [x: string]: any;
1340
+ }[];
1341
+ readonly chunkMetrics: readonly any[];
1342
+ }>>;
1343
+ fileMetrics: Readonly<vue1.Ref<readonly {
1344
+ readonly id: string;
1345
+ readonly filename: string;
1346
+ readonly size: number;
1347
+ readonly bytesUploaded: number;
1348
+ readonly progress: number;
1349
+ readonly speed: number;
1350
+ readonly startTime: number;
1351
+ readonly endTime: number | null;
1352
+ readonly duration: number | null;
1353
+ readonly isComplete: boolean;
1354
+ }[], readonly {
1355
+ readonly id: string;
1356
+ readonly filename: string;
1357
+ readonly size: number;
1358
+ readonly bytesUploaded: number;
1359
+ readonly progress: number;
1360
+ readonly speed: number;
1361
+ readonly startTime: number;
1362
+ readonly endTime: number | null;
1363
+ readonly duration: number | null;
1364
+ readonly isComplete: boolean;
1365
+ }[]>>;
1366
+ startFileUpload: (id: string, filename: string, size: number) => void;
1367
+ updateFileProgress: (id: string, bytesUploaded: number) => void;
1368
+ completeFileUpload: (id: string) => void;
1369
+ removeFile: (id: string) => void;
1370
+ reset: () => void;
1371
+ getFileMetrics: (id: string) => {
1372
+ id: string;
1373
+ filename: string;
1374
+ size: number;
1375
+ bytesUploaded: number;
1376
+ progress: number;
1377
+ speed: number;
1378
+ startTime: number;
1379
+ endTime: number | null;
1380
+ duration: number | null;
1381
+ isComplete: boolean;
1382
+ } | undefined;
1383
+ exportMetrics: () => {
1384
+ overall: {
1385
+ totalBytesUploaded: number;
1386
+ totalBytes: number;
1387
+ averageSpeed: number;
1388
+ currentSpeed: number;
1389
+ estimatedTimeRemaining: number | null;
1390
+ totalFiles: number;
1391
+ completedFiles: number;
1392
+ activeUploads: number;
1393
+ progress: number;
1394
+ peakSpeed: number;
1395
+ startTime: number | null;
1396
+ endTime: number | null;
1397
+ totalDuration: number | null;
1398
+ insights: PerformanceInsights$1;
1399
+ sessionMetrics: Partial<UploadSessionMetrics$1>[];
1400
+ chunkMetrics: ChunkMetrics$1[];
1401
+ };
1402
+ files: {
1403
+ id: string;
1404
+ filename: string;
1405
+ size: number;
1406
+ bytesUploaded: number;
1407
+ progress: number;
1408
+ speed: number;
1409
+ startTime: number;
1410
+ endTime: number | null;
1411
+ duration: number | null;
1412
+ isComplete: boolean;
1413
+ }[];
1414
+ exportTime: number;
1415
+ };
1416
+ };
1417
+ //#endregion
1418
+ export { DragDropState as C, UploadistaPluginOptions as D, UPLOADISTA_EVENT_SUBSCRIBERS_KEY as E, createUploadistaPlugin as O, DragDropOptions as S, UPLOADISTA_CLIENT_KEY as T, useUpload as _, useUploadistaClient as a, FlowUploadStatus as b, UploadItem as c, PerformanceInsights as d, UploadInput as f, UploadStatus as g, UploadState as h, UseUploadistaClientReturn as i, useMultiUpload as l, UploadSessionMetrics as m, UseUploadMetricsOptions as n, MultiUploadOptions as o, UploadMetrics as p, useUploadMetrics as r, MultiUploadState as s, FileUploadMetrics as t, ChunkMetrics as u, useMultiFlowUpload as v, useDragDrop as w, useFlowUpload as x, FlowUploadState as y };
1419
+ //# sourceMappingURL=index-DgHJHePD.d.mts.map