@formio/js 5.0.0-rc.29 → 5.0.0-rc.31

package/lib/cjs/providers/storage/s3.js

@@ -1,49 +1,149 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const xhr_1 = __importDefault(require("./xhr"));
-const s3 = (formio) => ({
-    uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback) {
-        return xhr_1.default.upload(formio, 's3', (xhr, response) => {
-            response.data.fileName = fileName;
-            response.data.key = xhr_1.default.path([response.data.key, dir, fileName]);
-            if (response.signed) {
-                xhr.openAndSetHeaders('PUT', response.signed);
-                xhr.setRequestHeader('Content-Type', file.type);
-                return file;
+const util_1 = require("./util");
+const AbortController = window.AbortController || require('abortcontroller-polyfill/dist/cjs-ponyfill');
+function s3(formio) {
+    return {
+        uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback, multipartOptions) {
+            return __awaiter(this, void 0, void 0, function* () {
+                const xhrCallback = (xhr, response, abortCallback) => __awaiter(this, void 0, void 0, function* () {
+                    response.data.fileName = fileName;
+                    response.data.key = xhr_1.default.path([response.data.key, dir, fileName]);
+                    if (response.signed) {
+                        if (multipartOptions && Array.isArray(response.signed)) {
+                            // patch abort callback
+                            const abortController = new AbortController();
+                            const abortSignal = abortController.signal;
+                            if (typeof abortCallback === 'function') {
+                                abortCallback(() => abortController.abort());
+                            }
+                            try {
+                                const parts = yield this.uploadParts(file, response.signed, response.data.headers, response.partSizeActual, multipartOptions, abortSignal);
+                                yield (0, util_1.withRetries)(this.completeMultipartUpload, [response, parts, multipartOptions], 3);
+                                return;
+                            }
+                            catch (err) {
+                                // abort in-progress fetch requests
+                                abortController.abort();
+                                // attempt to cancel the multipart upload
+                                this.abortMultipartUpload(response);
+                                throw err;
+                            }
+                        }
+                        else {
+                            xhr.openAndSetHeaders('PUT', response.signed);
+                            xhr.setRequestHeader('Content-Type', file.type);
+                            Object.keys(response.data.headers).forEach((key) => {
+                                xhr.setRequestHeader(key, response.data.headers[key]);
+                            });
+                            return file;
+                        }
+                    }
+                    else {
+                        const fd = new FormData();
+                        for (const key in response.data) {
+                            fd.append(key, response.data[key]);
+                        }
+                        fd.append('file', file);
+                        xhr.openAndSetHeaders('POST', response.url);
+                        return fd;
+                    }
+                });
+                const response = yield xhr_1.default.upload(formio, 's3', xhrCallback, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback, multipartOptions);
+                return {
+                    storage: 's3',
+                    name: fileName,
+                    bucket: response.bucket,
+                    key: response.data.key,
+                    url: xhr_1.default.path([response.url, response.data.key]),
+                    acl: response.data.acl,
+                    size: file.size,
+                    type: file.type
+                };
+            });
+        },
+        completeMultipartUpload(serverResponse, parts, multipart) {
+            return __awaiter(this, void 0, void 0, function* () {
+                const { changeMessage } = multipart;
+                changeMessage('Completing AWS S3 multipart upload...');
+                const token = formio.getToken();
+                const response = yield fetch(`${formio.formUrl}/storage/s3/multipart/complete`, {
+                    method: 'POST',
+                    headers: Object.assign({ 'Content-Type': 'application/json' }, (token ? { 'x-jwt-token': token } : {})),
+                    body: JSON.stringify({ parts, uploadId: serverResponse.uploadId, key: serverResponse.key })
+                });
+                const message = yield response.text();
+                if (!response.ok) {
+                    throw new Error(message);
+                }
+                // the AWS S3 SDK CompleteMultipartUpload command can return a HTTP 200 status header but still error;
+                // we need to parse, and according to AWS, to retry
+                if (message.match(/Error/)) {
+                    throw new Error(message);
+                }
+            });
+        },
+        abortMultipartUpload(serverResponse) {
+            const { uploadId, key } = serverResponse;
+            const token = formio.getToken();
+            fetch(`${formio.formUrl}/storage/s3/multipart/abort`, {
+                method: 'POST',
+                headers: Object.assign({ 'Content-Type': 'application/json' }, (token ? { 'x-jwt-token': token } : {})),
+                body: JSON.stringify({ uploadId, key })
+            }).catch((err) => console.error('Error while aborting multipart upload:', err));
+        },
+        uploadParts(file, urls, headers, partSize, multipart, abortSignal) {
+            const { changeMessage, progressCallback } = multipart;
+            changeMessage('Chunking and uploading parts to AWS S3...');
+            const promises = [];
+            for (let i = 0; i < urls.length; i++) {
+                const start = i * partSize;
+                const end = (i + 1) * partSize;
+                const blob = i < urls.length ? file.slice(start, end) : file.slice(start);
+                const promise = fetch(urls[i], {
+                    method: 'PUT',
+                    headers,
+                    body: blob,
+                    signal: abortSignal,
+                }).then((res) => {
+                    if (res.ok) {
+                        progressCallback(urls.length);
+                        const eTag = res.headers.get('etag');
+                        if (!eTag) {
+                            throw new Error('ETag header not found; it must be exposed in S3 bucket CORS settings');
+                        }
+                        return { ETag: eTag, PartNumber: i + 1 };
+                    }
+                    else {
+                        throw new Error(`Part no ${i} failed with status ${res.status}`);
+                    }
+                });
+                promises.push(promise);
+            }
+            return Promise.all(promises);
+        },
+        downloadFile(file) {
+            if (file.acl !== 'public-read') {
+                return formio.makeRequest('file', `${formio.formUrl}/storage/s3?bucket=${xhr_1.default.trim(file.bucket)}&key=${xhr_1.default.trim(file.key)}`, 'GET');
             }
             else {
-                const fd = new FormData();
-                for (const key in response.data) {
-                    fd.append(key, response.data[key]);
-                }
-                fd.append('file', file);
-                xhr.openAndSetHeaders('POST', response.url);
-                return fd;
+                return Promise.resolve(file);
             }
-        }, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback).then((response) => {
-            return {
-                storage: 's3',
-                name: fileName,
-                bucket: response.bucket,
-                key: response.data.key,
-                url: xhr_1.default.path([response.url, response.data.key]),
-                acl: response.data.acl,
-                size: file.size,
-                type: file.type
-            };
-        });
-    },
-    downloadFile(file) {
-        if (file.acl !== 'public-read') {
-            return formio.makeRequest('file', `${formio.formUrl}/storage/s3?bucket=${xhr_1.default.trim(file.bucket)}&key=${xhr_1.default.trim(file.key)}`, 'GET');
-        }
-        else {
-            return Promise.resolve(file);
         }
-    }
-});
+    };
+}
 s3.title = 'S3';
 exports.default = s3;

package/lib/cjs/providers/storage/url.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const url = (formio) => {
+function url(formio) {
     const xhrRequest = (url, name, query, data, options, progressCallback, abortCallback) => {
         return new Promise((resolve, reject) => {
             const xhr = new XMLHttpRequest();
@@ -137,6 +137,6 @@ const url = (formio) => {
             return Promise.resolve(file);
         }
     };
-};
+}
 url.title = 'Url';
 exports.default = url;

package/lib/cjs/providers/storage/util.js

@@ -0,0 +1,21 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withRetries = void 0;
+function withRetries(fn, args, retries = 3, err = null) {
+    return __awaiter(this, void 0, void 0, function* () {
+        if (!retries) {
+            throw new Error(err);
+        }
+        return fn(...args).catch(() => withRetries(fn, args, retries - 1, err));
+    });
+}
+exports.withRetries = withRetries;

package/lib/cjs/providers/storage/xhr.js

@@ -1,4 +1,13 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -27,74 +36,82 @@ const XHR = {
     path(items) {
         return items.filter(item => !!item).map(XHR.trim).join('/');
     },
-    upload(formio, type, xhrCb, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback) {
-        return new Promise(((resolve, reject) => {
-            // Send the pre response to sign the upload.
-            const pre = new XMLHttpRequest();
-            // This only fires on a network error.
-            pre.onerror = (err) => {
+    upload(formio, type, xhrCallback, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback, multipartOptions) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // make request to Form.io server
+            const token = formio.getToken();
+            let response;
+            try {
+                response = yield fetch(`${formio.formUrl}/storage/${type}`, {
+                    method: 'POST',
+                    headers: Object.assign({ 'Accept': 'application/json', 'Content-Type': 'application/json; charset=UTF-8' }, (token ? { 'x-jwt-token': token } : {})),
+                    body: JSON.stringify({
+                        name: XHR.path([dir, fileName]),
+                        size: file.size,
+                        type: file.type,
+                        groupPermissions,
+                        groupId,
+                        multipart: multipartOptions
+                    })
+                });
+            }
+            catch (err) {
+                // only throws on network errors
                 err.networkError = true;
-                reject(err);
+                throw err;
+            }
+            if (!response.ok) {
+                const message = yield response.text();
+                throw new Error(message || 'Unable to sign file.');
+            }
+            const serverResponse = yield response.json();
+            return yield XHR.makeXhrRequest(formio, xhrCallback, serverResponse, progressCallback, abortCallback);
+        });
+    },
+    makeXhrRequest(formio, xhrCallback, serverResponse, progressCallback, abortCallback) {
+        return new Promise((resolve, reject) => {
+            // Send the file with data.
+            const xhr = new XMLHttpRequest();
+            xhr.openAndSetHeaders = (...params) => {
+                xhr.open(...params);
+                (0, exports.setXhrHeaders)(formio, xhr);
             };
-            pre.onabort = reject;
-            pre.onload = () => {
-                if (pre.status >= 200 && pre.status < 300) {
-                    const response = JSON.parse(pre.response);
-                    // Send the file with data.
-                    const xhr = new XMLHttpRequest();
-                    if (typeof progressCallback === 'function') {
-                        xhr.upload.onprogress = progressCallback;
-                    }
-                    if (typeof abortCallback === 'function') {
-                        abortCallback(() => xhr.abort());
-                    }
-                    xhr.openAndSetHeaders = (...params) => {
-                        xhr.open(...params);
-                        (0, exports.setXhrHeaders)(formio, xhr);
-                    };
-                    // Fire on network error.
-                    xhr.onerror = (err) => {
-                        err.networkError = true;
-                        reject(err);
-                    };
-                    // Fire on network abort.
-                    xhr.onabort = (err) => {
-                        err.networkError = true;
-                        reject(err);
-                    };
-                    // Fired when the response has made it back from the server.
-                    xhr.onload = () => {
-                        if (xhr.status >= 200 && xhr.status < 300) {
-                            resolve(response);
-                        }
-                        else {
-                            reject(xhr.response || 'Unable to upload file');
-                        }
-                    };
-                    // Set the onabort error callback.
-                    xhr.onabort = reject;
-                    // Get the request and send it to the server.
-                    xhr.send(xhrCb(xhr, response));
+            Promise.resolve(xhrCallback(xhr, serverResponse, abortCallback)).then((payload) => {
+                // if payload is nullish we can assume the provider took care of the entire upload process
+                if (!payload) {
+                    return resolve(serverResponse);
                 }
-                else {
-                    reject(pre.response || 'Unable to sign file');
+                // Fire on network error.
+                xhr.onerror = (err) => {
+                    err.networkError = true;
+                    reject(err);
+                };
+                // Fire on network abort.
+                xhr.onabort = (err) => {
+                    err.networkError = true;
+                    reject(err);
+                };
+                // Set the onabort error callback.
+                xhr.onabort = reject;
+                if (typeof progressCallback === 'function') {
+                    xhr.upload.onprogress = progressCallback;
                 }
-            };
-            pre.open('POST', `${formio.formUrl}/storage/${type}`);
-            pre.setRequestHeader('Accept', 'application/json');
-            pre.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
-            const token = formio.getToken();
-            if (token) {
-                pre.setRequestHeader('x-jwt-token', token);
-            }
-            pre.send(JSON.stringify({
-                name: XHR.path([dir, fileName]),
-                size: file.size,
-                type: file.type,
-                groupPermissions,
-                groupId,
-            }));
-        }));
+                if (typeof abortCallback === 'function') {
+                    abortCallback(() => xhr.abort());
+                }
+                // Fired when the response has made it back from the server.
+                xhr.onload = () => {
+                    if (xhr.status >= 200 && xhr.status < 300) {
+                        resolve(serverResponse);
+                    }
+                    else {
+                        reject(xhr.response || 'Unable to upload file');
+                    }
+                };
+                // Get the request and send it to the server.
+                xhr.send(payload);
+            }).catch(reject);
+        });
     }
 };
 exports.default = XHR;

package/lib/cjs/utils/formUtils.js

@@ -371,7 +371,7 @@ exports.applyFormChanges = applyFormChanges;
  * @returns {Object}
  *   The flattened components map.
  */
-function flattenComponents(components, includeAll) {
+function flattenComponents(components, includeAll = false) {
     const flattened = {};
     eachComponent(components, (component, path) => {
         flattened[path] = component;

package/lib/cjs/utils/utils.js

@@ -1229,6 +1229,12 @@ function sanitize(string, options) {
         ADD_ATTR: ['ref', 'target'],
         USE_PROFILES: { html: true }
     };
+    // Use profiles
+    if (options.sanitizeConfig && options.sanitizeConfig.useProfiles) {
+        Object.keys(options.sanitizeConfig.useProfiles).forEach(key => {
+            sanitizeOptions.USE_PROFILES[key] = options.sanitizeConfig.useProfiles[key];
+        });
+    }
     // Add attrs
     if (options.sanitizeConfig && Array.isArray(options.sanitizeConfig.addAttr) && options.sanitizeConfig.addAttr.length > 0) {
         options.sanitizeConfig.addAttr.forEach((attr) => {

package/lib/mjs/CDN.js

@@ -3,13 +3,17 @@
 // like Formio.cdn.ace === 'http://cdn.form.io/ace/1.4.12'.
 // For latest version use empty string
 class CDN {
+    static defaultCDN = 'https://cdn.form.io';
     constructor(baseUrl, overrides = {}) {
-        this.baseUrl = baseUrl || 'https://cdn.form.io';
+        this.baseUrl = baseUrl || CDN.defaultCDN;
         this.overrides = overrides;
         this.libs = {
             'js': '',
             'ace': '1.4.12',
-            'bootstrap': '4.6.2',
+            'bootstrap': '5.3.2',
+            'bootstrap4': '4.6.2',
+            'bootstrap5': '5.3.2',
+            'bootstrap-icons': '1.11.1',
             'ckeditor': '19.0.0',
             'flatpickr': '4.6.8',
             'flatpickr-formio': '4.6.13-formio.3',