@formio/js 5.0.0-rc.38 → 5.0.0-rc.40

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

@@ -10,11 +10,11 @@
  * MIT licensed
  */
 
-/*! @license DOMPurify 3.0.7 | (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.7/LICENSE */
-
 /*! @license DOMPurify 3.0.8 | (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.8/LICENSE */
 
-/*! formiojs v5.0.0-rc.38 | https://unpkg.com/formiojs@5.0.0-rc.38/LICENSE.txt */
+/*! @license DOMPurify 3.0.9 | (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.9/LICENSE */
+
+/*! formiojs v5.0.0-rc.40 | https://unpkg.com/formiojs@5.0.0-rc.40/LICENSE.txt */
 
 /**
  * @license
@@ -35,4 +35,4 @@
 
 //! moment.js
 
-//! version : 0.5.44
+//! version : 0.5.45

package/lib/cjs/Element.js

@@ -539,6 +539,7 @@ class Element {
             token: Formio_1.Formio.getToken({
                 decode: true
             }),
+            options: this.options,
             config: this.root && this.root.form && this.root.form.config
                 ? this.root.form.config
                 : ((_a = this.options) === null || _a === void 0 ? void 0 : _a.formConfig)

package/lib/cjs/Embed.js

@@ -17,49 +17,49 @@ 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);
+        _a.license = license;
+        if (!norecurse && _a.FormioClass) {
+            _a.FormioClass.setLicense(license);
         }
     }
     static setBaseUrl(url, norecurse = false) {
-        Formio.baseUrl = url;
-        if (!norecurse && Formio.FormioClass) {
-            Formio.FormioClass.setBaseUrl(url);
+        _a.baseUrl = url;
+        if (!norecurse && _a.FormioClass) {
+            _a.FormioClass.setBaseUrl(url);
         }
     }
     static setApiUrl(url, norecurse = false) {
-        Formio.baseUrl = url;
-        if (!norecurse && Formio.FormioClass) {
-            Formio.FormioClass.setApiUrl(url);
+        _a.baseUrl = url;
+        if (!norecurse && _a.FormioClass) {
+            _a.FormioClass.setApiUrl(url);
         }
     }
     static setProjectUrl(url, norecurse = false) {
-        Formio.projectUrl = url;
-        if (!norecurse && Formio.FormioClass) {
-            Formio.FormioClass.setProjectUrl(url);
+        _a.projectUrl = url;
+        if (!norecurse && _a.FormioClass) {
+            _a.FormioClass.setProjectUrl(url);
         }
     }
     static setAppUrl(url, norecurse = false) {
-        Formio.projectUrl = url;
-        if (!norecurse && Formio.FormioClass) {
-            Formio.FormioClass.setAppUrl(url);
+        _a.projectUrl = url;
+        if (!norecurse && _a.FormioClass) {
+            _a.FormioClass.setAppUrl(url);
         }
     }
     static setPathType(type, norecurse = false) {
-        Formio.pathType = type;
-        if (!norecurse && Formio.FormioClass) {
-            Formio.FormioClass.setPathType(type);
+        _a.pathType = type;
+        if (!norecurse && _a.FormioClass) {
+            _a.FormioClass.setPathType(type);
         }
     }
     static debug(...args) {
-        if (Formio.config.debug) {
+        if (_a.config.debug) {
             console.log(...args);
         }
     }
     static clearCache() {
-        if (Formio.FormioClass) {
-            Formio.FormioClass.clearCache();
+        if (_a.FormioClass) {
+            _a.FormioClass.clearCache();
         }
     }
     static global(prop, flag = '') {
@@ -67,15 +67,15 @@ class Formio {
         if (flag && globalValue && !globalValue[flag]) {
             return null;
         }
-        Formio.debug(`Getting global ${prop}`, globalValue);
+        _a.debug(`Getting global ${prop}`, globalValue);
         return globalValue;
     }
     static use(module) {
-        if (Formio.FormioClass && Formio.FormioClass.isRenderer) {
-            Formio.FormioClass.use(module);
+        if (_a.FormioClass && _a.FormioClass.isRenderer) {
+            _a.FormioClass.use(module);
         }
         else {
-            Formio.modules.push(module);
+            _a.modules.push(module);
         }
     }
     static createElement(type, attrs, children) {
@@ -84,42 +84,42 @@ class Formio {
             element.setAttribute(key, attrs[key]);
         });
         (children || []).forEach(child => {
-            element.appendChild(Formio.createElement(child.tag, child.attrs, child.children));
+            element.appendChild(_a.createElement(child.tag, child.attrs, child.children));
         });
         return element;
     }
-    static addScript(wrapper, src, name, flag = '') {
-        return __awaiter(this, void 0, void 0, function* () {
+    static addScript(wrapper_1, src_1, name_1) {
+        return __awaiter(this, arguments, void 0, function* (wrapper, src, name, flag = '') {
             if (!src) {
                 return Promise.resolve();
             }
             if (typeof src !== 'string' && src.length) {
-                return Promise.all(src.map(ref => Formio.addScript(wrapper, ref)));
+                return Promise.all(src.map(ref => _a.addScript(wrapper, ref)));
             }
-            if (name && Formio.global(name, flag)) {
-                Formio.debug(`${name} already loaded.`);
-                return Promise.resolve(Formio.global(name));
+            if (name && _a.global(name, flag)) {
+                _a.debug(`${name} already loaded.`);
+                return Promise.resolve(_a.global(name));
             }
-            Formio.debug('Adding Script', src);
+            _a.debug('Adding Script', src);
             try {
-                wrapper.appendChild(Formio.createElement('script', {
+                wrapper.appendChild(_a.createElement('script', {
                     src
                 }));
             }
             catch (err) {
-                Formio.debug(err);
+                _a.debug(err);
                 return Promise.resolve();
             }
             if (!name) {
                 return Promise.resolve();
             }
             return new Promise((resolve) => {
-                Formio.debug(`Waiting to load ${name}`);
+                _a.debug(`Waiting to load ${name}`);
                 const wait = setInterval(() => {
-                    if (Formio.global(name, flag)) {
+                    if (_a.global(name, flag)) {
                         clearInterval(wait);
-                        Formio.debug(`${name} loaded.`);
-                        resolve(Formio.global(name));
+                        _a.debug(`${name} loaded.`);
+                        resolve(_a.global(name));
                     }
                 }, 100);
             });
@@ -131,11 +131,11 @@ class Formio {
                 return;
             }
             if (typeof href !== 'string' && href.length) {
-                href.forEach(ref => Formio.addStyles(wrapper, ref));
+                href.forEach(ref => _a.addStyles(wrapper, ref));
                 return;
             }
-            Formio.debug('Adding Styles', href);
-            wrapper.appendChild(Formio.createElement('link', {
+            _a.debug('Adding Styles', href);
+            wrapper.appendChild(_a.createElement('link', {
                 rel: 'stylesheet',
                 href
             }));
@@ -143,19 +143,19 @@ class Formio {
     }
     static submitDone(instance, submission) {
         return __awaiter(this, void 0, void 0, function* () {
-            Formio.debug('Submision Complete', submission);
-            const successMessage = (Formio.config.success || '').toString();
+            _a.debug('Submision Complete', submission);
+            const successMessage = (_a.config.success || '').toString();
             if (successMessage && successMessage.toLowerCase() !== 'false' && instance.element) {
                 instance.element.innerHTML = `<div class="alert-success" role="alert">${successMessage}</div>`;
             }
-            let returnUrl = Formio.config.redirect;
+            let returnUrl = _a.config.redirect;
             // Allow form based configuration for return url.
             if (!returnUrl &&
                 (instance._form &&
                     instance._form.settings &&
                     (instance._form.settings.returnUrl ||
                         instance._form.settings.redirect))) {
-                Formio.debug('Return url found in form configuration');
+                _a.debug('Return url found in form configuration');
                 returnUrl = instance._form.settings.returnUrl || instance._form.settings.redirect;
             }
             if (returnUrl) {
@@ -167,7 +167,7 @@ class Formio {
                 if (!isOrigin && formSrc) {
                     returnUrl += `&form=${encodeURIComponent(formSrc)}`;
                 }
-                Formio.debug('Return URL', returnUrl);
+                _a.debug('Return URL', returnUrl);
                 window.location.href = returnUrl;
                 if (isOrigin) {
                     window.location.reload();
@@ -177,9 +177,9 @@ 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;
+        builder = builder || _a.config.includeBuilder;
+        if (_a.fullAdded || builder) {
+            _a.fullAdded = true;
             return script.replace('formio.form', 'formio.full');
         }
         return script;
@@ -191,28 +191,28 @@ class Formio {
             }
             if (lib.dependencies) {
                 for (let i = 0; i < lib.dependencies.length; i++) {
-                    yield Formio.addLibrary(wrapper, Formio.cdn.libs[lib.dependencies[i]]);
+                    yield _a.addLibrary(wrapper, _a.cdn.libs[lib.dependencies[i]]);
                 }
             }
             if (lib.css) {
-                yield Formio.addStyles(wrapper, lib.css);
+                yield _a.addStyles(wrapper, lib.css);
             }
             if (lib.js) {
-                const module = yield Formio.addScript(wrapper, lib.js, lib.use ? name : false);
+                const module = yield _a.addScript(wrapper, lib.js, lib.use ? name : false);
                 if (lib.use) {
-                    Formio.debug(`Using ${name}`);
+                    _a.debug(`Using ${name}`);
                     const options = lib.options || {};
-                    if (!options.license && Formio.license) {
-                        options.license = Formio.license;
+                    if (!options.license && _a.license) {
+                        options.license = _a.license;
                     }
-                    Formio.use((typeof lib.use === 'function' ? lib.use(module) : module), options);
+                    _a.use((typeof lib.use === 'function' ? lib.use(module) : module), options);
                 }
             }
         });
     }
     static addLoader(wrapper) {
         return __awaiter(this, void 0, void 0, function* () {
-            wrapper.appendChild(Formio.createElement('div', {
+            wrapper.appendChild(_a.createElement('div', {
                 'class': 'formio-loader'
             }, [{
                     tag: 'div',
@@ -229,39 +229,40 @@ class Formio {
         });
     }
     // 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 || {
+    static init(element_1) {
+        return __awaiter(this, arguments, void 0, function* (element, options = {}, builder = false) {
+            _a.cdn = new CDN_js_1.default(_a.config.cdn, _a.config.cdnUrls || {});
+            _a.config.libs = _a.config.libs || {
                 uswds: {
                     dependencies: ['fontawesome'],
-                    js: `${Formio.cdn.uswds}/uswds.min.js`,
-                    css: `${Formio.cdn.uswds}/uswds.min.css`,
+                    js: `${_a.cdn.uswds}/uswds.min.js`,
+                    css: `${_a.cdn.uswds}/uswds.min.css`,
                     use: true
                 },
                 fontawesome: {
-                    css: `${Formio.cdn['font-awesome']}/css/font-awesome.min.css`
+                    css: `${_a.cdn['font-awesome']}/css/font-awesome.min.css`
                 },
                 bootstrap4: {
                     dependencies: ['fontawesome'],
-                    css: `${Formio.cdn.bootstrap4}/css/bootstrap.min.css`
+                    css: `${_a.cdn.bootstrap4}/css/bootstrap.min.css`
                 },
                 bootstrap: {
                     dependencies: ['bootstrap-icons'],
-                    css: `${Formio.cdn.bootstrap}/css/bootstrap.min.css`
+                    css: `${_a.cdn.bootstrap}/css/bootstrap.min.css`
                 },
                 'bootstrap-icons': {
-                    css: `${Formio.cdn['bootstrap-icons']}/css/bootstrap-icons.css`
+                    css: `${_a.cdn['bootstrap-icons']}/css/bootstrap-icons.css`
                 }
             };
-            const id = Formio.config.id || `formio-${Math.random().toString(36).substring(7)}`;
+            const id = _a.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', {
+            let wrapper = _a.createElement('div', {
                 'id': `${id}-wrapper`
             });
             element.parentNode.insertBefore(wrapper, element);
             // If we include the libraries, then we will attempt to run this in shadow dom.
-            if (Formio.config.includeLibs && (typeof wrapper.attachShadow === 'function') && !Formio.config.premium) {
+            const useShadowDom = _a.config.includeLibs && (typeof wrapper.attachShadow === 'function');
+            if (useShadowDom) {
                 wrapper = wrapper.attachShadow({
                     mode: 'open'
                 });
@@ -269,49 +270,51 @@ class Formio {
             }
             element.parentNode.removeChild(element);
             wrapper.appendChild(element);
+            // If this is inside of shadow dom, then we need to add the styles and scripts to the shadow dom.
+            const libWrapper = useShadowDom ? wrapper : document.body;
             // Load the renderer styles.
-            yield Formio.addStyles(wrapper, Formio.config.embedCSS || `${Formio.cdn.js}/formio.embed.css`);
+            yield _a.addStyles(libWrapper, _a.config.embedCSS || `${_a.cdn.js}/formio.embed.css`);
             // Add a loader.
-            Formio.addLoader(wrapper);
-            const formioSrc = Formio.config.full ? 'formio.full' : 'formio.form';
-            const renderer = Formio.config.debug ? formioSrc : `${formioSrc}.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);
+            _a.addLoader(wrapper);
+            const formioSrc = _a.config.full ? 'formio.full' : 'formio.form';
+            const renderer = _a.config.debug ? formioSrc : `${formioSrc}.min`;
+            _a.FormioClass = yield _a.addScript(libWrapper, _a.formioScript(_a.config.script || `${_a.cdn.js}/${renderer}.js`, builder), 'Formio', builder ? 'isBuilder' : 'isRenderer');
+            _a.FormioClass.cdn = _a.cdn;
+            _a.FormioClass.setBaseUrl(options.baseUrl || _a.baseUrl || _a.config.base);
+            _a.FormioClass.setProjectUrl(options.projectUrl || _a.projectUrl || _a.config.project);
+            _a.FormioClass.language = _a.language;
+            _a.setLicense(_a.license || _a.config.license || false);
+            _a.modules.forEach((module) => {
+                _a.FormioClass.use(module);
             });
-            if (Formio.icons) {
-                Formio.FormioClass.icons = Formio.icons;
+            if (_a.icons) {
+                _a.FormioClass.icons = _a.icons;
             }
-            if (Formio.pathType) {
-                Formio.FormioClass.setPathType(Formio.pathType);
+            if (_a.pathType) {
+                _a.FormioClass.setPathType(_a.pathType);
             }
             // 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 (_a.config.template && _a.config.includeLibs) {
+                yield _a.addLibrary(libWrapper, _a.config.libs[_a.config.template], _a.config.template);
             }
             // Add the premium modules.
-            if (Formio.config.premium) {
-                Formio.config.modules.premium = Formio.config.premium;
+            if (_a.config.premium) {
+                _a.config.modules.premium = _a.config.premium;
             }
             // Allow adding dynamic modules.
-            if (Formio.config.modules) {
-                for (const name in Formio.config.modules) {
-                    const lib = Formio.config.modules[name];
+            if (_a.config.modules) {
+                for (const name in _a.config.modules) {
+                    const lib = _a.config.modules[name];
                     lib.use = lib.use || true;
-                    yield Formio.addLibrary(wrapper, lib, name);
+                    yield _a.addLibrary(libWrapper, lib, name);
                 }
             }
-            yield Formio.addStyles(wrapper, Formio.formioScript(Formio.config.style || `${Formio.cdn.js}/${renderer}.css`, builder));
-            if (Formio.config.before) {
-                yield Formio.config.before(Formio.FormioClass, element, Formio.config);
+            yield _a.addStyles(libWrapper, _a.formioScript(_a.config.style || `${_a.cdn.js}/${renderer}.css`, builder));
+            if (_a.config.before) {
+                yield _a.config.before(_a.FormioClass, element, _a.config);
             }
-            Formio.FormioClass.license = true;
-            Formio._formioReady(Formio.FormioClass);
+            _a.FormioClass.license = true;
+            _a._formioReady(_a.FormioClass);
             return wrapper;
         });
     }
@@ -322,48 +325,49 @@ class Formio {
             if (loader) {
                 wrapper.removeChild(loader);
             }
-            Formio.FormioClass.events.emit(readyEvent, instance);
-            if (Formio.config.after) {
-                Formio.debug('Calling ready callback');
-                Formio.config.after(instance, Formio.config);
+            _a.FormioClass.events.emit(readyEvent, instance);
+            if (_a.config.after) {
+                _a.debug('Calling ready callback');
+                _a.config.after(instance, _a.config);
             }
             return instance;
         });
     }
     // Create a new form.
-    static createForm(element, form, options = {}) {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (Formio.FormioClass) {
-                return Formio.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true }));
+    static createForm(element_1, form_1) {
+        return __awaiter(this, arguments, void 0, function* (element, form, options = {}) {
+            if (_a.FormioClass) {
+                return _a.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true }));
             }
-            const wrapper = yield Formio.init(element, options);
-            return Formio.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true })).then((instance) => {
+            const wrapper = yield _a.init(element, options);
+            return _a.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true })).then((instance) => {
                 // Set the default submission data.
-                if (Formio.config.submission) {
-                    Formio.debug('Setting submission', Formio.config.submission);
-                    instance.submission = Formio.config.submission;
+                if (_a.config.submission) {
+                    _a.debug('Setting submission', _a.config.submission);
+                    instance.submission = _a.config.submission;
                 }
                 // Call the after create method.
-                Formio.afterCreate(instance, wrapper, 'formEmbedded');
+                _a.afterCreate(instance, wrapper, 'formEmbedded');
                 return instance;
             });
         });
     }
     // Create a form builder.
-    static builder(element, form, options = {}) {
-        var _b;
-        return __awaiter(this, void 0, void 0, function* () {
-            if ((_b = Formio.FormioClass) === null || _b === void 0 ? void 0 : _b.builder) {
-                return Formio.FormioClass.builder(element, form, options);
+    static builder(element_1, form_1) {
+        return __awaiter(this, arguments, void 0, function* (element, form, options = {}) {
+            var _a;
+            if ((_a = _a.FormioClass) === null || _a === void 0 ? void 0 : _a.builder) {
+                return _a.FormioClass.builder(element, form, options);
             }
-            const wrapper = yield Formio.init(element, options, true);
-            return Formio.FormioClass.builder(element, form, options).then((instance) => {
-                Formio.afterCreate(instance, wrapper, 'builderEmbedded');
+            const wrapper = yield _a.init(element, options, true);
+            return _a.FormioClass.builder(element, form, options).then((instance) => {
+                _a.afterCreate(instance, wrapper, 'builderEmbedded');
                 return instance;
             });
         });
     }
 }
+exports.Formio = Formio;
 _a = Formio;
 Formio.FormioClass = null;
 Formio.config = {};
@@ -371,25 +375,24 @@ Formio.modules = [];
 Formio.icons = '';
 Formio.license = '';
 Formio.formioReady = new Promise((ready, reject) => {
-    Formio._formioReady = ready;
-    Formio._formioReadyReject = reject;
+    _a._formioReady = ready;
+    _a._formioReadyReject = reject;
 });
 Formio.version = 'FORMIO_VERSION';
 // Create a report.
 Formio.Report = {
-    create: (element, submission, options = {}) => __awaiter(void 0, void 0, void 0, function* () {
+    create: (element_1, submission_1, ...args_1) => __awaiter(void 0, [element_1, submission_1, ...args_1], void 0, function* (element, submission, options = {}) {
         var _b;
-        if ((_b = Formio.FormioClass) === null || _b === void 0 ? void 0 : _b.Report) {
-            return Formio.FormioClass.Report.create(element, submission, options);
+        if ((_b = _a.FormioClass) === null || _b === void 0 ? void 0 : _b.Report) {
+            return _a.FormioClass.Report.create(element, submission, options);
         }
-        const wrapper = yield Formio.init(element, options, true);
-        return Formio.FormioClass.Report.create(element, submission, options).then((instance) => {
-            Formio.afterCreate(instance, wrapper, 'reportEmbedded');
+        const wrapper = yield _a.init(element, options, true);
+        return _a.FormioClass.Report.create(element, submission, options).then((instance) => {
+            _a.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) {

package/lib/cjs/Webform.js

@@ -214,11 +214,13 @@ class Webform extends NestedDataComponent_1.default {
         this.language = this.i18next.language;
         // See if we need to restore the draft from a user.
         if (this.options.saveDraft && !this.options.skipDraftRestore) {
-            const user = Formio_1.Formio.getUser();
-            // Only restore a draft if the submission isn't explicitly set.
-            if (user && !this.submissionSet) {
-                this.restoreDraft(user._id);
-            }
+            this.formReady.then(() => {
+                const user = Formio_1.Formio.getUser();
+                // Only restore a draft if the submission isn't explicitly set.
+                if (user && !this.submissionSet) {
+                    this.restoreDraft(user._id);
+                }
+            });
         }
         this.component.clearOnHide = false;
         // Ensure the root is set to this component.
@@ -537,6 +539,10 @@ class Webform extends NestedDataComponent_1.default {
         if (form && form.properties) {
             this.options.properties = form.properties;
         }
+        // Use the sanitize config from the form settings or the global sanitize config if it is not provided in the options
+        if (!this.options.sanitizeConfig && !this.builderMode) {
+            this.options.sanitizeConfig = lodash_1.default.get(form, 'settings.sanitizeConfig') || lodash_1.default.get(form, 'globalSettings.sanitizeConfig');
+        }
         if ('schema' in form && (0, compare_versions_1.compareVersions)(form.schema, '1.x') > 0) {
             this.ready.then(() => {
                 this.setAlert('alert alert-danger', 'Form schema is for a newer version, please upgrade your renderer. Some functionality may not work.');
@@ -644,6 +650,11 @@ class Webform extends NestedDataComponent_1.default {
             return this.submissionReadyResolve(submission);
         }, (err) => this.submissionReadyReject(err)).catch((err) => this.submissionReadyReject(err));
     }
+    handleDraftError(errName, errDetails, restoreDraft) {
+        const errorMessage = lodash_1.default.trim(`${this.t(errName)} ${errDetails || ''}`);
+        console.warn(errorMessage);
+        this.emit(restoreDraft ? 'restoreDraftError' : 'saveDraftError', errDetails || errorMessage);
+    }
     /**
      * Saves a submission draft.
      */
@@ -652,11 +663,11 @@ class Webform extends NestedDataComponent_1.default {
             return;
         }
         if (!this.formio) {
-            console.warn(this.t('saveDraftInstanceError'));
+            this.handleDraftError('saveDraftInstanceError');
             return;
         }
         if (!Formio_1.Formio.getUser()) {
-            console.warn(this.t('saveDraftAuthError'));
+            this.handleDraftError('saveDraftAuthError');
             return;
         }
         const draft = (0, utils_1.fastCloneDeep)(this.submission);
@@ -669,6 +680,10 @@ class Webform extends NestedDataComponent_1.default {
                 this.submission._id = sub._id;
                 this.savingDraft = false;
                 this.emit('saveDraft', sub);
+            })
+                .catch(err => {
+                this.savingDraft = false;
+                this.handleDraftError('saveDraftError', err);
             });
         }
     }
@@ -679,7 +694,7 @@ class Webform extends NestedDataComponent_1.default {
      */
     restoreDraft(userId) {
         if (!this.formio) {
-            console.warn(this.t('restoreDraftInstanceError'));
+            this.handleDraftError('restoreDraftInstanceError', null, true);
             return;
         }
         this.savingDraft = true;
@@ -701,6 +716,11 @@ class Webform extends NestedDataComponent_1.default {
             this.draftEnabled = true;
             this.savingDraft = false;
             this.emit('restoreDraft', null);
+        })
+            .catch(err => {
+            this.draftEnabled = true;
+            this.savingDraft = false;
+            this.handleDraftError('restoreDraftError', err, true);
         });
     }
     get schema() {
@@ -879,7 +899,7 @@ class Webform extends NestedDataComponent_1.default {
     resetValue() {
         lodash_1.default.each(this.getComponents(), (comp) => (comp.resetValue()));
         this.setPristine(true);
-        this.onChange();
+        this.onChange({ resetValue: true });
     }
     /**
      * Sets a new alert to display in the error dialog of the form.
@@ -985,7 +1005,7 @@ class Webform extends NestedDataComponent_1.default {
         if (!Array.isArray(errors)) {
             errors = [errors];
         }
-        errors = errors.concat(this.serverErrors || []);
+        errors = errors.concat(this.customErrors);
         if (!errors.length) {
             this.setAlert(false);
             return;
@@ -1097,16 +1117,17 @@ class Webform extends NestedDataComponent_1.default {
         error = this.normalizeError(error);
         this.submitting = false;
         this.setPristine(false);
-        this.emit('submitError', error);
+        this.emit('submitError', error || this.errors);
         // Allow for silent cancellations (no error message, no submit button error state)
         if (error && error.silent) {
             this.emit('change', { isValid: true }, { silent: true });
             return false;
         }
-        this.showErrors(error, true);
+        const errors = this.showErrors(error, true);
         if (this.root && this.root.alert) {
             this.scrollIntoView(this.root.alert);
         }
+        return errors;
     }
     /**
      * Trigger the change event for this form.
@@ -1130,7 +1151,9 @@ class Webform extends NestedDataComponent_1.default {
         value.isValid = errors.length === 0;
         this.loading = false;
         if (this.submitted) {
-            this.showErrors(errors);
+            // show server errors while they are not cleaned/fixed
+            const nonComponentServerErrors = lodash_1.default.filter(this.serverErrors || [], err => !err.component && !err.path);
+            this.showErrors(nonComponentServerErrors.length ? nonComponentServerErrors : null);
         }
         // See if we need to save the draft of the form.
         if (modified && this.options.saveDraft) {