@formio/js 5.0.0-rc.91 → 5.0.0-rc.93

package/lib/mjs/components/select/fixtures/comp25.js

@@ -1,57 +1,64 @@
 export default {
-    title: 'FIO-8072',
-    name: 'fio8072',
-    path: 'fio8072',
-    type: 'form',
-    display: 'form',
-    components: [
+    "components": [
         {
-            label: 'Select',
-            widget: 'choicesjs',
-            tableView: true,
-            data: {
-                values: [
-                    {
-                        label: 'A',
-                        value: '1',
+            "label": "Edit Grid",
+            "tableView": false,
+            "modal": true,
+            "rowDrafts": true,
+            "key": "editGrid",
+            "type": "editgrid",
+            "displayAsTable": false,
+            "input": true,
+            "components": [
+                {
+                    "label": "Select",
+                    "widget": "choicesjs",
+                    "tableView": true,
+                    "data": {
+                        "values": [
+                            {
+                                "label": "a",
+                                "value": "a"
+                            },
+                            {
+                                "label": "b",
+                                "value": "b"
+                            },
+                            {
+                                "label": "c",
+                                "value": "c"
+                            }
+                        ]
                     },
-                    {
-                        label: 'B',
-                        value: '2',
+                    "validate": {
+                        "required": true
                     },
-                    {
-                        label: 'C',
-                        value: '10',
+                    "key": "select",
+                    "type": "select",
+                    "input": true
+                },
+                {
+                    "label": "Text Field",
+                    "applyMaskOn": "change",
+                    "tableView": true,
+                    "validate": {
+                        "required": true
                     },
-                    {
-                        label: 'D',
-                        value: '1d',
-                    },
-                ],
-            },
-            dataType: 'number',
-            key: 'select',
-            type: 'select',
-            input: true,
+                    "validateWhenHidden": false,
+                    "key": "textField",
+                    "type": "textfield",
+                    "input": true
+                }
+            ]
         },
         {
-            label: 'Text Field',
-            applyMaskOn: 'change',
-            tableView: true,
-            key: 'textField',
-            type: 'textfield',
-            input: true,
-            conditional: {
-                show: true,
-                conjunction: 'all',
-                conditions: [
-                    {
-                        component: 'select',
-                        operator: 'lessThan',
-                        value: 5,
-                    },
-                ],
-            },
-        },
-    ],
+            "label": "Submit",
+            "showValidations": false,
+            "tableView": false,
+            "key": "submit",
+            "type": "button",
+            "input": true,
+            "saveOnEnter": false
+        }
+    ]
 };

package/lib/mjs/components/select/fixtures/comp26.d.ts

@@ -0,0 +1,44 @@
+declare namespace _default {
+    let title: string;
+    let name: string;
+    let path: string;
+    let type: string;
+    let display: string;
+    let components: ({
+        label: string;
+        widget: string;
+        tableView: boolean;
+        data: {
+            values: {
+                label: string;
+                value: string;
+            }[];
+        };
+        dataType: string;
+        key: string;
+        type: string;
+        input: boolean;
+        applyMaskOn?: undefined;
+        conditional?: undefined;
+    } | {
+        label: string;
+        applyMaskOn: string;
+        tableView: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+        conditional: {
+            show: boolean;
+            conjunction: string;
+            conditions: {
+                component: string;
+                operator: string;
+                value: number;
+            }[];
+        };
+        widget?: undefined;
+        data?: undefined;
+        dataType?: undefined;
+    })[];
+}
+export default _default;

package/lib/mjs/components/select/fixtures/comp26.js

@@ -0,0 +1,57 @@
+export default {
+    title: 'FIO-8072',
+    name: 'fio8072',
+    path: 'fio8072',
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Select',
+            widget: 'choicesjs',
+            tableView: true,
+            data: {
+                values: [
+                    {
+                        label: 'A',
+                        value: '1',
+                    },
+                    {
+                        label: 'B',
+                        value: '2',
+                    },
+                    {
+                        label: 'C',
+                        value: '10',
+                    },
+                    {
+                        label: 'D',
+                        value: '1d',
+                    },
+                ],
+            },
+            dataType: 'number',
+            key: 'select',
+            type: 'select',
+            input: true,
+        },
+        {
+            label: 'Text Field',
+            applyMaskOn: 'change',
+            tableView: true,
+            key: 'textField',
+            type: 'textfield',
+            input: true,
+            conditional: {
+                show: true,
+                conjunction: 'all',
+                conditions: [
+                    {
+                        component: 'select',
+                        operator: 'lessThan',
+                        value: 5,
+                    },
+                ],
+            },
+        },
+    ],
+};

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

@@ -22,6 +22,7 @@ import comp22 from './comp22';
 import comp23 from './comp23';
 import comp24 from './comp24';
 import comp25 from './comp25';
+import comp26 from './comp26';
 import comp27 from './comp27';
 export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27 };
 export { multiSelect, multiSelectOptions } from "./comp3";

package/lib/mjs/components/selectboxes/SelectBoxes.js

@@ -172,8 +172,14 @@ export default class SelectBoxesComponent extends RadioComponent {
             return '';
         }
         if (this.isSelectURL) {
-            if (options.modalPreview && this.loadedOptions) {
-                return this.loadedOptions.filter((option) => value[option.value]).map((option) => option.label).join(', ');
+            if (options.modalPreview || this.options.readOnly || this.inDataTable) {
+                const checkedItems = _.keys(_.pickBy(value, (val) => val));
+                if (this.selectData?.length === checkedItems.length) {
+                    return this.selectData.map(item => this.itemTemplate(item)).join(', ');
+                }
+                else if (this.loadedOptions?.length) {
+                    return this.loadedOptions.filter((option) => value[option.value]).map((option) => option.label).join(', ');
+                }
             }
             return _(value).pickBy((val) => val).keys().join(', ');
         }

package/lib/mjs/components/textarea/TextArea.d.ts

@@ -20,10 +20,10 @@ export default class TextAreaComponent extends TextFieldComponent {
     setReadOnlyValue(value: any, index: any): void;
     get isJsonValue(): any;
     /**
-   * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
-   * @param {*} value - The value to normalize
-   * @returns {*} - Returns the normalized value
-   */
+     * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
+     * @param {*} value - The value to normalize
+     * @returns {*} - Returns the normalized value
+     */
     normalizeValue(value: any): any;
     normalizeSingleValue(value: any): any;
     setConvertedValue(value: any, index: any): any;

package/lib/mjs/components/textarea/TextArea.js

@@ -305,10 +305,10 @@ export default class TextAreaComponent extends TextFieldComponent {
         return this.component.as && this.component.as === 'json';
     }
     /**
-   * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
-   * @param {*} value - The value to normalize
-   * @returns {*} - Returns the normalized value
-   */
+     * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
+     * @param {*} value - The value to normalize
+     * @returns {*} - Returns the normalized value
+     */
     normalizeValue(value) {
         if (this.component.multiple && Array.isArray(value)) {
             return value.map((singleValue) => this.normalizeSingleValue(singleValue));

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/lib/mjs/utils/conditionOperators/IsEqualTo.js

@@ -1,6 +1,6 @@
 import ConditionOperator from './ConditionOperator';
 import _ from 'lodash';
-import { getItemTemplateKeys, isSelectResourceWithObjectValue } from '../utils';
+import { compareSelectResourceWithObjectTypeValues, isSelectResourceWithObjectValue } from '../utils';
 export default class IsEqualTo extends ConditionOperator {
     static get operatorKey() {
         return 'isEqual';
@@ -21,15 +21,7 @@ export default class IsEqualTo extends ConditionOperator {
             if (conditionTriggerComponent
                 && isSelectResourceWithObjectValue(conditionTriggerComponent.component)
                 && conditionTriggerComponent.component?.template) {
-                if (!value || !_.isPlainObject(value)) {
-                    return false;
-                }
-                const { template, valueProperty } = conditionTriggerComponent.component;
-                if (valueProperty === 'data') {
-                    value = { data: value };
-                    comparedValue = { data: comparedValue };
-                }
-                return _.every(getItemTemplateKeys(template) || [], k => _.isEqual(_.get(value, k), _.get(comparedValue, k)));
+                return compareSelectResourceWithObjectTypeValues(value, comparedValue, conditionTriggerComponent.component);
             }
         }
         //special check for select boxes

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

@@ -41,4 +41,7 @@ export const applyFormChanges: typeof Utils.applyFormChanges;
 export const findComponent: typeof Utils.findComponent;
 export const getEmptyValue: typeof Utils.getEmptyValue;
 export const isComponentDataEmpty: typeof Utils.isComponentDataEmpty;
+export const isSelectResourceWithObjectValue: typeof Utils.isSelectResourceWithObjectValue;
+export const compareSelectResourceWithObjectTypeValues: typeof Utils.compareSelectResourceWithObjectTypeValues;
+export const getItemTemplateKeys: typeof Utils.getItemTemplateKeys;
 import { Utils } from '@formio/core';

package/lib/mjs/utils/formUtils.js

@@ -1,5 +1,5 @@
 import { Utils } from '@formio/core';
-const { flattenComponents, guid, uniqueName, MODEL_TYPES, getModelType, getComponentAbsolutePath, getComponentPath, isComponentNestedDataType, componentPath, componentChildPath, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty } = Utils;
+const { flattenComponents, guid, uniqueName, MODEL_TYPES, getModelType, getComponentAbsolutePath, getComponentPath, isComponentNestedDataType, componentPath, componentChildPath, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty, isSelectResourceWithObjectValue, compareSelectResourceWithObjectTypeValues, getItemTemplateKeys } = Utils;
 /**
  * Deprecated version of findComponents. Renamed to searchComponents.
  * @param {import('@formio/core').Component[]} components - The components to find components within.
@@ -10,4 +10,4 @@ export function findComponents(components, query) {
     console.warn('formio.js/utils findComponents is deprecated. Use searchComponents instead.');
     return searchComponents(components, query);
 }
-export { flattenComponents, guid, uniqueName, MODEL_TYPES, getModelType, getComponentAbsolutePath, getComponentPath, isComponentNestedDataType, componentPath, componentChildPath, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty };
+export { flattenComponents, guid, uniqueName, MODEL_TYPES, getModelType, getComponentAbsolutePath, getComponentPath, isComponentNestedDataType, componentPath, componentChildPath, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty, isSelectResourceWithObjectValue, compareSelectResourceWithObjectTypeValues, getItemTemplateKeys };

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

@@ -498,18 +498,6 @@ export function getFocusableElements(element: HTMLElement): NodeList<HTMLElement
  * @returns {Array<string>|null} - The saved types for the component
  */
 export function getComponentSavedTypes(fullSchema: import('@formio/core').Component): Array<string> | null;
-/**
- * Returns the template keys inside the template code.
- * @param {string} template - The template to get the keys from.
- * @returns {Array<string>} - The keys inside the template.
- */
-export function getItemTemplateKeys(template: string): Array<string>;
-/**
- * Returns if the component is a select resource with an object for its value.
- * @param {import('@formio/core').Component} comp - The component to check.
- * @returns {boolean} - TRUE if the component is a select resource with an object for its value; FALSE otherwise.
- */
-export function isSelectResourceWithObjectValue(comp?: import('@formio/core').Component): boolean;
 export * from "./formUtils";
 /**
  * Map values through unfold and return first non-nil value.

package/lib/mjs/utils/utils.js

@@ -1587,33 +1587,3 @@ export const interpolateErrors = (component, errors, interpolateFn) => {
         return { ...error, message: unescapeHTML(interpolateFn(toInterpolate, context)), context: { ...context } };
     });
 };
-/**
- * Returns the template keys inside the template code.
- * @param {string} template - The template to get the keys from.
- * @returns {Array<string>} - The keys inside the template.
- */
-export function getItemTemplateKeys(template) {
-    const templateKeys = [];
-    if (!template) {
-        return templateKeys;
-    }
-    const keys = template.match(/({{\s*(.*?)\s*}})/g);
-    if (keys) {
-        keys.forEach((key) => {
-            const propKey = key.match(/{{\s*item\.(.*?)\s*}}/);
-            if (propKey && propKey.length > 1) {
-                templateKeys.push(propKey[1]);
-            }
-        });
-    }
-    return templateKeys;
-}
-/**
- * Returns if the component is a select resource with an object for its value.
- * @param {import('@formio/core').Component} comp - The component to check.
- * @returns {boolean} - TRUE if the component is a select resource with an object for its value; FALSE otherwise.
- */
-export function isSelectResourceWithObjectValue(comp = {}) {
-    const { reference, dataSrc, valueProperty } = comp;
-    return reference || (dataSrc === 'resource' && (!valueProperty || valueProperty === 'data'));
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-rc.91",
+  "version": "5.0.0-rc.93",
   "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.38",
+    "@formio/bootstrap": "3.0.0-rc.40",
     "@formio/choices.js": "^10.2.1",
-    "@formio/core": "2.3.0-rc.10",
+    "@formio/core": "2.3.0-rc.14",
     "@formio/text-mask-addons": "^3.8.0-formio.2",
     "@formio/vanilla-text-mask": "^5.1.1-formio.1",
     "abortcontroller-polyfill": "^1.7.5",