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

package/dist/formio.utils.min.js.LICENSE.txt

@@ -12,7 +12,7 @@
 
 /*! @license DOMPurify 3.0.6 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.0.6/LICENSE */
 
-/*! formiojs v5.0.0-rc.30 | https://unpkg.com/formiojs@5.0.0-rc.30/LICENSE.txt */
+/*! formiojs v5.0.0-rc.31 | https://unpkg.com/formiojs@5.0.0-rc.31/LICENSE.txt */
 
 /**
  * @license

package/lib/cjs/CDN.js

@@ -6,12 +6,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // For latest version use empty string
 class CDN {
     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',
@@ -74,4 +77,5 @@ class CDN {
         }
     }
 }
+CDN.defaultCDN = 'https://cdn.form.io';
 exports.default = CDN;

package/lib/cjs/Embed.js

@@ -11,10 +11,17 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
+var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FormBuilder = exports.Form = exports.Formio = void 0;
 const CDN_js_1 = __importDefault(require("./CDN.js"));
 class Formio {
+    static setLicense(license, norecurse = false) {
+        Formio.license = license;
+        if (!norecurse && Formio.FormioClass) {
+            Formio.FormioClass.setLicense(license);
+        }
+    }
     static setBaseUrl(url, norecurse = false) {
         Formio.baseUrl = url;
         if (!norecurse && Formio.FormioClass) {
@@ -94,9 +101,15 @@ class Formio {
                 return Promise.resolve(Formio.global(name));
             }
             Formio.debug('Adding Script', src);
-            wrapper.appendChild(Formio.createElement('script', {
-                src
-            }));
+            try {
+                wrapper.appendChild(Formio.createElement('script', {
+                    src
+                }));
+            }
+            catch (err) {
+                Formio.debug(err);
+                return Promise.resolve();
+            }
             if (!name) {
                 return Promise.resolve();
             }
@@ -164,33 +177,69 @@ class Formio {
     }
     // Return the full script if the builder is being used.
     static formioScript(script, builder) {
+        builder = builder || Formio.config.includeBuilder;
         if (Formio.fullAdded || builder) {
             Formio.fullAdded = true;
             return script.replace('formio.form', 'formio.full');
         }
         return script;
     }
+    static addLibrary(wrapper, lib, name) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!lib) {
+                return;
+            }
+            if (lib.dependencies) {
+                for (let i = 0; i < lib.dependencies.length; i++) {
+                    yield Formio.addLibrary(wrapper, Formio.cdn.libs[lib.dependencies[i]]);
+                }
+            }
+            if (lib.css) {
+                yield Formio.addStyles(wrapper, lib.css);
+            }
+            if (lib.js) {
+                const module = yield Formio.addScript(wrapper, lib.js, lib.use ? name : false);
+                if (lib.use) {
+                    Formio.debug(`Using ${name}`);
+                    const options = lib.options || {};
+                    if (!options.license && Formio.license) {
+                        options.license = Formio.license;
+                    }
+                    Formio.use((typeof lib.use === 'function' ? lib.use(module) : module), options);
+                }
+            }
+        });
+    }
     // eslint-disable-next-line max-statements
     static init(element, options = {}, builder = false) {
         return __awaiter(this, void 0, void 0, function* () {
             Formio.cdn = new CDN_js_1.default(Formio.config.cdn, Formio.config.cdnUrls || {});
             Formio.config.libs = Formio.config.libs || {
                 uswds: {
-                    fa: true,
+                    dependencies: ['fontawesome'],
                     js: `${Formio.cdn.uswds}/uswds.min.js`,
                     css: `${Formio.cdn.uswds}/uswds.min.css`,
+                    use: true
                 },
                 fontawesome: {
                     css: `${Formio.cdn['font-awesome']}/css/font-awesome.min.css`
                 },
+                bootstrap4: {
+                    dependencies: ['fontawesome'],
+                    css: `${Formio.cdn.bootstrap4}/css/bootstrap.min.css`
+                },
                 bootstrap: {
+                    dependencies: ['bootstrap-icons'],
                     css: `${Formio.cdn.bootstrap}/css/bootstrap.min.css`
+                },
+                'bootstrap-icons': {
+                    css: `${Formio.cdn['bootstrap-icons']}/css/bootstrap-icons.css`
                 }
             };
             const id = Formio.config.id || `formio-${Math.random().toString(36).substring(7)}`;
             // Create a new wrapper and add the element inside of a new wrapper.
             let wrapper = Formio.createElement('div', {
-                'id': `"${id}-wrapper"`
+                'id': `${id}-wrapper`
             });
             element.parentNode.insertBefore(wrapper, element);
             // If we include the libraries, then we will attempt to run this in shadow dom.
@@ -221,9 +270,11 @@ class Formio {
                 }]));
             const renderer = Formio.config.debug ? 'formio.form' : 'formio.form.min';
             Formio.FormioClass = yield Formio.addScript(wrapper, Formio.formioScript(Formio.config.script || `${Formio.cdn.js}/${renderer}.js`, builder), 'Formio', builder ? 'isBuilder' : 'isRenderer');
+            Formio.FormioClass.cdn = Formio.cdn;
             Formio.FormioClass.setBaseUrl(options.baseUrl || Formio.baseUrl || Formio.config.base);
             Formio.FormioClass.setProjectUrl(options.projectUrl || Formio.projectUrl || Formio.config.project);
             Formio.FormioClass.language = Formio.language;
+            Formio.setLicense(Formio.license || Formio.config.license || false);
             Formio.modules.forEach((module) => {
                 Formio.FormioClass.use(module);
             });
@@ -233,43 +284,21 @@ class Formio {
             if (Formio.pathType) {
                 Formio.FormioClass.setPathType(Formio.pathType);
             }
-            // Add premium modules
-            if (Formio.global('premium')) {
-                Formio.debug('Using premium module.');
-                Formio.FormioClass.use(Formio.global('premium'));
+            // Add libraries if they wish to include the libs.
+            if (Formio.config.template && Formio.config.includeLibs) {
+                yield Formio.addLibrary(wrapper, Formio.config.libs[Formio.config.template], Formio.config.template);
             }
-            if (Formio.global('vpat')) {
-                Formio.debug('Using vpat module.');
-                Formio.FormioClass.use(Formio.global('vpat'));
+            // Add the premium modules.
+            if (Formio.config.premium) {
+                Formio.config.modules.premium = Formio.config.premium;
             }
-            if (Formio.config.template) {
-                if (Formio.config.includeLibs) {
-                    yield Formio.addStyles(wrapper, Formio.config.libs[Formio.config.template].css);
-                    yield Formio.addScript(wrapper, Formio.config.libs[Formio.config.template].js);
-                    if (Formio.config.libs[Formio.config.template].fa) {
-                        yield Formio.addStyles(wrapper, Formio.config.libs.fontawesome.css);
-                    }
+            // Allow adding dynamic modules.
+            if (Formio.config.modules) {
+                for (const name in Formio.config.modules) {
+                    const lib = Formio.config.modules[name];
+                    lib.use = lib.use || true;
+                    yield Formio.addLibrary(wrapper, lib, name);
                 }
-                if (Formio.cdn[Formio.config.template]) {
-                    const templateSrc = `${Formio.cdn[Formio.config.template]}/${Formio.config.template}.min`;
-                    yield Formio.addStyles(wrapper, `${templateSrc}.css`);
-                    Formio.debug(`Using ${Formio.config.template}`);
-                    Formio.FormioClass.use(yield Formio.addScript(wrapper, `${templateSrc}.js`, Formio.config.template));
-                }
-            }
-            else if (Formio.global('uswds')) {
-                Formio.debug('Using uswds module.');
-                Formio.FormioClass.use(Formio.global('uswds'));
-            }
-            // Default bootstrap + fontawesome.
-            else if (Formio.config.includeLibs) {
-                yield Formio.addStyles(wrapper, Formio.config.libs.fontawesome.css);
-                yield Formio.addStyles(wrapper, Formio.config.libs.bootstrap.css);
-            }
-            if (Formio.config.premium) {
-                yield Formio.addStyles(wrapper, Formio.config.premium.css);
-                Formio.debug('Using premium');
-                Formio.FormioClass.use(yield Formio.addScript(wrapper, Formio.config.premium.js, 'premium'));
             }
             yield Formio.addStyles(wrapper, Formio.formioScript(Formio.config.style || `${Formio.cdn.js}/${renderer}.css`, builder));
             if (Formio.config.before) {
@@ -280,60 +309,68 @@ class Formio {
             return wrapper;
         });
     }
+    // Called after an instance has been created.
+    static afterCreate(instance, wrapper, readyEvent) {
+        return __awaiter(this, void 0, void 0, function* () {
+            wrapper.removeChild(wrapper.querySelector('.formio-loader'));
+            Formio.FormioClass.events.emit(readyEvent, instance);
+            if (Formio.config.after) {
+                Formio.debug('Calling ready callback');
+                Formio.config.after(instance, Formio.config);
+            }
+            return instance;
+        });
+    }
+    // Create a new form.
     static createForm(element, form, options = {}) {
         return __awaiter(this, void 0, void 0, function* () {
             const wrapper = yield Formio.init(element, options);
             return Formio.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true })).then((instance) => {
-                Formio.debug('Form created', instance);
-                // Remove the loader.
-                Formio.debug('Removing loader');
-                wrapper.removeChild(wrapper.querySelector('.formio-loader'));
                 // Set the default submission data.
                 if (Formio.config.submission) {
                     Formio.debug('Setting submission', Formio.config.submission);
                     instance.submission = Formio.config.submission;
                 }
-                // Allow them to provide additional configs.
-                Formio.debug('Triggering embed event');
-                Formio.FormioClass.events.emit('formEmbedded', instance);
-                // Trigger the after handler.
-                if (Formio.config.after) {
-                    Formio.debug('Calling ready callback');
-                    Formio.config.after(instance, Formio.config);
-                }
+                // Call the after create method.
+                Formio.afterCreate(instance, wrapper, 'formEmbedded');
                 return instance;
             });
         });
     }
+    // Create a form builder.
     static builder(element, form, options = {}) {
         return __awaiter(this, void 0, void 0, function* () {
             const wrapper = yield Formio.init(element, options, true);
             return Formio.FormioClass.builder(element, form, options).then((instance) => {
-                Formio.debug('Builder created', instance);
-                Formio.debug('Removing loader');
-                wrapper.removeChild(wrapper.querySelector('.formio-loader'));
-                Formio.debug('Triggering embed event');
-                Formio.FormioClass.events.emit('builderEmbedded', instance);
-                if (Formio.config.after) {
-                    Formio.debug('Calling ready callback');
-                    Formio.config.after(instance, Formio.config);
-                }
+                Formio.afterCreate(instance, wrapper, 'builderEmbedded');
                 return instance;
             });
         });
     }
 }
+_a = Formio;
 Formio.FormioClass = null;
 Formio.config = {};
-Formio.cdn = new CDN_js_1.default();
 Formio.modules = [];
 Formio.icons = '';
+Formio.license = '';
 Formio.formioReady = new Promise((ready, reject) => {
     Formio._formioReady = ready;
     Formio._formioReadyReject = reject;
 });
 Formio.version = 'FORMIO_VERSION';
+// Create a report.
+Formio.Report = {
+    create: (element, submission, options = {}) => __awaiter(void 0, void 0, void 0, function* () {
+        const wrapper = yield Formio.init(element, options, true);
+        return Formio.FormioClass.Report.create(element, submission, options).then((instance) => {
+            Formio.afterCreate(instance, wrapper, 'reportEmbedded');
+            return instance;
+        });
+    })
+};
 exports.Formio = Formio;
+CDN_js_1.default.defaultCDN = Formio.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';
 class Form {
     constructor(element, form, options) {
         this.form = form;

package/lib/cjs/Formio.js

@@ -12,6 +12,7 @@ const providers_1 = __importDefault(require("./providers"));
 sdk_1.Formio.cdn = new CDN_1.default();
 sdk_1.Formio.Providers = providers_1.default;
 sdk_1.Formio.version = 'FORMIO_VERSION';
+CDN_1.default.defaultCDN = sdk_1.Formio.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';
 const isNil = (val) => val === null || val === undefined;
 sdk_1.Formio.prototype.uploadFile = function (storage, file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, uploadStartCallback, abortCallback, multipartOptions) {
     const requestArgs = {
@@ -92,11 +93,20 @@ sdk_1.Formio.prototype.deleteFile = function (file, options) {
     });
     return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);
 };
+// Esnure we proxy the following methods to the FormioEmbed class.
+['setBaseUrl', 'setApiUrl', 'setAppUrl', 'setProjectUrl', 'setPathType', 'setLicense'].forEach((fn) => {
+    const baseFn = sdk_1.Formio[fn];
+    sdk_1.Formio[fn] = function (arg) {
+        const retVal = Embed_1.Formio[fn](arg, true);
+        return baseFn ? baseFn.call(this, arg) : retVal;
+    };
+});
 // For reverse compatability.
 sdk_1.Formio.Promise = Promise;
 sdk_1.Formio.formioReady = Embed_1.Formio.formioReady;
 sdk_1.Formio.config = Embed_1.Formio.config;
 sdk_1.Formio.builder = Embed_1.Formio.builder;
+sdk_1.Formio.Report = Embed_1.Formio.Report;
 sdk_1.Formio.Form = Embed_1.Formio.Form;
 sdk_1.Formio.FormBuilder = Embed_1.Formio.FormBuilder;
 sdk_1.Formio.use = Embed_1.Formio.use;

package/lib/cjs/Wizard.js

@@ -788,23 +788,22 @@ class Wizard extends Webform_1.default {
         }
     }
     setValue(submission, flags = {}, ignoreEstablishment) {
-        const changed = this.getPages({ all: true }).reduce((changed, page) => {
-            return this.setNestedValue(page, submission.data, flags, changed) || changed;
-        }, false);
-        if (!flags.sanitize ||
+        this._submission = submission;
+        if ((flags && flags.fromSubmission && (this.options.readOnly || this.editMode) && !this.isHtmlRenderMode()) ||
             (flags && flags.fromSubmission && (this.prefixComps.length || this.suffixComps.length) && submission._id) ||
             (this.options.server && (this.prefixComps.length || this.suffixComps.length))) {
-            this.mergeData(this.data, submission.data);
+            this._data = submission.data;
+        }
+        if (!ignoreEstablishment) {
+            this.establishPages(submission.data);
         }
+        const changed = this.getPages({ all: true }).reduce((changed, page) => {
+            return this.setNestedValue(page, submission.data, flags, changed) || changed;
+        }, false);
         if (changed) {
             this.pageFieldLogic(this.page);
         }
         this.setEditMode(submission);
-        submission.data = this.data;
-        this._submission = submission;
-        if (!ignoreEstablishment) {
-            this.establishPages(submission.data);
-        }
         return changed;
     }
     isClickable(page, index) {

package/lib/cjs/components/_classes/component/Component.js

@@ -1064,7 +1064,7 @@ class Component extends Element_1.default {
                     placement: 'right',
                     zIndex: 10000,
                     interactive: true,
-                    content: this.t(tooltipText, { _userInput: true }),
+                    content: this.t(this.sanitize(tooltipText), { _userInput: true }),
                 });
             }
         });
@@ -2938,8 +2938,6 @@ class Component extends Element_1.default {
         const rules = [
             // Do not validate if the flags say not too.
             () => flags.noValidate,
-            // Do not check custom validation for empty data if it is not required
-            () => this.component.validate.custom && !this.dataValue && !this.component.validate.required,
             // Force valid if component is read-only
             () => this.options.readOnly,
             // Do not check validations if component is not an input component.

package/lib/cjs/components/_classes/component/fixtures/comp5.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Text Field',
+            description: "<img <img src='https://somesite' onerror='var _ee = 2' >",
+            tooltip: "<img src='https://somesite' onerror='var _ee = 1 >",
+            applyMaskOn: 'change',
+            tableView: true,
+            key: 'textField',
+            type: 'textfield',
+            input: true
+        },
+        {
+            type: 'button',
+            label: 'Submit',
+            key: 'submit',
+            disableOnInvalid: true,
+            input: true,
+            tableView: false
+        }
+    ],
+};

package/lib/cjs/components/_classes/component/fixtures/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.comp4 = exports.comp3 = exports.comp2 = exports.comp1 = void 0;
+exports.comp5 = exports.comp4 = exports.comp3 = exports.comp2 = exports.comp1 = void 0;
 const comp1_1 = __importDefault(require("./comp1"));
 exports.comp1 = comp1_1.default;
 const comp2_1 = __importDefault(require("./comp2"));
@@ -12,3 +12,5 @@ const comp3_1 = __importDefault(require("./comp3"));
 exports.comp3 = comp3_1.default;
 const comp4_1 = __importDefault(require("./comp4"));
 exports.comp4 = comp4_1.default;
+const comp5_1 = __importDefault(require("./comp5"));
+exports.comp5 = comp5_1.default;

package/lib/cjs/components/columns/editForm/Columns.edit.display.js

@@ -86,24 +86,6 @@ exports.default = [
                 key: 'width',
                 defaultValue: 6,
                 label: 'Width'
-            },
-            {
-                type: 'number',
-                key: 'offset',
-                defaultValue: 0,
-                label: 'Offset'
-            },
-            {
-                type: 'number',
-                key: 'push',
-                defaultValue: 0,
-                label: 'Push'
-            },
-            {
-                type: 'number',
-                key: 'pull',
-                defaultValue: 0,
-                label: 'Pull'
             }
         ]
     },

package/lib/cjs/components/file/File.js

@@ -690,6 +690,18 @@ class FileComponent extends Field_1.default {
                             }
                         }
                     }
+                    // Prep for a potential multipart upload
+                    let count = 0;
+                    const multipartOptions = this.component.useMultipartUpload && this.component.multipart ? Object.assign(Object.assign({}, this.component.multipart), { progressCallback: (total) => {
+                            count++;
+                            fileUpload.status = 'progress';
+                            fileUpload.progress = parseInt(100 * count / total);
+                            delete fileUpload.message;
+                            this.redraw();
+                        }, changeMessage: (message) => {
+                            fileUpload.message = message;
+                            this.redraw();
+                        } }) : false;
                     fileUpload.message = this.t('Starting upload...');
                     this.redraw();
                     const filePromise = fileService.uploadFile(storage, processedFile || file, fileName, dir, 
@@ -703,7 +715,7 @@ class FileComponent extends Field_1.default {
                     // Upload start callback
                     () => {
                         this.emit('fileUploadingStart', filePromise);
-                    }, (abort) => fileUpload.abort = abort).then((fileInfo) => {
+                    }, (abort) => fileUpload.abort = abort, multipartOptions).then((fileInfo) => {
                         const index = this.statuses.indexOf(fileUpload);
                         if (index !== -1) {
                             this.statuses.splice(index, 1);

package/lib/cjs/components/file/editForm/File.edit.file.js

@@ -25,6 +25,46 @@ exports.default = [
             }
         }
     },
+    {
+        type: 'checkbox',
+        input: true,
+        key: 'useMultipartUpload',
+        label: 'Use the S3 Multipart Upload API',
+        tooltip: "The <a href='https://docs.aws.amazon.com/AmazonS3/latest/userguide/mpuoverview.html'>S3 Multipart Upload API</a> is designed to improve the upload experience for larger objects (> 5GB).",
+        conditional: {
+            json: { '===': [{ var: 'data.storage' }, 's3'] }
+        },
+    },
+    {
+        label: 'Multipart Upload',
+        tableView: false,
+        key: 'multipart',
+        type: 'container',
+        input: true,
+        components: [
+            {
+                label: 'Part Size (MB)',
+                applyMaskOn: 'change',
+                mask: false,
+                tableView: false,
+                delimiter: false,
+                requireDecimal: false,
+                inputFormat: 'plain',
+                truncateMultipleSpaces: false,
+                validate: {
+                    min: 5,
+                    max: 5000,
+                },
+                key: 'partSize',
+                type: 'number',
+                input: true,
+                defaultValue: 500,
+            },
+        ],
+        conditional: {
+            json: { '===': [{ var: 'data.useMultipartUpload' }, true] }
+        },
+    },
     {
         type: 'textfield',
         input: true,

package/lib/cjs/components/select/Select.js

@@ -346,8 +346,10 @@ class SelectComponent extends ListComponent_1.default {
             }
         }
         // Allow js processing (needed for form builder)
-        if (this.component.onSetItems && typeof this.component.onSetItems === 'function') {
-            const newItems = this.component.onSetItems(this, items);
+        if (this.component.onSetItems) {
+            const newItems = typeof this.component.onSetItems === 'function'
+                ? this.component.onSetItems(this, items)
+                : this.evaluate(this.component.onSetItems, { items: items }, 'items');
             if (newItems) {
                 items = newItems;
             }
@@ -776,7 +778,9 @@ class SelectComponent extends ListComponent_1.default {
                 this.setItems(this.selectOptions || []);
             }
             this.focusableElement = input;
-            this.addEventListener(input, 'focus', () => this.update());
+            if (this.component.dataSrc === 'custom') {
+                this.addEventListener(input, 'focus', () => this.updateCustomItems());
+            }
             this.addEventListener(input, 'keydown', (event) => {
                 const { key } = event;
                 if (['Backspace', 'Delete'].includes(key)) {

package/lib/cjs/formio.form.js

@@ -52,7 +52,9 @@ Formio_1.Formio.Components.setComponents(components_1.default);
  * @returns
  */
 function registerModule(mod, defaultFn = null, options = {}) {
-    // Sanity check.
+    if (typeof mod === 'function') {
+        return registerModule(mod(Formio_1.Formio), defaultFn, options);
+    }
     if (typeof mod !== 'object') {
         return;
     }

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

@@ -4,27 +4,29 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const xhr_1 = __importDefault(require("./xhr"));
-const azure = (formio) => ({
-    uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback) {
-        return xhr_1.default.upload(formio, 'azure', (xhr, response) => {
-            xhr.openAndSetHeaders('PUT', response.url);
-            xhr.setRequestHeader('Content-Type', file.type);
-            xhr.setRequestHeader('x-ms-blob-type', 'BlockBlob');
-            return file;
-        }, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback).then(() => {
-            return {
-                storage: 'azure',
-                name: xhr_1.default.path([dir, fileName]),
-                size: file.size,
-                type: file.type,
-                groupPermissions,
-                groupId,
-            };
-        });
-    },
-    downloadFile(file) {
-        return formio.makeRequest('file', `${formio.formUrl}/storage/azure?name=${xhr_1.default.trim(file.name)}`, 'GET');
-    }
-});
+function azure(formio) {
+    return {
+        uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback) {
+            return xhr_1.default.upload(formio, 'azure', (xhr, response) => {
+                xhr.openAndSetHeaders('PUT', response.url);
+                xhr.setRequestHeader('Content-Type', file.type);
+                xhr.setRequestHeader('x-ms-blob-type', 'BlockBlob');
+                return file;
+            }, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback).then(() => {
+                return {
+                    storage: 'azure',
+                    name: xhr_1.default.path([dir, fileName]),
+                    size: file.size,
+                    type: file.type,
+                    groupPermissions,
+                    groupId,
+                };
+            });
+        },
+        downloadFile(file) {
+            return formio.makeRequest('file', `${formio.formUrl}/storage/azure?name=${xhr_1.default.trim(file.name)}`, 'GET');
+        }
+    };
+}
 azure.title = 'Azure File Services';
 exports.default = azure;