@formio/js 5.0.0-rc.20 → 5.0.0-rc.22

package/lib/mjs/components/signature/Signature.js

@@ -2,6 +2,7 @@ import SignaturePad from 'signature_pad';
 import _ResizeObserver from 'resize-observer-polyfill';
 import Input from '../_classes/input/Input';
 import _ from 'lodash';
+import { componentValueTypes, getComponentSavedTypes } from '../../utils/utils';
 export default class SignatureComponent extends Input {
     static schema(...extend) {
         return Input.schema({
@@ -29,11 +30,18 @@ export default class SignatureComponent extends Input {
         };
     }
     static get serverConditionSettings() {
+        return SignatureComponent.conditionOperatorsSettings;
+    }
+    static get conditionOperatorsSettings() {
         return {
-            ...super.serverConditionSettings,
+            ...super.conditionOperatorsSettings,
             operators: ['isEmpty', 'isNotEmpty'],
         };
     }
+    static savedValueTypes(schema) {
+        schema = schema || {};
+        return getComponentSavedTypes(schema) || [componentValueTypes.string];
+    }
     init() {
         super.init();
         this.currentWidth = 0;

package/lib/mjs/components/survey/Survey.d.ts

@@ -7,6 +7,27 @@ export default class SurveyComponent extends Field {
         documentation: string;
         schema: any;
     };
+    static get serverConditionSettings(): {
+        operators: string[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+    };
+    static get conditionOperatorsSettings(): {
+        operators: string[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+    };
+    static savedValueTypes(schema: any): string[];
     render(): any;
     setValue(value: any, flags?: {}): boolean;
     get emptyValue(): {};

package/lib/mjs/components/survey/Survey.js

@@ -1,6 +1,6 @@
 import _ from 'lodash';
 import Field from '../_classes/field/Field';
-import { boolValue } from '../../utils/utils';
+import { boolValue, componentValueTypes, getComponentSavedTypes } from '../../utils/utils';
 export default class SurveyComponent extends Field {
     static schema(...extend) {
         return Field.schema({
@@ -22,11 +22,17 @@ export default class SurveyComponent extends Field {
         };
     }
     static get serverConditionSettings() {
+        return SurveyComponent.conditionOperatorsSettings;
+    }
+    static get conditionOperatorsSettings() {
         return {
-            ...super.serverConditionSettings,
+            ...super.conditionOperatorsSettings,
             operators: ['isEmpty', 'isNotEmpty'],
         };
     }
+    static savedValueTypes(schema) {
+        return getComponentSavedTypes(schema) || [componentValueTypes.object];
+    }
     get defaultSchema() {
         return SurveyComponent.schema();
     }

package/lib/mjs/components/table/Table.d.ts

@@ -11,6 +11,7 @@ export default class TableComponent extends NestedComponent {
         showPreview: boolean;
         schema: any;
     };
+    static savedValueTypes(): never[];
     constructor(...args: any[]);
     get cellClassName(): string;
     get tableKey(): string;

package/lib/mjs/components/table/Table.js

@@ -43,6 +43,9 @@ export default class TableComponent extends NestedComponent {
             schema: TableComponent.schema()
         };
     }
+    static savedValueTypes() {
+        return [];
+    }
     get defaultSchema() {
         return TableComponent.schema();
     }

package/lib/mjs/components/tabs/Tabs.d.ts

@@ -8,6 +8,7 @@ export default class TabsComponent extends NestedComponent {
         showPreview: boolean;
         schema: any;
     };
+    static savedValueTypes(): never[];
     constructor(...args: any[]);
     get tabKey(): string;
     get tabLikey(): string;

package/lib/mjs/components/tabs/Tabs.js

@@ -30,6 +30,9 @@ export default class TabsComponent extends NestedComponent {
             schema: TabsComponent.schema(),
         };
     }
+    static savedValueTypes() {
+        return [];
+    }
     get defaultSchema() {
         return TabsComponent.schema();
     }

package/lib/mjs/components/tags/Tags.d.ts

@@ -7,6 +7,27 @@ export default class TagsComponent extends Input {
         weight: number;
         schema: any;
     };
+    static get serverConditionSettings(): {
+        operators: any[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+    };
+    static get conditionOperatorsSettings(): {
+        operators: any[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+    };
+    static savedValueTypes(schema: any): any[];
     get emptyValue(): "" | never[];
     get delimiter(): any;
     attachElement(element: any, index: any): void;

package/lib/mjs/components/tags/Tags.js

@@ -1,3 +1,4 @@
+import { componentValueTypes, getComponentSavedTypes } from '../../utils/utils';
 import Input from '../_classes/input/Input';
 import Choices from '@formio/choices.js';
 export default class TagsComponent extends Input {
@@ -22,11 +23,18 @@ export default class TagsComponent extends Input {
         };
     }
     static get serverConditionSettings() {
+        return TagsComponent.conditionOperatorsSettings;
+    }
+    static get conditionOperatorsSettings() {
         return {
-            ...super.serverConditionSettings,
-            operators: [...super.serverConditionSettings.operators, 'includes', 'notIncludes'],
+            ...super.conditionOperatorsSettings,
+            operators: [...super.conditionOperatorsSettings.operators, 'includes', 'notIncludes'],
         };
     }
+    static savedValueTypes(schema) {
+        schema = schema || {};
+        return getComponentSavedTypes(schema) || [componentValueTypes[schema.storeas] || componentValueTypes.string];
+    }
     init() {
         super.init();
     }
@@ -74,6 +82,8 @@ export default class TagsComponent extends Input {
         });
         this.choices.itemList.element.tabIndex = element.tabIndex;
         this.addEventListener(this.choices.input.element, 'blur', () => {
+            // Emit event to the native Formio input, so the listener attached in the Input.js will be invoked
+            element.dispatchEvent(new Event('blur'));
             const value = this.choices.input.value;
             const maxTagsNumber = this.component.maxTags;
             const valuesCount = this.choices.getValue(true).length;

package/lib/mjs/components/tags/fixtures/comp6.d.ts

@@ -0,0 +1,17 @@
+declare namespace _default {
+    const type: string;
+    const display: string;
+    const components: {
+        label: string;
+        tableView: boolean;
+        storeas: string;
+        validate: {
+            custom: string;
+        };
+        validateOn: string;
+        key: string;
+        type: string;
+        input: boolean;
+    }[];
+}
+export default _default;

package/lib/mjs/components/tags/fixtures/comp6.js

@@ -0,0 +1,18 @@
+export default {
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Tags',
+            tableView: false,
+            storeas: 'array',
+            validate: {
+                custom: "valid = data && data.tags.length <= 2 ? true : 'You cannot add more than 2 items'"
+            },
+            validateOn: 'blur',
+            key: 'tags',
+            type: 'tags',
+            input: true
+        },
+    ]
+};

package/lib/mjs/components/tags/fixtures/index.d.ts

@@ -3,4 +3,5 @@ import comp2 from './comp2';
 import comp3 from './comp3';
 import comp4 from './comp4';
 import comp5 from './comp5';
-export { comp1, comp2, comp3, comp4, comp5 };
+import comp6 from './comp6';
+export { comp1, comp2, comp3, comp4, comp5, comp6 };

package/lib/mjs/components/tags/fixtures/index.js

@@ -3,4 +3,5 @@ import comp2 from './comp2';
 import comp3 from './comp3';
 import comp4 from './comp4';
 import comp5 from './comp5';
-export { comp1, comp2, comp3, comp4, comp5 };
+import comp6 from './comp6';
+export { comp1, comp2, comp3, comp4, comp5, comp6 };

package/lib/mjs/components/textfield/TextField.d.ts

@@ -7,6 +7,27 @@ export default class TextFieldComponent extends Input {
         weight: number;
         schema: any;
     };
+    static get serverConditionSettings(): {
+        operators: any[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+    };
+    static get conditionOperatorsSettings(): {
+        operators: any[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
+    };
+    static savedValueTypes(schema: any): string[];
     get emptyValue(): string;
     /**
      * Returns the mask value object.

package/lib/mjs/components/textfield/TextField.js

@@ -33,11 +33,17 @@ export default class TextFieldComponent extends Input {
         };
     }
     static get serverConditionSettings() {
+        return TextFieldComponent.conditionOperatorsSettings;
+    }
+    static get conditionOperatorsSettings() {
         return {
-            ...super.serverConditionSettings,
-            operators: [...super.serverConditionSettings.operators, 'includes', 'notIncludes', 'endsWith', 'startsWith'],
+            ...super.conditionOperatorsSettings,
+            operators: [...super.conditionOperatorsSettings.operators, 'includes', 'notIncludes', 'endsWith', 'startsWith'],
         };
     }
+    static savedValueTypes(schema) {
+        return FormioUtils.getComponentSavedTypes(schema) || [FormioUtils.componentValueTypes.string];
+    }
     get defaultSchema() {
         return TextFieldComponent.schema();
     }

package/lib/mjs/components/time/Time.d.ts

@@ -1,7 +1,14 @@
 export default class TimeComponent extends TextFieldComponent {
     static get serverConditionSettings(): {
         valueComponent(classComp: any): any;
-        operators: string[];
+        operators: any[];
+        constructor: Function;
+        toString(): string;
+        toLocaleString(): string;
+        valueOf(): Object;
+        hasOwnProperty(v: PropertyKey): boolean;
+        isPrototypeOf(v: Object): boolean;
+        propertyIsEnumerable(v: PropertyKey): boolean;
     };
     rawData: string | never[];
     get dataFormat(): any;

package/lib/mjs/components/well/Well.d.ts

@@ -8,6 +8,7 @@ export default class WellComponent extends NestedComponent {
         weight: number;
         schema: any;
     };
+    static savedValueTypes(): never[];
     constructor(...args: any[]);
     noField: boolean;
 }

package/lib/mjs/components/well/Well.js

@@ -20,6 +20,9 @@ export default class WellComponent extends NestedComponent {
             schema: WellComponent.schema()
         };
     }
+    static savedValueTypes() {
+        return [];
+    }
     get defaultSchema() {
         return WellComponent.schema();
     }

package/lib/mjs/formio.embed.d.ts

@@ -1 +1,2 @@
-export {};
+export { Formio };
+import { Formio } from './Embed';

package/lib/mjs/formio.embed.js

@@ -1,2 +1,96 @@
-import { embed } from './Embed';
-embed();
+import { Formio } from './Embed';
+const scripts = document.getElementsByTagName('script');
+const config = window.FormioConfig || {};
+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();
+    if (config.formioPath) {
+        config.formioPath(scriptSrc);
+    }
+    scriptSrc = scriptSrc.join('/');
+    Formio.config = Object.assign({
+        script: query.script || (`${config.updatePath ? config.updatePath() : scriptSrc}/formio.form.min.js`),
+        style: query.styles || (`${config.updatePath ? config.updatePath() : scriptSrc}/formio.form.min.css`),
+        cdn: query.cdn,
+        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'),
+        template: query.template,
+        debug: (query.debug === 'true' || query.debug === '1'),
+        config: {},
+        redirect: (query.return || query.redirect),
+        embedCSS: (`${config.updatePath ? config.updatePath() : scriptSrc}/formio.embed.css`),
+        before: null,
+        after: null
+    }, config);
+    const form = (Formio.config.form || Formio.config.src);
+    if (form) {
+        Formio.debug('Embedding Configuration', config);
+        if (Formio.config.addPremiumLib) {
+            Formio.config.addPremiumLib(Formio.config, scriptSrc);
+        }
+        // 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;
+            }
+            // 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 {
+                    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 };

package/lib/mjs/formio.form.d.ts

@@ -3,8 +3,8 @@
  * @param {*} plugin
  * @returns
  */
-export function registerModule(mod: any, defaultFn?: null): void;
-export function useModule(defaultFn?: null): (...plugins: any[]) => void;
+export function registerModule(mod: any, defaultFn?: null, options?: {}): void;
+export function useModule(defaultFn?: null): (plugins: any, options?: {}) => void;
 import Components from './components/Components';
 import Displays from './displays/Displays';
 import Providers from './providers';
@@ -19,4 +19,5 @@ import ValueSources from './validator/valueSources';
 import Utils from './utils';
 import Form from './Form';
 import { Formio } from './Formio';
-export { Components, Displays, Providers, Rules, Widgets, Templates, Conjunctions, Operators, QuickRules, Transformers, ValueSources, Utils, Form, Formio };
+import Licenses from './licenses';
+export { Components, Displays, Providers, Rules, Widgets, Templates, Conjunctions, Operators, QuickRules, Transformers, ValueSources, Utils, Form, Formio, Licenses };

package/lib/mjs/formio.form.js

@@ -15,6 +15,7 @@ import Widgets from './widgets';
 import Form from './Form';
 import Utils from './utils';
 import Evaluator from './utils/Evaluator';
+import Licenses from './licenses';
 Formio.loadModules = (path = `${Formio.getApiUrl()}/externalModules.js`, name = 'externalModules') => {
     Formio.requireLibrary(name, name, path, true)
         .then((modules) => {
@@ -37,6 +38,7 @@ Formio.QuickRules = QuickRules;
 Formio.Transformers = Transformers;
 Formio.ValueSources = ValueSources;
 Formio.AllComponents = AllComponents;
+Formio.Licenses = Licenses;
 // This is strange, but is needed for "premium" components to import correctly.
 Formio.Formio = Formio;
 Formio.Components.setComponents(AllComponents);
@@ -45,7 +47,7 @@ Formio.Components.setComponents(AllComponents);
  * @param {*} plugin
  * @returns
  */
-export function registerModule(mod, defaultFn = null) {
+export function registerModule(mod, defaultFn = null, options = {}) {
     // Sanity check.
     if (typeof mod !== 'object') {
         return;
@@ -104,6 +106,11 @@ export function registerModule(mod, defaultFn = null) {
             case 'valueSources':
                 Formio.ValueSources.addValueSources(mod.valueSources);
                 break;
+            case 'library':
+                options.license
+                    ? Formio.Licenses.addLicense(mod.library, mod.license)
+                    : Formio.Licenses.removeLicense(mod.library);
+                break;
             default:
                 if (defaultFn) {
                     if (!defaultFn(key, mod)) {
@@ -116,23 +123,24 @@ export function registerModule(mod, defaultFn = null) {
     }
 }
 export function useModule(defaultFn = null) {
-    return (...plugins) => {
+    return (plugins, options = {}) => {
+        plugins = _.isArray(plugins) ? plugins : [plugins];
         plugins.forEach((plugin) => {
             if (Array.isArray(plugin)) {
-                plugin.forEach(p => registerModule(p, defaultFn));
+                plugin.forEach(p => registerModule(p, defaultFn, options));
             }
             else {
-                registerModule(plugin, defaultFn);
+                registerModule(plugin, defaultFn, options);
             }
         });
     };
 }
 /**
- * Allows passing in plugins as multiple arguments or an array of plugins.
+ * Allows passing in plugins as an array of plugins or a single plugin.
  *
- * Formio.plugins(plugin1, plugin2, etc);
- * Formio.plugins([plugin1, plugin2, etc]);
+ * Formio.plugins(plugin1, options);
+ * Formio.plugins([plugin1, plugin2, etc], options);
  */
 Formio.use = useModule();
 // Export the components.
-export { Components, Displays, Providers, Rules, Widgets, Templates, Conjunctions, Operators, QuickRules, Transformers, ValueSources, Utils, Form, Formio };
+export { Components, Displays, Providers, Rules, Widgets, Templates, Conjunctions, Operators, QuickRules, Transformers, ValueSources, Utils, Form, Formio, Licenses };

package/lib/mjs/licenses/Licenses.d.ts

@@ -0,0 +1,7 @@
+export default class Licenses {
+    static licenses: {};
+    static addLicense(name: any, license: any): void;
+    static getLicense(name: any): any;
+    static removeLicense(name: any): void;
+    static getLicenses(): {};
+}

package/lib/mjs/licenses/Licenses.js

@@ -0,0 +1,17 @@
+import _ from 'lodash';
+class Licenses {
+    static licenses = {};
+    static addLicense(name, license) {
+        Licenses.licenses[name] = license;
+    }
+    static getLicense(name) {
+        return Licenses.licenses[name];
+    }
+    static removeLicense(name) {
+        _.unset(Licenses.licenses, name);
+    }
+    static getLicenses() {
+        return Licenses.licenses;
+    }
+}
+export default Licenses;

package/lib/mjs/licenses/index.d.ts

@@ -0,0 +1,2 @@
+export default Licenses;
+import Licenses from './Licenses';

package/lib/mjs/licenses/index.js

@@ -0,0 +1,2 @@
+import Licenses from './Licenses';
+export default Licenses;

package/lib/mjs/utils/utils.d.ts

@@ -349,6 +349,7 @@ export function isPromise(value: any): boolean;
  */
 export function isInsideScopingComponent(componentInstance: any, firstPass?: boolean): boolean | boolean | any;
 export function getFocusableElements(element: any): any;
+export function getComponentSavedTypes(fullSchema: any): string[] | null;
 export * from "./formUtils";
 /**
  * Map values through unfold and return first non-nil value.
@@ -357,6 +358,15 @@ export * from "./formUtils";
  * @return {T}
  */
 export const firstNonNil: any;
+export namespace componentValueTypes {
+    const number: string;
+    const string: string;
+    const boolean: string;
+    const array: string;
+    const object: string;
+    const date: string;
+    const any: string;
+}
 import jsonLogic from 'json-logic-js';
 import ConditionOperators from './conditionOperators';
 import Evaluator from './Evaluator';

package/lib/mjs/utils/utils.js

@@ -1365,3 +1365,22 @@ export function getFocusableElements(element) {
 }
 // Export lodash to save space with other libraries.
 export { _ };
+export const componentValueTypes = {
+    number: 'number',
+    string: 'string',
+    boolean: 'boolean',
+    array: 'array',
+    object: 'object',
+    date: 'date',
+    any: 'any',
+};
+export function getComponentSavedTypes(fullSchema) {
+    const schema = fullSchema || {};
+    if (schema.persistent !== true) {
+        return [];
+    }
+    if (schema.multiple) {
+        return [componentValueTypes.array];
+    }
+    return null;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-rc.20",
+  "version": "5.0.0-rc.22",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",
@@ -9,6 +9,10 @@
       "import": "./lib/mjs/index.js",
       "require": "./lib/cjs/index.js"
     },
+    "./sdk": {
+      "import": "./lib/mjs/Formio.js",
+      "require": "./lib/cjs/Formio.js"
+    },
     "./utils": {
       "import": "./lib/mjs/utils/index.js",
       "require": "./lib/cjs/utils/index.js"

package/types/index.d.ts

@@ -15,3 +15,4 @@ export * from './rulesEngine/rules';
 export * from './rulesEngine/transformers';
 export * from './rulesEngine/valueSources';
 export * from './providers';
+export * from './licenses';

package/types/licenses.d.ts

@@ -0,0 +1,7 @@
+export class Licenses {
+  static readonly licenses: any;
+  static addLicense(name: string, license: any): void;
+  static removeLicense(name: string): void;
+  static getLicense(name: string): any;
+  static getLicenses(): any;
+}

package/types/utils.d.ts

@@ -4,8 +4,10 @@ export type AnyForJSON = { [key: string]: any } | any;
 
 export namespace Utils {
   const ConditionOperators: any;
+  const componentValueTypes: { [key: string]: string };
   const Evaluator: any;
   const _: any;
+  function getComponentSavedTypes(schema: object): Array<any> | null;
   function evaluate(
     func: any,
     args: { component: any; form: any; instance: any; row: any; data: any } | any,