@formio/js 5.0.0-dev.5633.8d2b30d → 5.0.0-dev.5633.fde3bc9

package/lib/mjs/Form.js

@@ -4,28 +4,119 @@ import Displays from './displays';
 import templates from './templates';
 import * as FormioUtils from './utils/utils';
 export default class Form extends Element {
+    /**
+     * Represents a JSON value.
+     * @typedef {(string | number | boolean | null | JSONArray | JSONObject)} JSON
+     */
+    /**
+     * Represents a JSON array.
+     * @typedef {Array<JSON>} JSONArray
+     */
+    /**
+     * Represents a JSON object.
+     * @typedef {{[key: string]: JSON}} JSONObject
+     */
+    /**
+     * @typedef {object} FormioHooks
+     * @property {Function} [beforeSubmit] - Called before a submission is made.
+     * @property {Function} [beforeCancel] - Called before a cancel is made.
+     * @property {Function} [beforeNext] - Called before the next page is navigated to.
+     * @property {Function} [beforePrev] - Called before the previous page is navigated to.
+     * @property {Function} [attachComponent] - Called when a component is attached.
+     * @property {Function} [setDataValue] - Called when a data value is set.
+     * @property {Function} [addComponents] - Called when components are added.
+     * @property {Function} [addComponent] - Called when a component is added.
+     * @property {Function} [customValidation] - Called when a custom validation is made.
+     * @property {Function} [attachWebform] - Called when a webform is attached.
+     */
+    /**
+     * @typedef {object} SanitizeConfig
+     * @property {string[]} [addAttr] - The html attributes to allow with sanitization.
+     * @property {string[]} [addTags] - The html tags to allow with sanitization.
+     * @property {string[]} [allowedAttrs] - The html attributes to allow with sanitization.
+     * @property {string[]} [allowedTags] - The html tags to allow with sanitization.
+     * @property {string[]} [allowedUriRegex] - The regex for allowed URIs.
+     * @property {string[]} [addUriSafeAttr] - The URI attributes to allow with sanitization.
+     */
+    /**
+     * @typedef {object} ButtonSettings
+     * @property {boolean} [showPrevious] - Show the previous button in wizard forms.
+     * @property {boolean} [showNext] - Show the next button in wizard forms.
+     * @property {boolean} [showCancel] - Show the cancel button in wizard forms.
+     * @property {boolean} [showSubmit] - Show the submit button in wizard forms.
+     */
+    /**
+     * @typedef {object} FormOptions
+     * @property {boolean} [saveDraft] - Enable the save draft feature.
+     * @property {number} [saveDraftThrottle] - The throttle for the save draft feature.
+     * @property {boolean} [readOnly] - Set this form to readOnly.
+     * @property {boolean} [noAlerts] - Disable the alerts dialog.
+     * @property {{[key: string]: string}} [i18n] - The translation file for this rendering.
+     * @property {string} [template] - Custom logic for creation of elements.
+     * @property {boolean} [noDefaults] - Exclude default values from the settings.
+     * @property {any} [fileService] - The file service for this form.
+     * @property {EventEmitter} [events] - The EventEmitter for this form.
+     * @property {string} [language] - The language to render this form in.
+     * @property {{[key: string]: string}} [i18next] - The i18next configuration for this form.
+     * @property {boolean} [viewAsHtml] - View the form as raw HTML.
+     * @property {'form' | 'html' | 'flat' | 'builder' | 'pdf'} [renderMode] - The render mode for this form.
+     * @property {boolean} [highlightErrors] - Highlight any errors on the form.
+     * @property {string} [componentErrorClass] - The error class for components.
+     * @property {any} [templates] - The templates for this form.
+     * @property {string} [iconset] - The iconset for this form.
+     * @property {import('@formio/core').Component[]} [components] - The components for this form.
+     * @property {{[key: string]: boolean}} [disabled] - Disabled components for this form.
+     * @property {boolean} [showHiddenFields] - Show hidden fields.
+     * @property {{[key: string]: boolean}} [hide] - Hidden components for this form.
+     * @property {{[key: string]: boolean}} [show] - Components to show for this form.
+     * @property {Formio} [formio] - The Formio instance for this form.
+     * @property {string} [decimalSeparator] - The decimal separator for this form.
+     * @property {string} [thousandsSeparator] - The thousands separator for this form.
+     * @property {FormioHooks} [hooks] - The hooks for this form.
+     * @property {boolean} [alwaysDirty] - Always be dirty.
+     * @property {boolean} [skipDraftRestore] - Skip restoring a draft.
+     * @property {'form' | 'wizard' | 'pdf'} [display] - The display for this form.
+     * @property {string} [cdnUrl] - The CDN url for this form.
+     * @property {boolean} [flatten] - Flatten the form.
+     * @property {boolean} [sanitize] - Sanitize the form.
+     * @property {SanitizeConfig} [sanitizeConfig] - The sanitize configuration for this form.
+     * @property {ButtonSettings} [buttonSettings] - The button settings for this form.
+     * @property {object} [breadcrumbSettings] - The breadcrumb settings for this form.
+     * @property {boolean} [allowPrevious] - Allow the previous button (for Wizard forms).
+     * @property {string[]} [wizardButtonOrder] - The order of the buttons (for Wizard forms).
+     * @property {boolean} [showCheckboxBackground] - Show the checkbox background.
+     * @property {number} [zoom] - The zoom for PDF forms.
+     */
     /**
      * Creates an easy to use interface for embedding webforms, pdfs, and wizards into your application.
-     *
-     * @param {Object} element - The DOM element you wish to render this form within.
-     * @param {Object | string} form - Either a Form JSON schema or the URL of a hosted form via. form.io.
-     * @param {Object} options - The options to create a new form instance.
-     * @param {boolean} options.readOnly - Set this form to readOnly
-     * @param {boolean} options.noAlerts - Set to true to disable the alerts dialog.
-     * @param {boolean} options.i18n - The translation file for this rendering. @see https://github.com/formio/formio.js/blob/master/i18n.js
-     * @param {boolean} options.template - Provides a way to inject custom logic into the creation of every element rendered within the form.
-     *
+     * @param {object} elementOrForm - The DOM element you wish to render this form within, or the form definition.
+     * @param {object | string | FormOptions} formOrOptions - A Form JSON schema, the URL of a hosted form, or the form options.
+     * @param {FormOptions} [options] - The options to create a new form instance.
      * @example
      * import Form from '@formio/js/Form';
      * const form = new Form(document.getElementById('formio'), 'https://examples.form.io/example');
      * form.build();
      */
-    constructor(...args) {
-        let options = args[0] instanceof HTMLElement ? args[2] : args[1];
+    /**
+     * @type {FormOptions} - the options for this Form.
+     */
+    options;
+    constructor(elementOrForm, formOrOptions, options = {}) {
+        let element, form, formOptions;
+        if (elementOrForm instanceof HTMLElement) {
+            element = elementOrForm;
+            form = formOrOptions;
+            formOptions = options;
+        }
+        else {
+            element = null;
+            form = elementOrForm;
+            formOptions = formOrOptions || {};
+        }
         if (Formio.options && Formio.options.form) {
-            options = Object.assign(options, Formio.options.form);
+            formOptions = Object.assign(formOptions, Formio.options.form);
         }
-        super(options);
+        super(formOptions);
         if (this.options.useSessionToken) {
             Formio.useSessionToken(this.options);
         }
@@ -34,30 +125,22 @@ export default class Form extends Element {
             this.readyReject = reject;
         });
         this.instance = null;
-        if (args[0] instanceof HTMLElement) {
+        if (element) {
             if (this.element) {
                 delete this.element.component;
             }
-            this.element = args[0];
-            this.options = args[2] || {};
-            this.options.events = this.events;
-            this.setForm(args[1])
-                .then(() => this.readyResolve(this.instance))
-                .catch(this.readyReject);
+            this.element = element;
         }
-        else if (args[0]) {
+        else {
             this.element = null;
-            this.options = args[1] || {};
-            this.options.events = this.events;
-            this.setForm(args[0])
+        }
+        if (form) {
+            this.setForm(form)
                 .then(() => this.readyResolve(this.instance))
                 .catch(this.readyReject);
         }
-        else {
-            this.element = null;
-            this.options = {};
-            this.options.events = this.events;
-        }
+        this.options = formOptions;
+        this.options.events = this.events;
         this.display = '';
     }
     createElement(tag, attrs, children) {
@@ -105,9 +188,8 @@ export default class Form extends Element {
     }
     /**
      * Create a new form instance provided the display of the form.
-     *
      * @param {string} display - The display of the form, either "wizard", "form", or "pdf"
-     * @return {*}
+     * @returns {Webform|Wizard|PDF} - The new form instance for the display.
      */
     create(display) {
         if (this.options && (this.options.flatten || this.options.renderMode === 'flat')) {
@@ -124,9 +206,8 @@ export default class Form extends Element {
     }
     /**
      * Sets the form. Either as JSON or a URL to a form JSON schema.
-     *
      * @param {string|object} formParam - Either the form JSON or the URL of the form json.
-     * @return {*}
+     * @returns {void}
      */
     set form(formParam) {
         this.setForm(formParam);
@@ -153,12 +234,11 @@ export default class Form extends Element {
         };
     }
     /**
-    * Check Subdirectories path and provide correct options
-    *
-    * @param {string} url - The the URL of the form json.
-    * @param {form} object - The form json.
-    * @return {object} The initial options with base and project.
-    */
+     * Check Subdirectories path and provide correct options
+     * @param {string} url - The the URL of the form json.
+     * @param {import('@formio/core').Form} form - The form json.
+     * @returns {object} The initial options with base and project.
+     */
     getFormInitOptions(url, form) {
         const options = {};
         const index = url.indexOf(form?.path);
@@ -182,6 +262,11 @@ export default class Form extends Element {
         }
         return {};
     }
+    /**
+     * Sets the form to the JSON schema of a form.
+     * @param {import('@formio/core').Form} formParam - The form JSON to set this form to.
+     * @returns {Promise<Webform|Wizard|PDF>} - The webform instance that was created.
+     */
     setForm(formParam) {
         let result;
         formParam = formParam || this.form;
@@ -242,17 +327,15 @@ export default class Form extends Element {
     }
     /**
      * Returns the loaded forms JSON.
-     *
-     * @return {object} - The loaded form's JSON
+     * @returns {object} - The loaded form's JSON
      */
     get form() {
         return this._form;
     }
     /**
      * Changes the display of the form.
-     *
      * @param {string} display - The display to set this form. Either "wizard", "form", or "pdf"
-     * @return {Promise<T>}
+     * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created after changing the display.
      */
     setDisplay(display) {
         if ((this.display === display) && this.instance) {
@@ -293,9 +376,9 @@ export default class Form extends Element {
     }
     /**
      * Sanitize an html string.
-     *
-     * @param string
-     * @returns {*}
+     * @param {string} dirty - The dirty html string to sanitize.
+     * @param {boolean} forceSanitize - If the string should be force sanitized.
+     * @returns {string} - The sanitized html string.
      */
     sanitize(dirty, forceSanitize) {
         // If Sanitize is turned off
@@ -313,8 +396,7 @@ export default class Form extends Element {
     }
     /**
      * Build a new form.
-     *
-     * @return {Promise<T>}
+     * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created.
      */
     build() {
         if (!this.instance) {
@@ -369,15 +451,16 @@ export default class Form extends Element {
 // Allow simple embedding.
 Formio.embedForm = (embed) => Form.embed(embed);
 /**
- * Factory that creates a new form based on the form parameters.
- *
- * @param element {HMTLElement} - The HTML Element to add this form to.
- * @param form {string|Object} - The src of the form, or a form object.
- * @param options {Object} - The options to create this form.
- *
- * @return {Promise} - When the form is instance is ready.
+ * Creates an easy to use interface for embedding webforms, pdfs, and wizards into your application.
+ * @param {object} elementOrForm - The DOM element you wish to render this form within, or the form definition.
+ * @param {object | string | FormOptions} formOrOptions - A Form JSON schema, the URL of a hosted form, or the form options.
+ * @param {FormOptions} [options] - The options to create a new form instance.
+ * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created.
+ * @example
+ * import { Formio } from '@formio/js';
+ * Formio.createForm(document.getElementById('formio'), 'https://examples.form.io/example');
  */
-Formio.createForm = (...args) => {
-    return (new Form(...args)).ready;
+Formio.createForm = (elementOrForm, formOrOptions, options) => {
+    return (new Form(elementOrForm, formOrOptions, options)).ready;
 };
 Formio.Form = Form;

package/lib/mjs/FormBuilder.d.ts

@@ -1,6 +1,191 @@
 export default class FormBuilder extends Form {
-    static options: {};
-    constructor(element: any, form: any, options: any);
+    /**
+     * @typedef FormBuilderOptions
+     * @property {string[]} [disabled] - An array of "keys" of components that should be disabled within the form builder. Example: ['firstName', 'lastName']
+     * @property {boolean} [noNewEdit] - When set to TRUE no modal is shown when a component is dragged onto the form.
+     * @property {boolean} [noDefaultSubmitButton] - Set to TRUE to not include the default submit button in Webforms.
+     * @property {boolean} [alwaysConfirmComponentRemoval] - Set to TRUE to always require confirmation before removing a component.
+     * @property {object} [formConfig] - Form configurations to apply to forms being created. These configurations are added to the "config" property of the form object.
+     * @property {string} [resourceTag] - The tag to use to query for the "Existing Resource Fields" section of the builder.
+     * @property {import('./Form').FormOptions} [editForm] - The options to apply to the Edit Form (the form that shows inside the modal when you edit a component).
+     * @property {string} [language] - The language to load into the form builder.
+     * @property {object} [builder] - The builder options to pass to the builder.
+     * @property {'form'|'wizard'|'pdf'} [display] - The display mode of the builder.
+     * @property {string} [resourceFilter] - Filter applied to the resources that appear in the builder's Existing Resource Fields.
+     * @property {boolean} [noSource] - When set to TRUE, the resource ID in the builder's Existing Resource Fields will not be linked.
+     * @property {boolean} [showFullJsonSchema] - When set to TRUE, the full JSON schema will be displayed in the JSON edit menu.
+     */
+    /** @type {FormBuilderOptions} */
+    static options: {
+        /**
+         * - An array of "keys" of components that should be disabled within the form builder. Example: ['firstName', 'lastName']
+         */
+        disabled?: string[] | undefined;
+        /**
+         * - When set to TRUE no modal is shown when a component is dragged onto the form.
+         */
+        noNewEdit?: boolean | undefined;
+        /**
+         * - Set to TRUE to not include the default submit button in Webforms.
+         */
+        noDefaultSubmitButton?: boolean | undefined;
+        /**
+         * - Set to TRUE to always require confirmation before removing a component.
+         */
+        alwaysConfirmComponentRemoval?: boolean | undefined;
+        /**
+         * - Form configurations to apply to forms being created. These configurations are added to the "config" property of the form object.
+         */
+        formConfig?: object | undefined;
+        /**
+         * - The tag to use to query for the "Existing Resource Fields" section of the builder.
+         */
+        resourceTag?: string | undefined;
+        /**
+         * - The options to apply to the Edit Form (the form that shows inside the modal when you edit a component).
+         */
+        editForm?: any;
+        /**
+         * - The language to load into the form builder.
+         */
+        language?: string | undefined;
+        /**
+         * - The builder options to pass to the builder.
+         */
+        builder?: object | undefined;
+        /**
+         * - The display mode of the builder.
+         */
+        display?: "form" | "pdf" | "wizard" | undefined;
+        /**
+         * - Filter applied to the resources that appear in the builder's Existing Resource Fields.
+         */
+        resourceFilter?: string | undefined;
+        /**
+         * - When set to TRUE, the resource ID in the builder's Existing Resource Fields will not be linked.
+         */
+        noSource?: boolean | undefined;
+        /**
+         * - When set to TRUE, the full JSON schema will be displayed in the JSON edit menu.
+         */
+        showFullJsonSchema?: boolean | undefined;
+    };
+    /**
+     * Creates a new form builder.
+     * @param {HTMLElement} element - The HTML element to place the form builder.
+     * @param {string | object} form - The form to pass to the builder
+     * @param {FormBuilderOptions} options - The options to create this builder.
+     * @returns {FormBuilder} - The form builder instance.
+     */
+    constructor(element: HTMLElement, form: string | object, options: {
+        /**
+         * - An array of "keys" of components that should be disabled within the form builder. Example: ['firstName', 'lastName']
+         */
+        disabled?: string[] | undefined;
+        /**
+         * - When set to TRUE no modal is shown when a component is dragged onto the form.
+         */
+        noNewEdit?: boolean | undefined;
+        /**
+         * - Set to TRUE to not include the default submit button in Webforms.
+         */
+        noDefaultSubmitButton?: boolean | undefined;
+        /**
+         * - Set to TRUE to always require confirmation before removing a component.
+         */
+        alwaysConfirmComponentRemoval?: boolean | undefined;
+        /**
+         * - Form configurations to apply to forms being created. These configurations are added to the "config" property of the form object.
+         */
+        formConfig?: object | undefined;
+        /**
+         * - The tag to use to query for the "Existing Resource Fields" section of the builder.
+         */
+        resourceTag?: string | undefined;
+        /**
+         * - The options to apply to the Edit Form (the form that shows inside the modal when you edit a component).
+         */
+        editForm?: any;
+        /**
+         * - The language to load into the form builder.
+         */
+        language?: string | undefined;
+        /**
+         * - The builder options to pass to the builder.
+         */
+        builder?: object | undefined;
+        /**
+         * - The display mode of the builder.
+         */
+        display?: "form" | "pdf" | "wizard" | undefined;
+        /**
+         * - Filter applied to the resources that appear in the builder's Existing Resource Fields.
+         */
+        resourceFilter?: string | undefined;
+        /**
+         * - When set to TRUE, the resource ID in the builder's Existing Resource Fields will not be linked.
+         */
+        noSource?: boolean | undefined;
+        /**
+         * - When set to TRUE, the full JSON schema will be displayed in the JSON edit menu.
+         */
+        showFullJsonSchema?: boolean | undefined;
+    });
+    /** @type {FormBuilderOptions} */
+    options: {
+        /**
+         * - An array of "keys" of components that should be disabled within the form builder. Example: ['firstName', 'lastName']
+         */
+        disabled?: string[] | undefined;
+        /**
+         * - When set to TRUE no modal is shown when a component is dragged onto the form.
+         */
+        noNewEdit?: boolean | undefined;
+        /**
+         * - Set to TRUE to not include the default submit button in Webforms.
+         */
+        noDefaultSubmitButton?: boolean | undefined;
+        /**
+         * - Set to TRUE to always require confirmation before removing a component.
+         */
+        alwaysConfirmComponentRemoval?: boolean | undefined;
+        /**
+         * - Form configurations to apply to forms being created. These configurations are added to the "config" property of the form object.
+         */
+        formConfig?: object | undefined;
+        /**
+         * - The tag to use to query for the "Existing Resource Fields" section of the builder.
+         */
+        resourceTag?: string | undefined;
+        /**
+         * - The options to apply to the Edit Form (the form that shows inside the modal when you edit a component).
+         */
+        editForm?: any;
+        /**
+         * - The language to load into the form builder.
+         */
+        language?: string | undefined;
+        /**
+         * - The builder options to pass to the builder.
+         */
+        builder?: object | undefined;
+        /**
+         * - The display mode of the builder.
+         */
+        display?: "form" | "pdf" | "wizard" | undefined;
+        /**
+         * - Filter applied to the resources that appear in the builder's Existing Resource Fields.
+         */
+        resourceFilter?: string | undefined;
+        /**
+         * - When set to TRUE, the resource ID in the builder's Existing Resource Fields will not be linked.
+         */
+        noSource?: boolean | undefined;
+        /**
+         * - When set to TRUE, the full JSON schema will be displayed in the JSON edit menu.
+         */
+        showFullJsonSchema?: boolean | undefined;
+    };
     create(display: any): any;
 }
 import Form from './Form';

package/lib/mjs/FormBuilder.js

@@ -2,7 +2,33 @@ import { Formio } from './Formio';
 import Builders from './builders';
 import Form from './Form';
 export default class FormBuilder extends Form {
+    /**
+     * @typedef FormBuilderOptions
+     * @property {string[]} [disabled] - An array of "keys" of components that should be disabled within the form builder. Example: ['firstName', 'lastName']
+     * @property {boolean} [noNewEdit] - When set to TRUE no modal is shown when a component is dragged onto the form.
+     * @property {boolean} [noDefaultSubmitButton] - Set to TRUE to not include the default submit button in Webforms.
+     * @property {boolean} [alwaysConfirmComponentRemoval] - Set to TRUE to always require confirmation before removing a component.
+     * @property {object} [formConfig] - Form configurations to apply to forms being created. These configurations are added to the "config" property of the form object.
+     * @property {string} [resourceTag] - The tag to use to query for the "Existing Resource Fields" section of the builder.
+     * @property {import('./Form').FormOptions} [editForm] - The options to apply to the Edit Form (the form that shows inside the modal when you edit a component).
+     * @property {string} [language] - The language to load into the form builder.
+     * @property {object} [builder] - The builder options to pass to the builder.
+     * @property {'form'|'wizard'|'pdf'} [display] - The display mode of the builder.
+     * @property {string} [resourceFilter] - Filter applied to the resources that appear in the builder's Existing Resource Fields.
+     * @property {boolean} [noSource] - When set to TRUE, the resource ID in the builder's Existing Resource Fields will not be linked.
+     * @property {boolean} [showFullJsonSchema] - When set to TRUE, the full JSON schema will be displayed in the JSON edit menu.
+     */
+    /** @type {FormBuilderOptions} */
     static options = {};
+    /** @type {FormBuilderOptions} */
+    options;
+    /**
+     * Creates a new form builder.
+     * @param {HTMLElement} element - The HTML element to place the form builder.
+     * @param {string | object} form - The form to pass to the builder
+     * @param {FormBuilderOptions} options - The options to create this builder.
+     * @returns {FormBuilder} - The form builder instance.
+     */
     constructor(element, form, options) {
         form = form || {};
         options = options || {};
@@ -20,14 +46,12 @@ export default class FormBuilder extends Form {
 }
 /**
  * Factory that creates a new form builder based on the form parameter.
- *
- * @param element {HMTLElement} - The HTML Element to add this form to.
- * @param form {string|Object} - The src of the form, or a form object.
- * @param options {Object} - The options to create this form.
- *
- * @return {Promise} - When the form is instance is ready.
+ * @param {HTMLElement} element - The HTML Element to add this form to.
+ * @param {string|object} form - The src of the form, or a form object.
+ * @param {object} options - The options to create this form.
+ * @returns {Promise} - When the form is instance is ready.
  */
-Formio.builder = (...args) => {
-    return (new FormBuilder(...args)).ready;
+Formio.builder = (element, form, options) => {
+    return (new FormBuilder(element, form, options)).ready;
 };
 Formio.FormBuilder = FormBuilder;

package/lib/mjs/InlineEmbed.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Inline embed a form within a webpage.
+ * @param {*} config - Configuration to configure how the inline embed is rendered.
+ */
+export function embed(config?: any): void;
+export { Formio };
+import { Formio } from './Embed';

package/lib/mjs/InlineEmbed.js

@@ -0,0 +1,112 @@
+import { Formio } from './Embed';
+/**
+ * Inline embed a form within a webpage.
+ * @param {*} config - Configuration to configure how the inline embed is rendered.
+ */
+export function embed(config = {}) {
+    const scripts = document.getElementsByTagName('script');
+    config = Object.assign({}, window.FormioConfig || {}, config);
+    let thisScript = null;
+    let i = scripts.length;
+    const scriptName = config.scriptName || 'formio.embed.';
+    while (i--) {
+        if (scripts[i].src && (scripts[i].src.indexOf(scriptName) !== -1)) {
+            thisScript = scripts[i];
+            break;
+        }
+    }
+    if (thisScript) {
+        const query = {};
+        const queryString = thisScript.src.replace(/^[^?]+\??/, '');
+        queryString.replace(/\?/g, '&').split('&').forEach((item) => {
+            query[item.split('=')[0]] = item.split('=')[1] && decodeURIComponent(item.split('=')[1]);
+        });
+        let scriptSrc = thisScript.src.replace(/^([^?]+).*/, '$1').split('/');
+        scriptSrc.pop();
+        let cdnSrc = '';
+        if (['js', 'offline'].includes(scriptSrc[scriptSrc.length - 1])) {
+            scriptSrc.pop();
+            scriptSrc = cdnSrc = scriptSrc.join('/');
+            scriptSrc += '/js';
+        }
+        else {
+            scriptSrc = scriptSrc.join('/');
+        }
+        const debug = (query.debug === 'true' || query.debug === '1');
+        const renderer = debug ? 'formio.form' : 'formio.form.min';
+        Formio.config = Object.assign({
+            script: query.script || (`${scriptSrc}/${renderer}.js`),
+            style: query.styles || (`${scriptSrc}/${renderer}.css`),
+            cdn: query.cdn || cdnSrc,
+            class: (query.class || 'formio-form-wrapper'),
+            src: query.src,
+            form: null,
+            submission: null,
+            project: query.project,
+            base: query.base || 'https://api.form.io',
+            submit: query.submit,
+            includeLibs: (query.libs === 'true' || query.libs === '1'),
+            noshadow: (query.shadow === 'false' || query.shadow === '0'),
+            template: query.template || 'bootstrap',
+            debug: debug,
+            config: {},
+            redirect: (query.return || query.redirect),
+            embedCSS: (`${scriptSrc}/formio.embed.css`),
+            success: query.success || 'Thank you for your submission!',
+            before: null,
+            after: null
+        }, config);
+        if (Formio.config.alter) {
+            Formio.config.alter(Formio.config);
+        }
+        const form = (Formio.config.form || Formio.config.src);
+        if (form) {
+            Formio.debug('Embedding Configuration', config);
+            // The id for this embedded form.
+            Formio.config.id = `formio-${Math.random().toString(36).substring(7)}`;
+            Formio.debug('Creating form element');
+            const element = Formio.createElement('div', {
+                'id': Formio.config.id,
+                class: Formio.config.class
+            });
+            // insertAfter doesn't exist, but effect is identical.
+            thisScript.parentNode.insertBefore(element, thisScript.parentNode.firstElementChild.nextSibling);
+            Formio.createForm(element, form, Formio.config.config).then((instance) => {
+                if (Formio.config.submit) {
+                    instance.nosubmit = true;
+                }
+                // Trigger the submit done event.
+                instance.on('submitDone', (submission) => Formio.submitDone(instance, submission));
+                // Configure a redirect.
+                instance.on('submit', (submission) => {
+                    Formio.debug("on('submit')", submission);
+                    if (Formio.config.submit) {
+                        Formio.debug(`Sending submission to ${Formio.config.submit}`);
+                        const headers = {
+                            'content-type': 'application/json'
+                        };
+                        const token = Formio.FormioClass.getToken();
+                        if (token) {
+                            headers['x-jwt-token'] = token;
+                        }
+                        Formio.FormioClass.fetch(Formio.config.submit, {
+                            body: JSON.stringify(submission),
+                            headers: headers,
+                            method: 'POST',
+                            mode: 'cors',
+                        })
+                            .then(resp => resp.json())
+                            .then((submission) => {
+                            Formio.submitDone(instance, submission);
+                        });
+                    }
+                });
+            });
+        }
+    }
+    else {
+        // Show an error if the script cannot be found.
+        document.write('<span>Could not locate the Embedded form.</span>');
+    }
+}
+export { Formio };