@formio/js 5.0.0-dev.5613.3476921 → 5.0.0-dev.5614.ea3660d

package/lib/cjs/Element.d.ts

@@ -117,11 +117,10 @@ export default class Element {
     removeEventListener(obj: any, type: any, func?: null): this | undefined;
     removeEventListeners(): void;
     removeAllEvents(includeExternal: any): void;
-    teardown(): void;
     /**
      * Removes all event listeners attached to this component.
      */
-    destroy(all?: boolean): void;
+    destroy(): void;
     /**
      * Append an HTML DOM element to a container.
      *

package/lib/cjs/Element.js

@@ -259,29 +259,20 @@ class Element {
         this.eventHandlers = [];
     }
     removeAllEvents(includeExternal) {
-        if (this.events) {
-            lodash_1.default.each(this.events._events, (events, type) => {
-                lodash_1.default.each(events, (listener) => {
-                    if (listener && (this.id === listener.id) && (includeExternal || listener.internal)) {
-                        this.events.off(type, listener);
-                    }
-                });
+        lodash_1.default.each(this.events._events, (events, type) => {
+            lodash_1.default.each(events, (listener) => {
+                if (listener && (this.id === listener.id) && (includeExternal || listener.internal)) {
+                    this.events.off(type, listener);
+                }
             });
-        }
-    }
-    teardown() {
-        delete this.i18next;
-        delete this.events;
+        });
     }
     /**
      * Removes all event listeners attached to this component.
      */
-    destroy(all = false) {
+    destroy() {
         this.removeEventListeners();
         this.removeAllEvents();
-        if (all) {
-            this.teardown();
-        }
     }
     /**
      * Append an HTML DOM element to a container.
@@ -426,7 +417,7 @@ class Element {
      * @param {Object} params - The i18n parameters to use for translation.
      */
     t(text, ...args) {
-        return this.i18next ? this.i18next.t(text, ...args) : text;
+        return this.i18next.t(text, ...args);
     }
     /**
      * Alias to create a text node.

package/lib/cjs/Form.js

@@ -63,9 +63,6 @@ class Form extends Element_1.default {
         });
         this.instance = null;
         if (args[0] instanceof HTMLElement) {
-            if (this.element) {
-                delete this.element.component;
-            }
             this.element = args[0];
             this.options = args[2] || {};
             this.options.events = this.events;
@@ -157,7 +154,7 @@ class Form extends Element_1.default {
      * @return {*}
      */
     set form(formParam) {
-        this.setForm(formParam);
+        return this.setForm(formParam);
     }
     errorForm(err) {
         return {
@@ -255,9 +252,6 @@ class Form extends Element_1.default {
         }
         // A redraw has occurred so save off the new element in case of a setDisplay causing a rebuild.
         return result.then(() => {
-            if (this.element) {
-                delete this.element.component;
-            }
             this.element = this.instance.element;
             return this.instance;
         });
@@ -378,9 +372,6 @@ class Form extends Element_1.default {
         if (!this.instance) {
             return Promise.reject('Form not ready. Use form.ready promise');
         }
-        if (this.element) {
-            delete this.element.component;
-        }
         this.element = element;
         return this.instance.attach(this.element)
             .then((param) => {
@@ -388,11 +379,6 @@ class Form extends Element_1.default {
             return param;
         });
     }
-    teardown() {
-        super.teardown();
-        delete this.instance;
-        delete this.ready;
-    }
 }
 exports.default = Form;
 // Allow simple embedding.

package/lib/cjs/PDF.js

@@ -62,15 +62,8 @@ class PDF extends Webform_1.default {
         this.postMessage({ name: 'redraw' });
         return this.builderMode ? Promise.resolve() : super.redraw();
     }
-    destroy(all = false) {
-        if (this.iframeElement) {
-            delete this.iframeElement.formioComponent;
-            this.iframeElement.formioComponent = null;
-        }
-        super.destroy(all);
-    }
     rebuild() {
-        if (this.attached && this.builderMode && this.component.components) {
+        if (this.builderMode && this.component.components) {
             this.destroyComponents();
             this.addComponents();
             return Promise.resolve();

package/lib/cjs/PDFBuilder.js

@@ -257,9 +257,9 @@ class PDFBuilder extends WebformBuilder_1.default {
         });
         return this.webform;
     }
-    destroy(all = false) {
-        super.destroy(all);
-        this.webform.destroy(all);
+    destroy(deleteFromGlobal) {
+        super.destroy(deleteFromGlobal);
+        this.webform.destroy(deleteFromGlobal);
     }
     // d8b 8888888888                                                                              888
     // Y8P 888                                                                                     888

package/lib/cjs/Webform.d.ts

@@ -382,6 +382,7 @@ declare class Webform extends NestedDataComponent {
      */
     init(): Promise<any>;
     executeFormController(): false | undefined;
+    destroy(deleteFromGlobal?: boolean): void;
     build(element: any): Promise<any>;
     getClassName(): string;
     render(): any;

package/lib/cjs/Webform.js

@@ -170,7 +170,7 @@ class Webform extends NestedDataComponent_1.default {
                 }
             });
         };
-        this.setElement(element);
+        this.element = element;
         // Keep track of all available forms globally.
         Formio_1.Formio.forms[this.id] = this;
         // Set the base url.
@@ -359,12 +359,10 @@ class Webform extends NestedDataComponent_1.default {
      * @return {*}
      */
     addLanguage(code, lang, active = false) {
-        if (this.i18next) {
-            var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(i18n_1.default.resources.en.translation), lang);
-            this.i18next.addResourceBundle(code, 'translation', translations, true, true);
-            if (active) {
-                this.language = code;
-            }
+        var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(i18n_1.default.resources.en.translation), lang);
+        this.i18next.addResourceBundle(code, 'translation', translations, true, true);
+        if (active) {
+            this.language = code;
         }
     }
     keyboardCatchableElement(element) {
@@ -911,21 +909,18 @@ class Webform extends NestedDataComponent_1.default {
             });
         });
     }
-    teardown() {
-        this.emit('formDelete', this.id);
-        delete Formio_1.Formio.forms[this.id];
-        delete this.executeShortcuts;
-        delete this.triggerSaveDraft;
-        super.teardown();
-    }
-    destroy(all = false) {
+    destroy(deleteFromGlobal = false) {
         this.off('submitButton');
         this.off('checkValidity');
         this.off('requestUrl');
         this.off('resetForm');
         this.off('deleteSubmission');
         this.off('refreshData');
-        return super.destroy(all);
+        if (deleteFromGlobal) {
+            this.emit('formDelete', this.id);
+            delete Formio_1.Formio.forms[this.id];
+        }
+        return super.destroy();
     }
     build(element) {
         if (element || this.element) {
@@ -959,7 +954,7 @@ class Webform extends NestedDataComponent_1.default {
         return this.attach(this.element);
     }
     attach(element) {
-        this.setElement(element);
+        this.element = element;
         this.loadRefs(element, { webform: 'single' });
         const childPromise = this.attachComponents(this.refs.webform);
         this.addEventListener(document, 'keydown', this.executeShortcuts);

package/lib/cjs/WebformBuilder.d.ts

@@ -118,6 +118,7 @@ export default class WebformBuilder extends Component {
     isParentSaveChildMethod(parentComp: any): boolean;
     getParentElement(element: any): any;
     addBuilderComponentInfo(component: any): any;
+    destroy(deleteFromGlobal: any): void;
     addBuilderGroup(name: any, group: any): void;
     updateBuilderGroup(name: any, group: any): void;
     generateKey(info: any): any;

package/lib/cjs/WebformBuilder.js

@@ -50,7 +50,7 @@ class WebformBuilder extends Component_1.default {
                 this.stopMoving(this.selectedComponent);
             }
         };
-        this.setElement(element);
+        this.element = element;
         this.dragulaLib = dragula_1.default;
         this.builderHeight = 0;
         this.schemas = {};
@@ -1119,11 +1119,16 @@ class WebformBuilder extends Component_1.default {
         const repeatablePaths = this.findRepeatablePaths();
         let hasInvalidComponents = false;
         this.webform.everyComponent((comp) => {
+            var _a;
             const path = comp.path;
+            const errors = comp.visibleErrors || [];
             if (repeatablePaths.includes(path)) {
-                comp.setCustomValidity(this.t('apiKey', { key: comp.key }));
+                comp.setCustomValidity(`API Key is not unique: ${comp.key}`);
                 hasInvalidComponents = true;
             }
+            else if (errors.length && ((_a = errors[0].message) === null || _a === void 0 ? void 0 : _a.startsWith('API Key is not unique'))) {
+                comp.setCustomValidity('');
+            }
         });
         this.emit('builderFormValidityChange', hasInvalidComponents);
     }
@@ -1576,11 +1581,11 @@ class WebformBuilder extends Component_1.default {
             this.webform.clear();
         }
     }
-    destroy(all = false) {
+    destroy(deleteFromGlobal) {
         if (this.webform.initialized) {
-            this.webform.destroy(all);
+            this.webform.destroy(deleteFromGlobal);
         }
-        super.destroy(all);
+        super.destroy(deleteFromGlobal);
     }
     addBuilderGroup(name, group) {
         if (!this.groups[name]) {

package/lib/cjs/Wizard.js

@@ -246,7 +246,7 @@ class Wizard extends Webform_1.default {
     }
     attach(element) {
         var _a;
-        this.setElement(element);
+        this.element = element;
         this.loadRefs(element, {
             [this.wizardKey]: 'single',
             [`${this.wizardKey}-header`]: 'single',

package/lib/cjs/addons/FormioAddon.d.ts

@@ -14,6 +14,5 @@ export default class FormioAddon extends Element {
     settings: any;
     attach(element: any): Promise<void>;
     _element: any;
-    destroy(): void;
 }
 import Element from '../Element';

package/lib/cjs/components/_classes/component/Component.d.ts

@@ -335,6 +335,7 @@ declare class Component extends Element {
     createComponentModal(element: any, modalShouldBeOpened: any, currentValue: any): ComponentModal;
     attach(element: any): Promise<void>;
     componentModal: any;
+    element: any;
     restoreFocus(): void;
     addShortcut(element: any, shortcut: any): void;
     removeShortcut(element: any, shortcut: any): void;
@@ -363,8 +364,6 @@ declare class Component extends Element {
      */
     inContext(component: any): boolean;
     get viewOnly(): any;
-    setElement(element: any): void;
-    element: any;
     createViewOnlyElement(): any;
     get defaultViewOnlyValue(): string;
     /**
@@ -492,12 +491,10 @@ declare class Component extends Element {
     /**
      * Add a new input error to this element.
      *
-     * @param {{level: string, message: string}[]} messages
+     * @param message
+     * @param dirty
      */
-    addMessages(messages: {
-        level: string;
-        message: string;
-    }[]): void;
+    addMessages(messages: any): void;
     setErrorClasses(elements: any, dirty: any, hasErrors: any, hasMessages: any, element?: any): void;
     setElementInvalid(element: any, invalid: any): void;
     clearOnHide(): void;

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

@@ -529,30 +529,10 @@ class Component extends Element_1.default {
         }
         return addon;
     }
-    teardown() {
-        if (this.element) {
-            delete this.element.component;
-            delete this.element;
-        }
-        delete this._currentForm;
-        delete this.parent;
-        delete this.root;
-        delete this.triggerChange;
-        delete this.triggerRedraw;
-        if (this.options) {
-            delete this.options.root;
-            delete this.options.parent;
-            delete this.options.i18next;
-        }
-        super.teardown();
-    }
-    destroy(all = false) {
-        super.destroy(all);
+    destroy() {
+        super.destroy();
         this.detach();
         this.addons.forEach((addon) => addon.destroy());
-        if (all) {
-            this.teardown();
-        }
     }
     get shouldDisabled() {
         return this.options.readOnly || this.component.disabled || (this.options.hasOwnProperty('disabled') && this.options.disabled[this.key]);
@@ -1106,7 +1086,7 @@ class Component extends Element_1.default {
             this.setOpenModalElement(openModalTemplate);
         }
         this.attached = true;
-        this.setElement(element);
+        this.element = element;
         element.component = this;
         // If this already has an id, get it from the dom. If SSR, it could be different from the initiated id.
         if (this.element.id) {
@@ -1165,17 +1145,6 @@ class Component extends Element_1.default {
      * Remove all event handlers.
      */
     detach() {
-        // First iterate through each ref and delete the component so there are no dangling component references.
-        lodash_1.default.each(this.refs, (ref) => {
-            if (typeof ref === NodeList) {
-                ref.forEach((elem) => {
-                    delete elem.component;
-                });
-            }
-            else if (ref) {
-                delete ref.component;
-            }
-        });
         this.refs = {};
         this.removeEventListeners();
         this.detachLogic();
@@ -1263,17 +1232,10 @@ class Component extends Element_1.default {
     get viewOnly() {
         return this.options.readOnly && this.options.viewAsHtml;
     }
-    setElement(element) {
-        if (this.element) {
-            delete this.element.component;
-            delete this.element;
-        }
-        this.element = element;
-    }
     createViewOnlyElement() {
-        this.setElement(this.ce('dl', {
+        this.element = this.ce('dl', {
             id: this.id
-        }));
+        });
         if (this.element) {
             // Ensure you can get the component info from the element.
             this.element.component = this;
@@ -1592,7 +1554,7 @@ class Component extends Element_1.default {
         const parent = this.element.parentNode;
         const index = Array.prototype.indexOf.call(parent.children, this.element);
         this.element.outerHTML = this.sanitize(this.render());
-        this.setElement(parent.children[index]);
+        this.element = parent.children[index];
         return this.attach(this.element);
     }
     rebuild() {
@@ -1831,7 +1793,8 @@ class Component extends Element_1.default {
     /**
      * Add a new input error to this element.
      *
-     * @param {{level: string, message: string}[]} messages
+     * @param message
+     * @param dirty
      */
     addMessages(messages) {
         if (!messages) {

package/lib/cjs/components/_classes/input/Input.js

@@ -272,22 +272,8 @@ class Input extends Multivalue_1.default {
         widget.on('redraw', () => this.redraw(), true);
         return widget;
     }
-    teardown() {
-        if (this.element && this.element.widget) {
-            this.element.widget.destroy();
-            delete this.element.widget;
-        }
-        if (this.refs && this.refs.input) {
-            for (let i = 0; i <= this.refs.input.length; i++) {
-                const widget = this.getWidget(i);
-                if (widget) {
-                    widget.destroy();
-                }
-            }
-        }
-        super.teardown();
-    }
     detach() {
+        super.detach();
         if (this.refs && this.refs.input) {
             for (let i = 0; i <= this.refs.input.length; i++) {
                 const widget = this.getWidget(i);
@@ -297,7 +283,6 @@ class Input extends Multivalue_1.default {
             }
         }
         this.refs.input = [];
-        super.detach();
     }
 }
 exports.default = Input;

package/lib/cjs/components/_classes/nested/NestedComponent.d.ts

@@ -82,7 +82,7 @@ export default class NestedComponent extends Field {
      * @param {Component} component - The component to remove from the components.
      * @param {Array<Component>} components - An array of components to remove this component from.
      */
-    removeComponent(component: Component, components: Array<Component>, all?: boolean): void;
+    removeComponent(component: Component, components: Array<Component>): void;
     /**
      * Removes a component provided the API key of that component.
      *
@@ -140,7 +140,7 @@ export default class NestedComponent extends Field {
     checkAsyncValidity(data: any, dirty: any, row: any, silentCheck: any): Promise<any>;
     setPristine(pristine: any): void;
     get isPristine(): any;
-    destroyComponents(all?: boolean): void;
+    destroyComponents(): void;
     get visibleErrors(): any;
     get errors(): any;
     get dataReady(): Promise<any[]>;

package/lib/cjs/components/_classes/nested/NestedComponent.js

@@ -329,7 +329,6 @@ class NestedComponent extends Field_1.default {
      */
     addComponents(data, options) {
         data = data || this.data;
-        this.components = this.components || [];
         options = options || this.options;
         if (options.components) {
             this.components = options.components;
@@ -441,9 +440,9 @@ class NestedComponent extends Field_1.default {
      * @param {Component} component - The component to remove from the components.
      * @param {Array<Component>} components - An array of components to remove this component from.
      */
-    removeComponent(component, components, all = false) {
+    removeComponent(component, components) {
         components = components || this.components;
-        component.destroy(all);
+        component.destroy();
         lodash_1.default.remove(components, { id: component.id });
         if (this.componentsMap[component.path]) {
             delete this.componentsMap[component.path];
@@ -668,13 +667,13 @@ class NestedComponent extends Field_1.default {
         });
         super.clear();
     }
-    destroy(all = false) {
-        this.destroyComponents(all);
-        super.destroy(all);
+    destroy() {
+        this.destroyComponents();
+        super.destroy();
     }
-    destroyComponents(all = false) {
+    destroyComponents() {
         const components = this.getComponents().slice();
-        components.forEach((comp) => this.removeComponent(comp, this.components, all));
+        components.forEach((comp) => this.removeComponent(comp, this.components));
         this.components = [];
     }
     get visibleErrors() {

package/lib/cjs/components/columns/Columns.js

@@ -151,8 +151,8 @@ class ColumnsComponent extends NestedComponent_1.default {
     detach(all) {
         super.detach(all);
     }
-    destroy(all = false) {
-        super.destroy(all);
+    destroy() {
+        super.destroy();
         this.columns = [];
     }
 }

package/lib/cjs/components/editgrid/EditGrid.d.ts

@@ -52,7 +52,7 @@ export default class EditGridComponent extends NestedArrayComponent {
     renderRow(row: any, rowIndex: any): any;
     eachComponent(fn: any, rowIndex: any): void;
     flattenComponents(rowIndex: any): {};
-    destroyComponents(all?: boolean, rowIndex?: number): void;
+    destroyComponents(rowIndex: any): void;
     createRow(dataObj: any, rowIndex: any): {
         components: any;
         data: any;

package/lib/cjs/components/editgrid/EditGrid.js

@@ -570,25 +570,20 @@ class EditGridComponent extends NestedArrayComponent_1.default {
         return result;
     }
     getComponents(rowIndex) {
-        var _a;
         // Ensure editrows is set.
         this.editRows = this.editRows || [];
         return this.builderMode
             ? super.getComponents()
             : lodash_1.default.isNumber(rowIndex)
-                ? (((_a = this.editRows[rowIndex]) === null || _a === void 0 ? void 0 : _a.components) || [])
+                ? (this.editRows[rowIndex].components || [])
                 : this.editRows.reduce((result, row) => result.concat(row.components || []), []);
     }
-    destroy(all = false) {
-        this.calculatedValue = undefined;
-        super.destroy(all);
-    }
-    destroyComponents(all = false, rowIndex = 0) {
+    destroyComponents(rowIndex) {
         if (this.builderMode) {
-            return super.destroyComponents(all);
+            return super.destroyComponents();
         }
         const components = this.getComponents(rowIndex).slice();
-        components.forEach((comp) => this.removeComponent(comp, this.components, all));
+        components.forEach((comp) => this.removeComponent(comp, this.components));
     }
     createRow(dataObj, rowIndex) {
         const editRow = {
@@ -761,7 +756,7 @@ class EditGridComponent extends NestedArrayComponent_1.default {
             case EditRowState.New: {
                 editRow.state = EditRowState.Removed;
                 this.clearErrors(rowIndex);
-                this.destroyComponents(false, rowIndex);
+                this.destroyComponents(rowIndex);
                 if (this.inlineEditMode) {
                     this.splice(rowIndex);
                 }
@@ -880,7 +875,7 @@ class EditGridComponent extends NestedArrayComponent_1.default {
     baseRemoveRow(rowIndex) {
         const editRow = this.editRows[rowIndex];
         editRow.state = EditRowState.Removed;
-        this.destroyComponents(false, rowIndex);
+        this.destroyComponents(rowIndex);
         return editRow;
     }
     removeRow(rowIndex, modified) {
@@ -903,15 +898,6 @@ class EditGridComponent extends NestedArrayComponent_1.default {
         this.redraw();
     }
     createRowComponents(row, rowIndex, recreatePartially) {
-        // Iterate through existing components and destroy the ones with the same rowIndex.
-        if (this.components) {
-            for (let i = 0; i < this.components.length; i++) {
-                if (this.components[i].rowIndex === rowIndex) {
-                    this.components[i].destroy();
-                    this.components.splice(i, 1);
-                }
-            }
-        }
         const currentRowComponents = lodash_1.default.get(this.editRows, `[${rowIndex}].components`, null);
         return this.component.components.map((col, colIndex) => {
             var _a;
@@ -1193,7 +1179,7 @@ class EditGridComponent extends NestedArrayComponent_1.default {
         });
     }
     emptyRows() {
-        this.editRows.forEach((editRow, index) => this.destroyComponents(false, index));
+        this.editRows.forEach((editRow, index) => this.destroyComponents(index));
         this.editRows = [];
     }
     resetValue() {

package/lib/cjs/components/file/File.d.ts

@@ -167,6 +167,5 @@ export default class FileComponent extends Field {
     getFile(fileInfo: any): any;
     focus(): void;
     beforeSubmit(): Promise<void>;
-    destroy(all: any): void;
 }
 import Field from '../_classes/field/Field';

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

@@ -1031,9 +1031,9 @@ class FileComponent extends Field_1.default {
             }
         });
     }
-    destroy(all) {
+    destroy() {
         this.stopVideo();
-        super.destroy(all);
+        super.destroy();
     }
 }
 exports.default = FileComponent;

package/lib/cjs/components/form/Form.js

@@ -332,13 +332,13 @@ class FormComponent extends Component_1.default {
             && lodash_1.default.isNumber(this.formObj._vid)
             && this.formObj._vid !== this.subFormRevision;
     }
-    destroy(all = false) {
+    destroy() {
         if (this.subForm) {
-            this.subForm.destroy(all);
+            this.subForm.destroy();
             this.subForm = null;
             this.subFormReady = null;
         }
-        super.destroy(all);
+        super.destroy();
     }
     redraw() {
         if (this.subForm) {

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

@@ -811,9 +811,7 @@ class SelectComponent extends ListComponent_1.default {
         }
         const tabIndex = input.tabIndex;
         this.addPlaceholder();
-        if (this.i18next) {
-            input.setAttribute('dir', this.i18next.dir());
-        }
+        input.setAttribute('dir', this.i18next.dir());
         if ((_c = (_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.containerOuter) === null || _b === void 0 ? void 0 : _b.element) === null || _c === void 0 ? void 0 : _c.parentNode) {
             this.choices.destroy();
         }
@@ -1546,6 +1544,7 @@ class SelectComponent extends ListComponent_1.default {
     }
     detach() {
         var _a, _b;
+        super.detach();
         this.off('blur');
         if (this.choices) {
             if ((_b = (_a = this.choices.containerOuter) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.parentNode) {
@@ -1553,7 +1552,6 @@ class SelectComponent extends ListComponent_1.default {
             }
             this.choices = null;
         }
-        super.detach();
     }
     focus() {
         if (this.focusableElement) {