@georapbox/files-dropzone-element 1.1.1 → 1.2.1
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/README.md +13 -7
- package/dist/files-dropzone-defined.d.ts +3 -0
- package/dist/files-dropzone-defined.d.ts.map +1 -0
- package/dist/files-dropzone-defined.js +67 -52
- package/dist/files-dropzone-defined.js.map +1 -1
- package/dist/files-dropzone.d.ts +177 -0
- package/dist/files-dropzone.d.ts.map +1 -0
- package/dist/files-dropzone.js +67 -52
- package/dist/files-dropzone.js.map +1 -1
- package/dist/utils/files-selector.d.ts +2 -0
- package/dist/utils/files-selector.d.ts.map +1 -0
- package/dist/utils/is-valid-file.d.ts +9 -0
- package/dist/utils/is-valid-file.d.ts.map +1 -0
- package/package.json +13 -10
- package/src/files-dropzone.js +329 -137
- package/src/utils/files-selector.js +27 -18
- package/src/utils/is-valid-file.js +5 -3
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
// @ts-check
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* A map of common file extensions and their associated MIME types.
|
|
5
|
+
*/
|
|
1
6
|
const COMMON_MIME_TYPES = new Map([
|
|
2
7
|
// https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
|
|
3
8
|
['aac', 'audio/aac'],
|
|
@@ -33,6 +38,8 @@ const COMMON_MIME_TYPES = new Map([
|
|
|
33
38
|
['js', 'text/javascript'],
|
|
34
39
|
['json', 'application/json'],
|
|
35
40
|
['jsonld', 'application/ld+json'],
|
|
41
|
+
['markdown', 'text/markdown'],
|
|
42
|
+
['md', 'text/markdown'],
|
|
36
43
|
['mid', 'audio/midi'],
|
|
37
44
|
['midi', 'audio/midi'],
|
|
38
45
|
['mjs', 'text/javascript'],
|
|
@@ -96,15 +103,15 @@ const FILES_TO_IGNORE = [
|
|
|
96
103
|
* This is needed because Firefox doesn't add a type property to files dragged from the desktop.
|
|
97
104
|
* @bug https://bugzilla.mozilla.org/show_bug.cgi?id=1424689
|
|
98
105
|
*
|
|
99
|
-
* @param {File} file The file object to add the type property to.
|
|
100
|
-
* @returns {File} The file object with the type property added.
|
|
106
|
+
* @param {File} file - The file object to add the type property to.
|
|
107
|
+
* @returns {File} - The file object with the type property added.
|
|
101
108
|
*/
|
|
102
109
|
const toFileWithMimeType = file => {
|
|
103
110
|
const { name } = file;
|
|
104
111
|
const hasExtension = name && name.lastIndexOf('.') !== -1;
|
|
105
112
|
|
|
106
113
|
if (hasExtension && !file.type) {
|
|
107
|
-
const extension = name.split('.').pop().toLowerCase();
|
|
114
|
+
const extension = (name.split('.').pop() || '').toLowerCase();
|
|
108
115
|
const type = COMMON_MIME_TYPES.get(extension);
|
|
109
116
|
|
|
110
117
|
if (type) {
|
|
@@ -125,13 +132,14 @@ const toFileWithMimeType = file => {
|
|
|
125
132
|
* If `path` is not provided, the `webkitRelativePath` property of the file will be used
|
|
126
133
|
* or the file's name if `webkitRelativePath` is not available.
|
|
127
134
|
*
|
|
128
|
-
* @param {File} file The file object to add the path property to.
|
|
129
|
-
* @param {
|
|
130
|
-
* @returns {File} The file object with the path property added.
|
|
135
|
+
* @param {File} file - The file object to add the path property to.
|
|
136
|
+
* @param {string} [path] - The path to set on the file object.
|
|
137
|
+
* @returns {File} - The file object with the path property added.
|
|
131
138
|
*/
|
|
132
139
|
const toFileWithPath = (file, path) => {
|
|
133
140
|
const fileWithMimeType = toFileWithMimeType(file);
|
|
134
141
|
|
|
142
|
+
// @ts-ignore
|
|
135
143
|
if (typeof fileWithMimeType.path !== 'string') {
|
|
136
144
|
const { webkitRelativePath } = file;
|
|
137
145
|
|
|
@@ -150,8 +158,8 @@ const toFileWithPath = (file, path) => {
|
|
|
150
158
|
* Wrap `FileSystemDirectoryReader.readEntries` in a promise to make working with read entries easier.
|
|
151
159
|
* https://developer.mozilla.org/docs/Web/API/FileSystemDirectoryReader/readEntries
|
|
152
160
|
*
|
|
153
|
-
* @param {FileSystemDirectoryReader} directoryReader The directory reader to read entries from.
|
|
154
|
-
* @returns {Promise<
|
|
161
|
+
* @param {FileSystemDirectoryReader} directoryReader - The directory reader to read entries from.
|
|
162
|
+
* @returns {Promise<FileSystemEntry[]>} - A promise that resolves with an array of `FileSystemEntry` objects.
|
|
155
163
|
*/
|
|
156
164
|
const readEntriesPromise = async directoryReader => {
|
|
157
165
|
return await new Promise((resolve, reject) => {
|
|
@@ -163,8 +171,8 @@ const readEntriesPromise = async directoryReader => {
|
|
|
163
171
|
* Read all entries in a directory or sub-directory
|
|
164
172
|
* by calling `readEntries` until it returns an empty array.
|
|
165
173
|
*
|
|
166
|
-
* @param {FileSystemDirectoryReader} directoryReader The directory reader to read entries from.
|
|
167
|
-
* @returns {Promise<
|
|
174
|
+
* @param {FileSystemDirectoryReader} directoryReader - The directory reader to read entries from.
|
|
175
|
+
* @returns {Promise<FileSystemEntry[]>} - A promise that resolves with an array of `FileSystemEntry` objects.
|
|
168
176
|
*/
|
|
169
177
|
const readAllDirectoryEntries = async directoryReader => {
|
|
170
178
|
const entries = [];
|
|
@@ -181,8 +189,8 @@ const readAllDirectoryEntries = async directoryReader => {
|
|
|
181
189
|
/**
|
|
182
190
|
* Get a `File` object from a `FileSystemFileEntry` object.
|
|
183
191
|
*
|
|
184
|
-
* @param {FileSystemFileEntry} fileEntry The file entry to get a `File` object from.
|
|
185
|
-
* @returns {Promise<File>} A promise that resolves with a `File` object.
|
|
192
|
+
* @param {FileSystemFileEntry} fileEntry - The file entry to get a `File` object from.
|
|
193
|
+
* @returns {Promise<File>} - A promise that resolves with a `File` object.
|
|
186
194
|
*/
|
|
187
195
|
const getFileFromFileEntry = fileEntry => {
|
|
188
196
|
return new Promise((resolve, reject) => {
|
|
@@ -193,8 +201,8 @@ const getFileFromFileEntry = fileEntry => {
|
|
|
193
201
|
/**
|
|
194
202
|
* Get an array of `File` objects from a `DataTransferItemList` object.
|
|
195
203
|
*
|
|
196
|
-
* @param {DataTransferItemList} dataTransferItemList The item list to get an array of `File` objects from.
|
|
197
|
-
* @returns {Promise<File[]>} A promise that resolves with an array of `File` objects.
|
|
204
|
+
* @param {DataTransferItemList} dataTransferItemList - The item list to get an array of `File` objects from.
|
|
205
|
+
* @returns {Promise<File[]>} - A promise that resolves with an array of `File` objects.
|
|
198
206
|
*/
|
|
199
207
|
const getFilesFromDataTransferItemList = async dataTransferItemList => {
|
|
200
208
|
const files = [];
|
|
@@ -213,6 +221,7 @@ const getFilesFromDataTransferItemList = async dataTransferItemList => {
|
|
|
213
221
|
// https://developer.mozilla.org/docs/Web/API/DataTransferItem/webkitGetAsEntry
|
|
214
222
|
// This function is implemented as `webkitGetAsEntry()` in non-WebKit browsers
|
|
215
223
|
// including Firefox at this time but it may be renamed to `getAsEntry()` in the future.
|
|
224
|
+
// @ts-ignore
|
|
216
225
|
const entry = item.getAsEntry ? item.getAsEntry() : item.webkitGetAsEntry();
|
|
217
226
|
|
|
218
227
|
queue.push(entry);
|
|
@@ -240,8 +249,8 @@ const getFilesFromDataTransferItemList = async dataTransferItemList => {
|
|
|
240
249
|
/**
|
|
241
250
|
* Get an array of `File` objects from a `FileList` object.
|
|
242
251
|
*
|
|
243
|
-
* @param {FileList} fileList The file list to get an array of `File` objects from.
|
|
244
|
-
* @returns {Promise<File[]>} A promise that resolves with an array of `File` objects.
|
|
252
|
+
* @param {FileList} fileList - The file list to get an array of `File` objects from.
|
|
253
|
+
* @returns {Promise<File[]>} - A promise that resolves with an array of `File` objects.
|
|
245
254
|
*/
|
|
246
255
|
const getFilesFromFileList = async fileList => {
|
|
247
256
|
const files = [];
|
|
@@ -259,8 +268,8 @@ const getFilesFromFileList = async fileList => {
|
|
|
259
268
|
* Get an array of `File` objects from an event.
|
|
260
269
|
* This function supports both `drop` and `change` events.
|
|
261
270
|
*
|
|
262
|
-
* @param {
|
|
263
|
-
* @returns {Promise<File[]>} A promise that resolves with an array of `File` objects.
|
|
271
|
+
* @param {*} evt - The event to get an array of `File` objects from.
|
|
272
|
+
* @returns {Promise<File[]>} - A promise that resolves with an array of `File` objects.
|
|
264
273
|
*/
|
|
265
274
|
export const getFilesFromEvent = async evt => {
|
|
266
275
|
if (evt.dataTransfer) {
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
+
// @ts-check
|
|
2
|
+
|
|
1
3
|
/**
|
|
2
4
|
* Checks if a file is valid based on the accepted file type specifiers.
|
|
3
5
|
*
|
|
4
|
-
* @param {File} file The File object to validate.
|
|
5
|
-
* @param {
|
|
6
|
-
* @returns {
|
|
6
|
+
* @param {File} file - The File object to validate.
|
|
7
|
+
* @param {string} [acceptedTypeSpecifiers=''] - The accepted file type specifiers.
|
|
8
|
+
* @returns {boolean} - True if the file is valid, false otherwise.
|
|
7
9
|
*/
|
|
8
10
|
export function isValidFile(file, acceptedTypeSpecifiers = '') {
|
|
9
11
|
if (!acceptedTypeSpecifiers) {
|