@windwalker-io/unicorn-next 0.1.4 → 0.1.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.
- package/.editorconfig +18 -18
- package/.gulp.json +7 -7
- package/bin/release.mjs +47 -47
- package/dist/chunks/button-radio.js.map +1 -1
- package/dist/chunks/checkboxes-multi-select.js.map +1 -1
- package/dist/chunks/field-cascade-select.js.map +1 -1
- package/dist/chunks/field-file-drag.js.map +1 -1
- package/dist/chunks/field-flatpickr.js.map +1 -1
- package/dist/chunks/field-modal-select.js.map +1 -1
- package/dist/chunks/field-modal-tree.js +2 -2
- package/dist/chunks/field-modal-tree.js.map +1 -1
- package/dist/chunks/field-multi-uploader.js.map +1 -1
- package/dist/chunks/field-repeatable.js.map +1 -1
- package/dist/chunks/field-single-image-drag.js.map +1 -1
- package/dist/chunks/form.js.map +1 -1
- package/dist/chunks/grid.js.map +1 -1
- package/dist/chunks/http-client.js.map +1 -1
- package/dist/chunks/iframe-modal.js.map +1 -1
- package/dist/chunks/keep-tab.js.map +1 -1
- package/dist/chunks/legacy.js +2 -2
- package/dist/chunks/legacy.js.map +1 -1
- package/dist/chunks/list-dependent.js.map +1 -1
- package/dist/chunks/s3-multipart-uploader.js.map +1 -1
- package/dist/chunks/s3-uploader.js.map +1 -1
- package/dist/chunks/show-on.js.map +1 -1
- package/dist/chunks/tinymce.js +1 -1
- package/dist/chunks/tinymce.js.map +1 -1
- package/dist/chunks/ui-bootstrap5.js.map +1 -1
- package/dist/chunks/unicorn.js +22 -16
- package/dist/chunks/unicorn.js.map +1 -1
- package/dist/chunks/validation.js +1 -1
- package/dist/chunks/validation.js.map +1 -1
- package/dist/index.d.ts +39 -30
- package/dist/unicorn.js +11 -9
- package/fusionfile.mjs +155 -155
- package/package.json +103 -103
- package/scss/bootstrap/multi-level-menu.scss +121 -121
- package/scss/editor.scss +116 -116
- package/scss/field/file-drag.scss +102 -102
- package/scss/field/single-image-drag.scss +88 -88
- package/scss/field/vue-drag-uploader.scss +160 -160
- package/scss/switcher.scss +156 -156
- package/src/app.ts +128 -128
- package/src/bootstrap/button-radio.ts +208 -208
- package/src/bootstrap/keep-tab.ts +155 -155
- package/src/composable/index.ts +22 -21
- package/src/composable/useCheckboxesMultiSelect.ts +22 -22
- package/src/composable/useFieldCascadeSelect.ts +9 -9
- package/src/composable/useFieldFileDrag.ts +9 -9
- package/src/composable/useFieldFlatpickr.ts +3 -3
- package/src/composable/useFieldModalSelect.ts +6 -6
- package/src/composable/useFieldModalTree.ts +3 -3
- package/src/composable/useFieldMultiUploader.ts +9 -9
- package/src/composable/useFieldRepeatable.ts +9 -9
- package/src/composable/useFieldSingleImageDrag.ts +9 -9
- package/src/composable/useForm.ts +43 -43
- package/src/composable/useGrid.ts +57 -57
- package/src/composable/useHttp.ts +9 -9
- package/src/composable/useIframeModal.ts +10 -10
- package/src/composable/useListDependent.ts +26 -26
- package/src/composable/useQueue.ts +13 -13
- package/src/composable/useS3Uploader.ts +32 -32
- package/src/composable/useShowOn.ts +9 -9
- package/src/composable/useStack.ts +13 -13
- package/src/composable/useTinymce.ts +29 -29
- package/src/composable/useTomSelect.ts +72 -72
- package/src/composable/useUIBootstrap5.ts +48 -48
- package/src/composable/useUniDirective.ts +32 -32
- package/src/composable/useValidation.ts +50 -39
- package/src/data.ts +34 -34
- package/src/events.ts +82 -82
- package/src/legacy/legacy.ts +190 -190
- package/src/legacy/loader.ts +125 -125
- package/src/module/checkboxes-multi-select.ts +54 -54
- package/src/module/field-cascade-select.ts +292 -292
- package/src/module/field-file-drag.ts +295 -295
- package/src/module/field-flatpickr.ts +130 -130
- package/src/module/field-modal-select.ts +179 -179
- package/src/module/field-modal-tree.ts +31 -31
- package/src/module/field-multi-uploader.ts +368 -368
- package/src/module/field-repeatable.ts +202 -202
- package/src/module/field-single-image-drag.ts +475 -475
- package/src/module/form.ts +223 -223
- package/src/module/grid.ts +465 -465
- package/src/module/http-client.ts +248 -248
- package/src/module/iframe-modal.ts +170 -170
- package/src/module/list-dependent.ts +321 -321
- package/src/module/s3-multipart-uploader.ts +300 -300
- package/src/module/s3-uploader.ts +234 -234
- package/src/module/show-on.ts +175 -175
- package/src/module/tinymce.ts +276 -276
- package/src/module/ui-bootstrap5.ts +116 -116
- package/src/module/validation.ts +1046 -1026
- package/src/plugin/index.ts +1 -1
- package/src/plugin/php-adapter.ts +72 -72
- package/src/polyfill/form-request-submit.ts +31 -31
- package/src/polyfill/index.ts +9 -9
- package/src/service/animate.ts +58 -58
- package/src/service/crypto.ts +27 -27
- package/src/service/dom-watcher.ts +62 -62
- package/src/service/dom.ts +265 -265
- package/src/service/helper.ts +48 -48
- package/src/service/index.ts +10 -10
- package/src/service/lang.ts +122 -122
- package/src/service/loader.ts +152 -152
- package/src/service/router.ts +118 -118
- package/src/service/ui.ts +525 -525
- package/src/service/uri.ts +106 -106
- package/src/types/base.ts +9 -9
- package/src/types/index.ts +4 -4
- package/src/types/modal-tree.ts +12 -12
- package/src/types/plugin.ts +6 -6
- package/src/types/shims.d.ts +18 -18
- package/src/types/ui.ts +6 -6
- package/src/unicorn.ts +79 -79
- package/src/utilities/arr.ts +25 -25
- package/src/utilities/base.ts +9 -9
- package/src/utilities/data.ts +48 -48
- package/src/utilities/index.ts +5 -5
- package/src/utilities/tree.ts +20 -20
- package/src/vue/components/ModalTree/ModalTreeApp.vue +175 -175
- package/src/vue/components/ModalTree/TreeItem.vue +262 -262
- package/src/vue/components/ModalTree/TreeModal.vue +225 -225
- package/tests/test.js +4 -4
- package/tsconfig.js.json +25 -25
- package/tsconfig.json +17 -17
- package/vite.assets.config.ts +61 -61
- package/vite.config.test.ts +36 -36
- package/vite.config.ts +112 -112
|
@@ -1,234 +1,234 @@
|
|
|
1
|
-
import { useHttpClient } from '../composable';
|
|
2
|
-
import { data } from '../data';
|
|
3
|
-
import { EventAwareInterface, EventHandler, EventMixin } from '../events';
|
|
4
|
-
import type { UnicornHttpClient } from './http-client';
|
|
5
|
-
import { mergeDeep } from '../utilities';
|
|
6
|
-
import { AxiosProgressEvent, AxiosResponse } from 'axios';
|
|
7
|
-
import { Mixin } from 'ts-mixer';
|
|
8
|
-
|
|
9
|
-
const instances: Record<string, S3Uploader> = {};
|
|
10
|
-
export function get(name: string, options?: Partial<S3UploaderGlobalOptions>): S3Uploader;
|
|
11
|
-
export function get(
|
|
12
|
-
name: string,
|
|
13
|
-
options: Partial<S3UploaderGlobalOptions> = {}
|
|
14
|
-
): S3Uploader | void {
|
|
15
|
-
return instances[name] ??= create(name, options);
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export function create(name: string, options: Partial<S3UploaderGlobalOptions> = {}): S3Uploader {
|
|
19
|
-
return new S3Uploader(name, options);
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export function destroy(name: string) {
|
|
23
|
-
delete instances[name];
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
const defaultOptions: S3UploaderGlobalOptions = {
|
|
27
|
-
endpoint: '',
|
|
28
|
-
subfolder: '',
|
|
29
|
-
viewerHost: '',
|
|
30
|
-
starts_with: [],
|
|
31
|
-
formInputs: {
|
|
32
|
-
acl: '',
|
|
33
|
-
bucket: '',
|
|
34
|
-
key: '',
|
|
35
|
-
Policy: '',
|
|
36
|
-
'X-Amz-Algorithm': '',
|
|
37
|
-
'X-Amz-Credential': '',
|
|
38
|
-
'X-Amz-Date': '',
|
|
39
|
-
'X-Amz-Signature': '',
|
|
40
|
-
}
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
export class S3Uploader extends Mixin(EventMixin) implements EventAwareInterface {
|
|
44
|
-
options: S3UploaderGlobalOptions;
|
|
45
|
-
http?: UnicornHttpClient;
|
|
46
|
-
|
|
47
|
-
constructor(protected name: string, options: Partial<S3UploaderGlobalOptions> = {}) {
|
|
48
|
-
super();
|
|
49
|
-
|
|
50
|
-
const awsOptions = data('@s3.uploader.' + name) || {};
|
|
51
|
-
|
|
52
|
-
this.options = mergeDeep<S3UploaderGlobalOptions>({}, defaultOptions, awsOptions, options);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
async getHttpClient() {
|
|
56
|
-
return this.http ??= await useHttpClient();
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Do upload.
|
|
61
|
-
*/
|
|
62
|
-
async upload(
|
|
63
|
-
file: string | File | Blob,
|
|
64
|
-
path: string,
|
|
65
|
-
options: Partial<S3UploaderRequestOptions> = {}
|
|
66
|
-
): Promise<S3UploaderResponse> {
|
|
67
|
-
const httpClient = await this.getHttpClient();
|
|
68
|
-
|
|
69
|
-
const fileData = new FormData();
|
|
70
|
-
const inputs = mergeDeep({}, this.options.formInputs, options.formInputs || {});
|
|
71
|
-
|
|
72
|
-
if (typeof file === 'string') {
|
|
73
|
-
file = new Blob([file], { type: options['Content-Type'] || 'text/plain' });
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
if (file instanceof Blob && path.endsWith('.{ext}')) {
|
|
77
|
-
throw new Error('If using Blob or file data string, you must provide a valid file extension in the path.');
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
if ((file instanceof Blob) || (file as any) instanceof File) {
|
|
81
|
-
options['Content-Type'] = options['Content-Type'] || file.type;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
if (options['filename']) {
|
|
85
|
-
const filename = this.replaceExt(options['filename'], file);
|
|
86
|
-
options['Content-Disposition'] = 'attachment; filename*=UTF-8\'\'' + encodeURIComponent(filename);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
path = this.replaceExt(path, file);
|
|
90
|
-
|
|
91
|
-
options['key'] = trimSlashes(this.options.subfolder || '') + '/'
|
|
92
|
-
+ trimSlashes(path);
|
|
93
|
-
options['key'] = trimSlashes(options['key']);
|
|
94
|
-
options['Content-Type'] = options['Content-Type'] || undefined;
|
|
95
|
-
options['Content-Disposition'] = options['Content-Disposition'] || undefined;
|
|
96
|
-
|
|
97
|
-
// Prepare pre-signed data
|
|
98
|
-
for (let key in inputs) {
|
|
99
|
-
fileData.set(key, inputs[key]);
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
// Prepare custom data
|
|
103
|
-
for (let key of Object.keys(this.options.starts_with)) {
|
|
104
|
-
if (options[key]) {
|
|
105
|
-
fileData.set(key, options[key]);
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
fileData.append('file', file);
|
|
110
|
-
|
|
111
|
-
this.trigger('start', fileData);
|
|
112
|
-
|
|
113
|
-
try {
|
|
114
|
-
let res = await httpClient.post(
|
|
115
|
-
this.options.endpoint || '',
|
|
116
|
-
fileData,
|
|
117
|
-
{
|
|
118
|
-
onUploadProgress: (e) => {
|
|
119
|
-
if (options.onUploadProgress) {
|
|
120
|
-
options.onUploadProgress(e);
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
this.trigger('upload-progress', e);
|
|
124
|
-
|
|
125
|
-
if (e.total != null) {
|
|
126
|
-
this.trigger('progress', e.loaded / e.total, e);
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
) as S3UploaderResponse;
|
|
131
|
-
|
|
132
|
-
const url = this.options.viewerHost + '/'
|
|
133
|
-
+ trimSlashes(path);
|
|
134
|
-
|
|
135
|
-
this.trigger('success', url, res);
|
|
136
|
-
|
|
137
|
-
res.url = url;
|
|
138
|
-
|
|
139
|
-
return res;
|
|
140
|
-
} finally {
|
|
141
|
-
this.trigger('end');
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
replaceExt(path: string, file: File | Blob): string {
|
|
146
|
-
if (file instanceof File) {
|
|
147
|
-
const fileExt = file.name.split('.').pop();
|
|
148
|
-
|
|
149
|
-
if (path.endsWith('.{ext}')) {
|
|
150
|
-
return path.replace(/\.{ext}$/, fileExt ? '.' + fileExt : '');
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
return path;
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
on(event: 'start', handler: StartEventHandler): this;
|
|
158
|
-
on(event: 'success', handler: SuccessEventHandler): this;
|
|
159
|
-
on(event: 'end', handler: EndEventHandler): this;
|
|
160
|
-
on(event: 'upload-progress', handler: UploadProgressEventHandler): this;
|
|
161
|
-
on(event: 'progress', handler: ProgressEventHandler): this;
|
|
162
|
-
on(event: string | string[], handler: EventHandler): this {
|
|
163
|
-
return super.on(event, handler);
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
onStart(handler: StartEventHandler): this {
|
|
167
|
-
return this.on('start', handler);
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
onSuccess(handler: SuccessEventHandler): this {
|
|
171
|
-
return this.on('success', handler);
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
onEnd(handler: EndEventHandler): this {
|
|
175
|
-
return this.on('end', handler);
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
onProgress(handler: UploadProgressEventHandler): this {
|
|
179
|
-
return this.on('upload-progress', handler);
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
onProgressWithTotal(handler: ProgressEventHandler): this {
|
|
183
|
-
return this.on('progress', handler);
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
type EndEventHandler = () => void;
|
|
188
|
-
type SuccessEventHandler = (url: string, res: S3UploaderResponse) => void;
|
|
189
|
-
type StartEventHandler = (fileData: FormData) => void;
|
|
190
|
-
type UploadProgressEventHandler = (e: AxiosProgressEvent) => void;
|
|
191
|
-
type ProgressEventHandler = (total: number, e: AxiosProgressEvent) => void;
|
|
192
|
-
|
|
193
|
-
function trimSlashes(str: string) {
|
|
194
|
-
return str.replace(/^\/+|\/+$/g, '');
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
export interface S3UploaderResponse extends AxiosResponse {
|
|
198
|
-
url: string;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
export interface S3UploaderGlobalOptions {
|
|
202
|
-
endpoint?: string;
|
|
203
|
-
subfolder?: string;
|
|
204
|
-
viewerHost?: string;
|
|
205
|
-
starts_with: any[];
|
|
206
|
-
formInputs?: {
|
|
207
|
-
acl: string;
|
|
208
|
-
bucket: string;
|
|
209
|
-
key: string;
|
|
210
|
-
Policy: string;
|
|
211
|
-
'X-Amz-Algorithm': string;
|
|
212
|
-
'X-Amz-Credential': string;
|
|
213
|
-
'X-Amz-Date': string;
|
|
214
|
-
'X-Amz-Signature': string;
|
|
215
|
-
[name: string]: any
|
|
216
|
-
},
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
export interface S3UploaderRequestOptions {
|
|
220
|
-
formInputs?: { [name: string]: any };
|
|
221
|
-
onUploadProgress?: (e: AxiosProgressEvent) => void;
|
|
222
|
-
'Content-Type'?: string;
|
|
223
|
-
'Content-Disposition'?: string;
|
|
224
|
-
key?: string;
|
|
225
|
-
|
|
226
|
-
[name: string]: any;
|
|
227
|
-
}
|
|
228
|
-
|
|
229
|
-
export interface S3UploaderModule {
|
|
230
|
-
get(name: string, options?: Partial<S3UploaderGlobalOptions>): S3Uploader;
|
|
231
|
-
create(name: string, options?: Partial<S3UploaderGlobalOptions>): S3Uploader;
|
|
232
|
-
destroy(name: string): void;
|
|
233
|
-
S3Uploader: typeof S3Uploader;
|
|
234
|
-
}
|
|
1
|
+
import { useHttpClient } from '../composable';
|
|
2
|
+
import { data } from '../data';
|
|
3
|
+
import { EventAwareInterface, EventHandler, EventMixin } from '../events';
|
|
4
|
+
import type { UnicornHttpClient } from './http-client';
|
|
5
|
+
import { mergeDeep } from '../utilities';
|
|
6
|
+
import { AxiosProgressEvent, AxiosResponse } from 'axios';
|
|
7
|
+
import { Mixin } from 'ts-mixer';
|
|
8
|
+
|
|
9
|
+
const instances: Record<string, S3Uploader> = {};
|
|
10
|
+
export function get(name: string, options?: Partial<S3UploaderGlobalOptions>): S3Uploader;
|
|
11
|
+
export function get(
|
|
12
|
+
name: string,
|
|
13
|
+
options: Partial<S3UploaderGlobalOptions> = {}
|
|
14
|
+
): S3Uploader | void {
|
|
15
|
+
return instances[name] ??= create(name, options);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
export function create(name: string, options: Partial<S3UploaderGlobalOptions> = {}): S3Uploader {
|
|
19
|
+
return new S3Uploader(name, options);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export function destroy(name: string) {
|
|
23
|
+
delete instances[name];
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
const defaultOptions: S3UploaderGlobalOptions = {
|
|
27
|
+
endpoint: '',
|
|
28
|
+
subfolder: '',
|
|
29
|
+
viewerHost: '',
|
|
30
|
+
starts_with: [],
|
|
31
|
+
formInputs: {
|
|
32
|
+
acl: '',
|
|
33
|
+
bucket: '',
|
|
34
|
+
key: '',
|
|
35
|
+
Policy: '',
|
|
36
|
+
'X-Amz-Algorithm': '',
|
|
37
|
+
'X-Amz-Credential': '',
|
|
38
|
+
'X-Amz-Date': '',
|
|
39
|
+
'X-Amz-Signature': '',
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
export class S3Uploader extends Mixin(EventMixin) implements EventAwareInterface {
|
|
44
|
+
options: S3UploaderGlobalOptions;
|
|
45
|
+
http?: UnicornHttpClient;
|
|
46
|
+
|
|
47
|
+
constructor(protected name: string, options: Partial<S3UploaderGlobalOptions> = {}) {
|
|
48
|
+
super();
|
|
49
|
+
|
|
50
|
+
const awsOptions = data('@s3.uploader.' + name) || {};
|
|
51
|
+
|
|
52
|
+
this.options = mergeDeep<S3UploaderGlobalOptions>({}, defaultOptions, awsOptions, options);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
async getHttpClient() {
|
|
56
|
+
return this.http ??= await useHttpClient();
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
/**
|
|
60
|
+
* Do upload.
|
|
61
|
+
*/
|
|
62
|
+
async upload(
|
|
63
|
+
file: string | File | Blob,
|
|
64
|
+
path: string,
|
|
65
|
+
options: Partial<S3UploaderRequestOptions> = {}
|
|
66
|
+
): Promise<S3UploaderResponse> {
|
|
67
|
+
const httpClient = await this.getHttpClient();
|
|
68
|
+
|
|
69
|
+
const fileData = new FormData();
|
|
70
|
+
const inputs = mergeDeep({}, this.options.formInputs, options.formInputs || {});
|
|
71
|
+
|
|
72
|
+
if (typeof file === 'string') {
|
|
73
|
+
file = new Blob([file], { type: options['Content-Type'] || 'text/plain' });
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
if (file instanceof Blob && path.endsWith('.{ext}')) {
|
|
77
|
+
throw new Error('If using Blob or file data string, you must provide a valid file extension in the path.');
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
if ((file instanceof Blob) || (file as any) instanceof File) {
|
|
81
|
+
options['Content-Type'] = options['Content-Type'] || file.type;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
if (options['filename']) {
|
|
85
|
+
const filename = this.replaceExt(options['filename'], file);
|
|
86
|
+
options['Content-Disposition'] = 'attachment; filename*=UTF-8\'\'' + encodeURIComponent(filename);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
path = this.replaceExt(path, file);
|
|
90
|
+
|
|
91
|
+
options['key'] = trimSlashes(this.options.subfolder || '') + '/'
|
|
92
|
+
+ trimSlashes(path);
|
|
93
|
+
options['key'] = trimSlashes(options['key']);
|
|
94
|
+
options['Content-Type'] = options['Content-Type'] || undefined;
|
|
95
|
+
options['Content-Disposition'] = options['Content-Disposition'] || undefined;
|
|
96
|
+
|
|
97
|
+
// Prepare pre-signed data
|
|
98
|
+
for (let key in inputs) {
|
|
99
|
+
fileData.set(key, inputs[key]);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
// Prepare custom data
|
|
103
|
+
for (let key of Object.keys(this.options.starts_with)) {
|
|
104
|
+
if (options[key]) {
|
|
105
|
+
fileData.set(key, options[key]);
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
fileData.append('file', file);
|
|
110
|
+
|
|
111
|
+
this.trigger('start', fileData);
|
|
112
|
+
|
|
113
|
+
try {
|
|
114
|
+
let res = await httpClient.post(
|
|
115
|
+
this.options.endpoint || '',
|
|
116
|
+
fileData,
|
|
117
|
+
{
|
|
118
|
+
onUploadProgress: (e) => {
|
|
119
|
+
if (options.onUploadProgress) {
|
|
120
|
+
options.onUploadProgress(e);
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
this.trigger('upload-progress', e);
|
|
124
|
+
|
|
125
|
+
if (e.total != null) {
|
|
126
|
+
this.trigger('progress', e.loaded / e.total, e);
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
) as S3UploaderResponse;
|
|
131
|
+
|
|
132
|
+
const url = this.options.viewerHost + '/'
|
|
133
|
+
+ trimSlashes(path);
|
|
134
|
+
|
|
135
|
+
this.trigger('success', url, res);
|
|
136
|
+
|
|
137
|
+
res.url = url;
|
|
138
|
+
|
|
139
|
+
return res;
|
|
140
|
+
} finally {
|
|
141
|
+
this.trigger('end');
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
replaceExt(path: string, file: File | Blob): string {
|
|
146
|
+
if (file instanceof File) {
|
|
147
|
+
const fileExt = file.name.split('.').pop();
|
|
148
|
+
|
|
149
|
+
if (path.endsWith('.{ext}')) {
|
|
150
|
+
return path.replace(/\.{ext}$/, fileExt ? '.' + fileExt : '');
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
return path;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
on(event: 'start', handler: StartEventHandler): this;
|
|
158
|
+
on(event: 'success', handler: SuccessEventHandler): this;
|
|
159
|
+
on(event: 'end', handler: EndEventHandler): this;
|
|
160
|
+
on(event: 'upload-progress', handler: UploadProgressEventHandler): this;
|
|
161
|
+
on(event: 'progress', handler: ProgressEventHandler): this;
|
|
162
|
+
on(event: string | string[], handler: EventHandler): this {
|
|
163
|
+
return super.on(event, handler);
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
onStart(handler: StartEventHandler): this {
|
|
167
|
+
return this.on('start', handler);
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
onSuccess(handler: SuccessEventHandler): this {
|
|
171
|
+
return this.on('success', handler);
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
onEnd(handler: EndEventHandler): this {
|
|
175
|
+
return this.on('end', handler);
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
onProgress(handler: UploadProgressEventHandler): this {
|
|
179
|
+
return this.on('upload-progress', handler);
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
onProgressWithTotal(handler: ProgressEventHandler): this {
|
|
183
|
+
return this.on('progress', handler);
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
type EndEventHandler = () => void;
|
|
188
|
+
type SuccessEventHandler = (url: string, res: S3UploaderResponse) => void;
|
|
189
|
+
type StartEventHandler = (fileData: FormData) => void;
|
|
190
|
+
type UploadProgressEventHandler = (e: AxiosProgressEvent) => void;
|
|
191
|
+
type ProgressEventHandler = (total: number, e: AxiosProgressEvent) => void;
|
|
192
|
+
|
|
193
|
+
function trimSlashes(str: string) {
|
|
194
|
+
return str.replace(/^\/+|\/+$/g, '');
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
export interface S3UploaderResponse extends AxiosResponse {
|
|
198
|
+
url: string;
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
export interface S3UploaderGlobalOptions {
|
|
202
|
+
endpoint?: string;
|
|
203
|
+
subfolder?: string;
|
|
204
|
+
viewerHost?: string;
|
|
205
|
+
starts_with: any[];
|
|
206
|
+
formInputs?: {
|
|
207
|
+
acl: string;
|
|
208
|
+
bucket: string;
|
|
209
|
+
key: string;
|
|
210
|
+
Policy: string;
|
|
211
|
+
'X-Amz-Algorithm': string;
|
|
212
|
+
'X-Amz-Credential': string;
|
|
213
|
+
'X-Amz-Date': string;
|
|
214
|
+
'X-Amz-Signature': string;
|
|
215
|
+
[name: string]: any
|
|
216
|
+
},
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
export interface S3UploaderRequestOptions {
|
|
220
|
+
formInputs?: { [name: string]: any };
|
|
221
|
+
onUploadProgress?: (e: AxiosProgressEvent) => void;
|
|
222
|
+
'Content-Type'?: string;
|
|
223
|
+
'Content-Disposition'?: string;
|
|
224
|
+
key?: string;
|
|
225
|
+
|
|
226
|
+
[name: string]: any;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
export interface S3UploaderModule {
|
|
230
|
+
get(name: string, options?: Partial<S3UploaderGlobalOptions>): S3Uploader;
|
|
231
|
+
create(name: string, options?: Partial<S3UploaderGlobalOptions>): S3Uploader;
|
|
232
|
+
destroy(name: string): void;
|
|
233
|
+
S3Uploader: typeof S3Uploader;
|
|
234
|
+
}
|