nuxt-upload-kit 0.1.24 → 0.1.25
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/module.json +1 -1
- package/dist/runtime/composables/useUploadKit/file-operations.js +1 -1
- package/dist/runtime/composables/useUploadKit/index.js +6 -20
- package/dist/runtime/composables/useUploadKit/plugin-runner.d.ts +2 -1
- package/dist/runtime/composables/useUploadKit/plugin-runner.js +3 -1
- package/dist/runtime/composables/useUploadKit/plugins/thumbnail-generator.d.ts +1 -0
- package/dist/runtime/composables/useUploadKit/plugins/thumbnail-generator.js +19 -1
- package/dist/runtime/composables/useUploadKit/types.d.ts +5 -0
- package/dist/runtime/composables/useUploadKit/utils.d.ts +2 -2
- package/dist/runtime/composables/useUploadKit/utils.js +2 -1
- package/package.json +3 -3
package/dist/module.json
CHANGED
|
@@ -117,7 +117,7 @@ export function createFileOperations(deps) {
|
|
|
117
117
|
const storagePlugin = getStoragePlugin();
|
|
118
118
|
if (storagePlugin?.hooks.remove) {
|
|
119
119
|
try {
|
|
120
|
-
const context = createPluginContext(storagePlugin.id, files.value, options, emitter);
|
|
120
|
+
const context = createPluginContext(storagePlugin.id, files.value, options, emitter, storagePlugin);
|
|
121
121
|
await storagePlugin.hooks.remove(file, context);
|
|
122
122
|
} catch (error) {
|
|
123
123
|
console.error(`Storage plugin remove error:`, error);
|
|
@@ -2,7 +2,7 @@ import mitt from "mitt";
|
|
|
2
2
|
import { computed, onBeforeUnmount, readonly, ref } from "vue";
|
|
3
3
|
import { ValidatorAllowedFileTypes, ValidatorMaxFileSize, ValidatorMaxFiles } from "./validators/index.js";
|
|
4
4
|
import { PluginThumbnailGenerator, PluginImageCompressor } from "./plugins/index.js";
|
|
5
|
-
import { createPluginContext, createFileError, getExtension, setupInitialFiles
|
|
5
|
+
import { createPluginContext, createFileError, getExtension, setupInitialFiles } from "./utils.js";
|
|
6
6
|
import { createPluginRunner } from "./plugin-runner.js";
|
|
7
7
|
import { createFileOperations } from "./file-operations.js";
|
|
8
8
|
const defaultOptions = {
|
|
@@ -48,7 +48,8 @@ export const useUploadKit = (_options = {}) => {
|
|
|
48
48
|
PluginThumbnailGenerator({
|
|
49
49
|
maxWidth: thumbOpts.width ?? 128,
|
|
50
50
|
maxHeight: thumbOpts.height ?? 128,
|
|
51
|
-
quality: thumbOpts.quality ?? 1
|
|
51
|
+
quality: thumbOpts.quality ?? 1,
|
|
52
|
+
upload: thumbOpts.upload ?? false
|
|
52
53
|
})
|
|
53
54
|
);
|
|
54
55
|
}
|
|
@@ -65,8 +66,7 @@ export const useUploadKit = (_options = {}) => {
|
|
|
65
66
|
})
|
|
66
67
|
);
|
|
67
68
|
}
|
|
68
|
-
const
|
|
69
|
-
const { getPluginEmitFn, runPluginStage } = createPluginRunner({ options, files, emitter });
|
|
69
|
+
const { getPluginEmitFn, runPluginStage } = createPluginRunner({ options, files, emitter, getStoragePlugin });
|
|
70
70
|
const uploadHolder = { fn: async () => {
|
|
71
71
|
} };
|
|
72
72
|
const fileOps = createFileOperations({
|
|
@@ -101,7 +101,7 @@ export const useUploadKit = (_options = {}) => {
|
|
|
101
101
|
if (!storagePlugin?.hooks.getRemoteFile) {
|
|
102
102
|
throw new Error("Storage plugin with getRemoteFile hook is required to initialize existing files");
|
|
103
103
|
}
|
|
104
|
-
const context = createPluginContext(storagePlugin.id, files.value, options, emitter);
|
|
104
|
+
const context = createPluginContext(storagePlugin.id, files.value, options, emitter, storagePlugin);
|
|
105
105
|
const remoteFileData = await storagePlugin.hooks.getRemoteFile(storageKey, context);
|
|
106
106
|
const id = `${Date.now()}-${Math.random().toString(36).slice(2)}`;
|
|
107
107
|
const name = storageKey.split("/").pop() || storageKey;
|
|
@@ -206,21 +206,7 @@ export const useUploadKit = (_options = {}) => {
|
|
|
206
206
|
const currentFile = files.value.find((f) => f.id === processedFile.id);
|
|
207
207
|
const preview = currentFile?.preview || remoteUrl;
|
|
208
208
|
const storageKey = extractStorageKey(uploadResult);
|
|
209
|
-
|
|
210
|
-
if (shouldUploadThumbnails && currentFile?.preview?.startsWith("data:")) {
|
|
211
|
-
try {
|
|
212
|
-
const thumbnailBlob = dataUrlToBlob(currentFile.preview);
|
|
213
|
-
const thumbnailKey = deriveThumbnailKey(processedFile.id);
|
|
214
|
-
const thumbnailResult = await storagePlugin.upload(thumbnailBlob, thumbnailKey, {
|
|
215
|
-
contentType: thumbnailBlob.type
|
|
216
|
-
});
|
|
217
|
-
thumbnail = { url: thumbnailResult.url, storageKey: thumbnailResult.storageKey };
|
|
218
|
-
} catch (err) {
|
|
219
|
-
if (import.meta.dev) {
|
|
220
|
-
console.warn(`[useUploadKit] Thumbnail upload failed for "${processedFile.name}":`, err);
|
|
221
|
-
}
|
|
222
|
-
}
|
|
223
|
-
}
|
|
209
|
+
const thumbnail = currentFile?.thumbnail;
|
|
224
210
|
updateFile(processedFile.id, { status: "complete", uploadResult, remoteUrl, preview, storageKey, thumbnail });
|
|
225
211
|
};
|
|
226
212
|
const upload = async () => {
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import type { Ref } from "vue";
|
|
2
2
|
import type { Emitter } from "mitt";
|
|
3
|
-
import type { UploadFile, UploadOptions, PluginLifecycleStage } from "./types.js";
|
|
3
|
+
import type { UploadFile, UploadOptions, PluginLifecycleStage, StoragePlugin } from "./types.js";
|
|
4
4
|
type EmitFn = <K extends string | number | symbol>(event: K, payload: any) => void;
|
|
5
5
|
export interface PluginRunnerDeps<TUploadResult = any> {
|
|
6
6
|
options: UploadOptions;
|
|
7
7
|
files: Ref<UploadFile<TUploadResult>[]>;
|
|
8
8
|
emitter: Emitter<any>;
|
|
9
|
+
getStoragePlugin: () => StoragePlugin<any, any> | null;
|
|
9
10
|
}
|
|
10
11
|
/**
|
|
11
12
|
* Creates the plugin execution system with cached emit functions
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export function createPluginRunner(deps) {
|
|
2
|
-
const { options, files, emitter } = deps;
|
|
2
|
+
const { options, files, emitter, getStoragePlugin } = deps;
|
|
3
3
|
const pluginEmitFunctions = /* @__PURE__ */ new Map();
|
|
4
4
|
const getPluginEmitFn = (pluginId) => {
|
|
5
5
|
let emitFn = pluginEmitFunctions.get(pluginId);
|
|
@@ -34,9 +34,11 @@ export function createPluginRunner(deps) {
|
|
|
34
34
|
const hook = plugin.hooks[stage];
|
|
35
35
|
if (!hook) continue;
|
|
36
36
|
try {
|
|
37
|
+
const storage = getStoragePlugin();
|
|
37
38
|
const context = {
|
|
38
39
|
files: files.value,
|
|
39
40
|
options,
|
|
41
|
+
storage: storage || void 0,
|
|
40
42
|
emit: getPluginEmitFn(plugin.id)
|
|
41
43
|
};
|
|
42
44
|
const result = await callPluginHook(hook, stage, currentFile, context);
|
|
@@ -3,6 +3,7 @@ interface ThumbnailGeneratorOptions {
|
|
|
3
3
|
maxHeight?: number;
|
|
4
4
|
quality?: number;
|
|
5
5
|
videoCaptureTime?: number;
|
|
6
|
+
upload?: boolean;
|
|
6
7
|
}
|
|
7
8
|
export declare const PluginThumbnailGenerator: (options: ThumbnailGeneratorOptions) => import("../types.js").ProcessingPlugin<any, Record<string, never>>;
|
|
8
9
|
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { defineProcessingPlugin } from "../types.js";
|
|
2
|
-
import { calculateThumbnailDimensions } from "../utils.js";
|
|
2
|
+
import { calculateThumbnailDimensions, dataUrlToBlob, deriveThumbnailKey } from "../utils.js";
|
|
3
3
|
export const PluginThumbnailGenerator = defineProcessingPlugin((pluginOptions) => {
|
|
4
4
|
return {
|
|
5
5
|
id: "thumbnail-generator",
|
|
@@ -35,6 +35,24 @@ export const PluginThumbnailGenerator = defineProcessingPlugin((pluginOptions) =
|
|
|
35
35
|
URL.revokeObjectURL(sourceUrl);
|
|
36
36
|
}
|
|
37
37
|
return file;
|
|
38
|
+
},
|
|
39
|
+
process: async (file, context) => {
|
|
40
|
+
const { upload = false } = pluginOptions;
|
|
41
|
+
if (upload && context.storage && file.preview?.startsWith("data:")) {
|
|
42
|
+
try {
|
|
43
|
+
const thumbnailBlob = dataUrlToBlob(file.preview);
|
|
44
|
+
const thumbnailKey = deriveThumbnailKey(file.id);
|
|
45
|
+
const thumbnailResult = await context.storage.upload(thumbnailBlob, thumbnailKey, {
|
|
46
|
+
contentType: thumbnailBlob.type
|
|
47
|
+
});
|
|
48
|
+
file.thumbnail = { url: thumbnailResult.url, storageKey: thumbnailResult.storageKey };
|
|
49
|
+
} catch (err) {
|
|
50
|
+
if (import.meta.dev) {
|
|
51
|
+
console.warn(`[thumbnail-generator] Thumbnail upload failed for "${file.name}":`, err);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
return file;
|
|
38
56
|
}
|
|
39
57
|
}
|
|
40
58
|
};
|
|
@@ -344,6 +344,11 @@ export type UploaderEvents<TUploadResult = any> = CoreUploaderEvents<TUploadResu
|
|
|
344
344
|
export type PluginContext<TPluginEvents extends Record<string, any> = Record<string, never>> = {
|
|
345
345
|
files: UploadFile[];
|
|
346
346
|
options: UploadOptions;
|
|
347
|
+
/**
|
|
348
|
+
* Storage plugin for uploading derivatives (thumbnails, variants, etc.)
|
|
349
|
+
* Available only when a storage plugin is configured
|
|
350
|
+
*/
|
|
351
|
+
storage?: StoragePlugin<any, any>;
|
|
347
352
|
/**
|
|
348
353
|
* Emit custom plugin events
|
|
349
354
|
* Events are automatically prefixed with the plugin ID
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { PluginContext, UploadFile, FileError, UploadOptions, InitialFileInput } from "./types.js";
|
|
1
|
+
import type { PluginContext, UploadFile, FileError, UploadOptions, InitialFileInput, StoragePlugin } from "./types.js";
|
|
2
2
|
import type { Emitter } from "mitt";
|
|
3
3
|
/**
|
|
4
4
|
* Get file extension from filename
|
|
@@ -7,7 +7,7 @@ export declare function getExtension(fullFileName: string): string;
|
|
|
7
7
|
/**
|
|
8
8
|
* Create a plugin context object with consistent structure
|
|
9
9
|
*/
|
|
10
|
-
export declare function createPluginContext<TPluginEvents extends Record<string, any> = Record<string, never>>(pluginId: string, files: UploadFile[], options: UploadOptions, emitter: Emitter<any>): PluginContext<TPluginEvents>;
|
|
10
|
+
export declare function createPluginContext<TPluginEvents extends Record<string, any> = Record<string, never>>(pluginId: string, files: UploadFile[], options: UploadOptions, emitter: Emitter<any>, storage?: StoragePlugin<any, any>): PluginContext<TPluginEvents>;
|
|
11
11
|
/**
|
|
12
12
|
* Create a consistent file error object
|
|
13
13
|
*/
|
|
@@ -6,10 +6,11 @@ export function getExtension(fullFileName) {
|
|
|
6
6
|
}
|
|
7
7
|
return fullFileName.slice(lastDot + 1).toLocaleLowerCase();
|
|
8
8
|
}
|
|
9
|
-
export function createPluginContext(pluginId, files, options, emitter) {
|
|
9
|
+
export function createPluginContext(pluginId, files, options, emitter, storage) {
|
|
10
10
|
return {
|
|
11
11
|
files,
|
|
12
12
|
options,
|
|
13
|
+
storage,
|
|
13
14
|
emit: (event, payload) => {
|
|
14
15
|
const prefixedEvent = `${pluginId}:${String(event)}`;
|
|
15
16
|
emitter.emit(prefixedEvent, payload);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "nuxt-upload-kit",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.25",
|
|
4
4
|
"description": "A powerful, plugin-based file upload manager for Nuxt applications",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": "https://github.com/genu/nuxt-upload-kit.git",
|
|
@@ -53,8 +53,8 @@
|
|
|
53
53
|
"mitt": "3.0.1"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
|
-
"@aws-sdk/client-s3": "3.
|
|
57
|
-
"@aws-sdk/lib-storage": "3.
|
|
56
|
+
"@aws-sdk/client-s3": "3.989.0",
|
|
57
|
+
"@aws-sdk/lib-storage": "3.989.0",
|
|
58
58
|
"@azure/storage-file-datalake": "12.29.0",
|
|
59
59
|
"@ffmpeg/ffmpeg": "0.12.15",
|
|
60
60
|
"@ffmpeg/util": "0.12.2",
|