@formio/js 5.0.0-rc.90 → 5.0.0-rc.92

package/lib/mjs/components/editgrid/fixtures/comp19.d.ts

@@ -0,0 +1,59 @@
+declare namespace _default {
+    let _id: string;
+    let title: string;
+    let name: string;
+    let path: string;
+    let type: string;
+    let display: string;
+    let components: ({
+        label: string;
+        tableView: boolean;
+        validateWhenHidden: boolean;
+        rowDrafts: boolean;
+        key: string;
+        type: string;
+        displayAsTable: boolean;
+        input: boolean;
+        components: {
+            label: string;
+            columns: {
+                components: {
+                    label: string;
+                    applyMaskOn: string;
+                    tableView: boolean;
+                    validate: {
+                        required: boolean;
+                    };
+                    validateWhenHidden: boolean;
+                    key: string;
+                    type: string;
+                    input: boolean;
+                }[];
+                width: number;
+                offset: number;
+                push: number;
+                pull: number;
+                size: string;
+                currentWidth: number;
+            }[];
+            key: string;
+            type: string;
+            input: boolean;
+            tableView: boolean;
+        }[];
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        validateWhenHidden?: undefined;
+        rowDrafts?: undefined;
+        displayAsTable?: undefined;
+        components?: undefined;
+    })[];
+    let project: string;
+}
+export default _default;

package/lib/mjs/components/editgrid/fixtures/comp19.js

@@ -0,0 +1,71 @@
+export default {
+    _id: '6704f3d329cf52a3ddd4e244',
+    title: 'uiu',
+    name: 'uiu',
+    path: 'uiu',
+    type: 'resource',
+    display: 'form',
+    components: [
+        {
+            label: 'Edit Grid',
+            tableView: false,
+            validateWhenHidden: false,
+            rowDrafts: false,
+            key: 'editGrid',
+            type: 'editgrid',
+            displayAsTable: false,
+            input: true,
+            components: [
+                {
+                    label: 'Columns',
+                    columns: [
+                        {
+                            components: [
+                                {
+                                    label: 'Text Field',
+                                    applyMaskOn: 'change',
+                                    tableView: true,
+                                    validate: {
+                                        required: true,
+                                    },
+                                    validateWhenHidden: false,
+                                    key: 'textField',
+                                    type: 'textfield',
+                                    input: true,
+                                },
+                            ],
+                            width: 6,
+                            offset: 0,
+                            push: 0,
+                            pull: 0,
+                            size: 'md',
+                            currentWidth: 6,
+                        },
+                        {
+                            components: [],
+                            width: 6,
+                            offset: 0,
+                            push: 0,
+                            pull: 0,
+                            size: 'md',
+                            currentWidth: 6,
+                        },
+                    ],
+                    key: 'columns',
+                    type: 'columns',
+                    input: false,
+                    tableView: false,
+                },
+            ],
+        },
+        {
+            type: 'button',
+            label: 'Submit',
+            key: 'submit',
+            disableOnInvalid: true,
+            input: true,
+            tableView: false,
+        },
+    ],
+    project: '66f66c655879bf08113cf465',
+};

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

@@ -15,7 +15,8 @@ import comp14 from './comp14';
 import comp15 from './comp15';
 import comp16 from './comp16';
 import comp18 from './comp18';
+import comp19 from './comp19';
 import compOpenWhenEmpty from './comp-openWhenEmpty';
 import withOpenWhenEmptyAndConditions from './comp-with-conditions-and-openWhenEmpty';
 import compWithCustomDefaultValue from './comp-with-custom-default-value';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };

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

@@ -16,8 +16,9 @@ import comp15 from './comp15';
 import comp16 from './comp16';
 import comp17 from './comp17';
 import comp18 from './comp18';
+import comp19 from './comp19';
 import withOpenWhenEmptyAndConditions from './comp-with-conditions-and-openWhenEmpty';
 import compOpenWhenEmpty from './comp-openWhenEmpty';
 import compWithCustomDefaultValue from './comp-with-custom-default-value';
 import compTestEvents from './comp-test-events';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };

package/lib/mjs/components/form/editForm/Form.edit.data.js

@@ -2,7 +2,7 @@ import EditFormUtils from '../../_classes/component/editForm/utils';
 /* eslint-disable max-len */
 export default [
     EditFormUtils.javaScriptValue('Custom Default Value', 'customDefaultValue', 'customDefaultValue', 120, '<p><h4>Example:</h4><pre>value = data.firstName + " " + data.lastName;</pre></p>', '<p><h4>Example:</h4><pre>{"cat": [{"var": "data.firstName"}, " ", {"var": "data.lastName"}]}</pre>'),
-    EditFormUtils.javaScriptValue('Calculated Value', 'calculateValue', 'calculateValue', 130, '<p><h4>Example:</h4><pre>value = data.a + data.b + data.c;</pre></p>', '<p><h4>Example:</h4><pre>{"+": [{"var": "data.a"}, {"var": "data.b"}, {"var": "data.c"}]}</pre><p><a href="http://formio.github.io/formio.js/app/examples/calculated.html" target="_blank" rel="noopener noreferrer">Click here for an example</a></p>'),
+    EditFormUtils.javaScriptValue('Calculated Value', 'calculateValue', 'calculateValue', 130, '<p><h4>Example:</h4><pre>value = data.a + data.b + data.c;</pre></p>', '<p><h4>Example:</h4><pre>{"+": [{"var": "data.a"}, {"var": "data.b"}, {"var": "data.c"}]}</pre><p><a href="https://help.form.io/userguide/form-building/logic-and-conditions#calculated-values" target="_blank" rel="noopener noreferrer">Click here for an example</a></p>'),
     {
         weight: 140,
         type: 'checkbox',

package/lib/mjs/components/number/fixtures/comp11.d.ts

@@ -0,0 +1,17 @@
+declare namespace _default {
+    let components: {
+        label: string;
+        mask: boolean;
+        tableView: boolean;
+        modalEdit: boolean;
+        multiple: boolean;
+        delimiter: string;
+        requireDecimal: boolean;
+        inputFormat: string;
+        truncateMultipleSpaces: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+    }[];
+}
+export default _default;

package/lib/mjs/components/number/fixtures/comp11.js

@@ -0,0 +1,18 @@
+export default {
+    components: [
+        {
+            label: 'Number',
+            mask: true,
+            tableView: false,
+            modalEdit: true,
+            multiple: true,
+            delimiter: ',',
+            requireDecimal: false,
+            inputFormat: 'plain',
+            truncateMultipleSpaces: false,
+            key: 'number',
+            type: 'number',
+            input: true
+        }
+    ]
+};

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

@@ -8,4 +8,5 @@ import comp7 from './comp7';
 import comp8 from './comp8';
 import comp9 from './comp9';
 import comp10 from './comp10';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10 };
+import comp11 from './comp11';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11 };

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

@@ -8,4 +8,5 @@ import comp7 from './comp7';
 import comp8 from './comp8';
 import comp9 from './comp9';
 import comp10 from './comp10';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10 };
+import comp11 from './comp11';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11 };

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

@@ -247,7 +247,11 @@ export default class SelectComponent extends ListComponent {
             const value = (typeof itemLabel === 'string') ? this.t(itemLabel, { _userInput: true }) : itemLabel;
             return this.sanitize(value, this.shouldSanitizeValue);
         }
-        if (this.component.multiple && _.isArray(this.dataValue) ? this.dataValue.find((val) => this.normalizeSingleValue(value) === val) : (this.dataValue === this.normalizeSingleValue(value))) {
+        // Inside DataTable component won't have dataValue set
+        const shouldUseSelectData = (this.component.multiple && _.isArray(this.dataValue)
+            ? this.dataValue.find((val) => this.normalizeSingleValue(value) === val)
+            : (this.dataValue === this.normalizeSingleValue(value))) || this.inDataTable;
+        if (shouldUseSelectData) {
             const selectData = this.selectData;
             if (selectData) {
                 const templateValue = this.component.reference && value?._id ? value._id.toString() : value;
@@ -1242,7 +1246,7 @@ export default class SelectComponent extends ListComponent {
         // Check to see if we need to save off the template data into our metadata.
         const templateValue = this.component.reference && value?._id ? value._id.toString() : value;
         const shouldSaveData = !valueIsObject || this.component.reference;
-        if (templateValue && shouldSaveData && this.templateData && this.templateData[templateValue] && this.root?.submission) {
+        if (!_.isNil(templateValue) && shouldSaveData && this.templateData && this.templateData[templateValue] && this.root?.submission) {
             const submission = this.root.submission;
             if (!submission.metadata) {
                 submission.metadata = {};
@@ -1496,8 +1500,12 @@ export default class SelectComponent extends ListComponent {
     }
     asString(value, options = {}) {
         value = value ?? this.getValue();
-        if (options.modalPreview) {
-            const template = this.itemTemplate(value, value);
+        if (options.modalPreview || this.inDataTable) {
+            if (this.inDataTable) {
+                value = this.undoValueTyping(value);
+            }
+            const templateValue = (this.isEntireObjectDisplay() && !_.isObject(value.data)) ? { data: value } : value;
+            const template = this.itemTemplate(templateValue, value, options);
             return template;
         }
         //need to convert values to strings to be able to compare values with available options that are strings

package/lib/mjs/components/time/Time.js

@@ -51,12 +51,6 @@ export default class TimeComponent extends TextFieldComponent {
         }
         return value;
     }
-    get validationValue() {
-        if ((Array.isArray(this.rawData) && !this.rawData.length) || !this.rawData) {
-            return this.dataValue;
-        }
-        return this.rawData;
-    }
     get inputInfo() {
         const info = super.inputInfo;
         info.attr.type = this.component.inputType;

package/lib/mjs/components/time/fixtures/timeForm2.js

@@ -12,6 +12,15 @@ export default {
             'input': true,
             'inputMask': '99:99'
         },
+        {
+            'label': 'Multiple Time',
+            'inputType': 'text',
+            'tableView': true,
+            'key': 'multipleTime',
+            'type': 'time',
+            'input': true,
+            'inputMask': '99:99'
+        },
         {
             'label': 'Submit',
             'showValidations': false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-rc.90",
+  "version": "5.0.0-rc.92",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {
@@ -79,9 +79,9 @@
   },
   "homepage": "https://github.com/formio/formio.js#readme",
   "dependencies": {
-    "@formio/bootstrap": "3.0.0-rc.37",
+    "@formio/bootstrap": "3.0.0-rc.39",
     "@formio/choices.js": "^10.2.1",
-    "@formio/core": "2.3.0-rc.9",
+    "@formio/core": "2.3.0-rc.13",
     "@formio/text-mask-addons": "^3.8.0-formio.2",
     "@formio/vanilla-text-mask": "^5.1.1-formio.1",
     "abortcontroller-polyfill": "^1.7.5",