@luomus/laji-form 15.1.110 → 15.1.112

package/lib/components/LajiForm.d.ts

@@ -17,7 +17,7 @@ import DOMIdService from "../services/dom-id-service";
 import IdService from "../services/id-service";
 import RootInstanceService from "../services/root-instance-service";
 import SingletonMapService from "../services/singleton-map-service";
-import { FieldProps, HasMaybeChildren, Lang } from "../types";
+import { FieldProps, HasMaybeChildren, JSONSchema, Lang } from "../types";
 import MultiActiveArrayService from "../services/multi-active-array-service";
 import * as fields from "./fields";
 import * as widgets from "./widgets";
@@ -488,4 +488,8 @@ export default class LajiForm extends React.Component<LajiFormProps, LajiFormSta
     setTimeout: (fn: () => void, time?: number) => number;
     destroy: () => void;
     getSchemaValidationErrors: (formData: any) => any;
+    getFormDataReadyForSubmit: (formData: any, schema: JSONSchema) => {
+        formData: any;
+        removedArrayItemsAndObjects: string[];
+    };
 }

package/lib/components/LajiForm.js

@@ -62,6 +62,7 @@ const dom_id_service_1 = __importDefault(require("../services/dom-id-service"));
 const id_service_1 = __importDefault(require("../services/id-service"));
 const root_instance_service_1 = __importDefault(require("../services/root-instance-service"));
 const singleton_map_service_1 = __importDefault(require("../services/singleton-map-service"));
+const types_1 = require("../types");
 const multi_active_array_service_1 = __importDefault(require("../services/multi-active-array-service"));
 const fields = __importStar(require("./fields"));
 const widgets = __importStar(require("./widgets"));
@@ -147,15 +148,17 @@ class LajiForm extends React.Component {
                 React.createElement(ProgressBar, { now: 100 / jobsAmount * (jobsAmount - runningAmount) })));
         };
         this.validateAndSubmit = (warnings = true, onlySchema = false) => {
-            const { formData } = this.state;
-            const { onValidationError, onSubmit } = this.props;
+            let { formData } = this.state;
+            const { onValidationError, onSubmit, schema } = this.props;
             this.setState({ externalErrors: undefined });
             return this.validate(warnings, true, onlySchema).then(valid => {
                 if (formData !== this.state.formData) {
                     this.validateAndSubmit(warnings, onlySchema);
                 }
                 else if (valid) {
-                    onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit({ formData: removeUndefinedFromArrays(this.memoizedFormContext.services.ids.removeLajiFormIds(formData)) });
+                    formData = this.getFormDataReadyForSubmit(formData, schema).formData;
+                    this.setState({ formData });
+                    onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit({ formData });
                 }
                 else {
                     onValidationError && onValidationError(this.state.extraErrors);
@@ -200,7 +203,7 @@ class LajiForm extends React.Component {
                 const mergedInternalErrors = (0, deepmerge_1.default)(_liveValidations, !nonlive
                     ? (this.cachedNonliveValidations || {})
                     : (0, deepmerge_1.default)(_validations, schemaErrors));
-                const mergedAll = (0, deepmerge_1.default)(this.state.externalErrors || {}, mergedInternalErrors);
+                let mergedAll = (0, deepmerge_1.default)(this.state.externalErrors || {}, mergedInternalErrors);
                 this.validating = false;
                 resolve(!Object.keys(mergedAll).length);
                 if (!equals((this.state.extraErrors || {}), mergedAll)) {
@@ -368,8 +371,17 @@ class LajiForm extends React.Component {
             this.eventListeners = [];
         };
         this.getSchemaValidationErrors = (formData) => {
-            const errors = validator_ajv6_1.default.validateFormData(removeUndefinedFromArrays(formData), this.props.schema, undefined, ((e) => (0, validation_2.transformErrors)(this.state.formContext.translations, e))).errors;
-            return (0, validation_1.toErrorSchema)(errors);
+            const errors = validator_ajv6_1.default.validateFormData(formData, this.props.schema, undefined, ((e) => (0, validation_2.transformErrors)(this.state.formContext.translations, e))).errors;
+            let schemaErrors = (0, validation_1.toErrorSchema)(errors);
+            const ignoreErrorPaths = this.getFormDataReadyForSubmit(formData, this.props.schema).removedArrayItemsAndObjects;
+            ignoreErrorPaths.forEach(path => {
+                schemaErrors = (0, utils_1.immutableDelete)(schemaErrors, path);
+            });
+            return schemaErrors;
+        };
+        this.getFormDataReadyForSubmit = (formData, schema) => {
+            formData = this.memoizedFormContext.services.ids.removeLajiFormIds(formData);
+            return removeEmptyValuesAndTrim(formData, schema);
         };
         if (props.apiClient) {
             this.apiClient = new ApiClient_1.default(props.apiClient, props.lang, this.translations);
@@ -528,23 +540,62 @@ LajiForm.defaultProps = {
     uiSchema: {}
 };
 exports.default = LajiForm;
-const removeUndefinedFromArrays = (formData) => {
-    if ((0, utils_1.isObject)(formData)) {
-        return Object.keys(formData).reduce((obj, k) => {
-            obj[k] = removeUndefinedFromArrays(formData[k]);
-            return obj;
-        }, {});
-    }
-    else if (Array.isArray(formData)) {
-        return formData.reduce((filtered, i) => {
-            if (i === undefined || i === null || i === "") {
-                return filtered;
-            }
-            filtered.push(removeUndefinedFromArrays(i));
-            return filtered;
-        }, []);
+const removeEmptyValuesAndTrim = (formData, schema) => {
+    const removedArrayItemsAndObjects = [];
+    return {
+        formData: removeRecursive(formData, schema, true, ""),
+        removedArrayItemsAndObjects
+    };
+    function removeRecursive(formData, schema, isRequired, path) {
+        if (schema && (0, types_1.isJSONSchemaObject)(schema) && (0, utils_1.isObject)(formData)) {
+            const object = Object.keys(formData).reduce((obj, k) => {
+                var _a;
+                const childSchema = schema.properties[k];
+                const childPath = `${path}/${k}`;
+                const value = removeRecursive(formData[k], childSchema, ((_a = schema.required) === null || _a === void 0 ? void 0 : _a.includes(k)) || false, childPath);
+                if (value !== undefined) {
+                    obj[k] = value;
+                }
+                else if (childSchema && (0, types_1.isJSONSchemaObject)(childSchema)) {
+                    removedArrayItemsAndObjects.push(childPath);
+                }
+                return obj;
+            }, {});
+            return isRequired || Object.keys(object).length > 0 ? object : undefined;
+        }
+        else if (schema && (0, types_1.isJSONSchemaArray)(schema) && Array.isArray(formData)) {
+            const nonEmptyItems = {};
+            formData.forEach((item, idx) => {
+                const value = removeRecursive(item, schema.items, false, `${path}/${idx}`);
+                if (value !== undefined) {
+                    nonEmptyItems[idx] = value;
+                }
+            });
+            let missingItems = Math.max((schema.minItems || 0) - Object.keys(nonEmptyItems).length, 0);
+            const array = formData.reduce((arr, item, idx) => {
+                const childPath = `${path}/${idx}`;
+                if (idx in nonEmptyItems) {
+                    arr.push(nonEmptyItems[idx]);
+                }
+                else if (missingItems > 0) {
+                    arr.push(removeRecursive(item, schema.items, true, childPath));
+                    missingItems--;
+                }
+                else {
+                    removedArrayItemsAndObjects.push(childPath);
+                }
+                return arr;
+            }, []);
+            return isRequired || array.length > 0 ? array : undefined;
+        }
+        else if (formData === null) {
+            return undefined;
+        }
+        else if (typeof formData === "string") {
+            return formData.trim() || undefined;
+        }
+        return formData;
     }
-    return formData;
 };
 const getShortcuts = (uiSchema) => {
     var _a, _b;

package/lib/components/widgets/SelectWidget.js

@@ -90,7 +90,8 @@ const SelectWidget = (props) => props.schema.type === "array"
     : React.createElement(SearchableDrowndown, Object.assign({}, props));
 exports.default = SelectWidget;
 function SearchableDrowndown(props) {
-    const { id, disabled, readonly, value, uiSchema, options, onChange, includeEmpty = true } = props;
+    var _a;
+    const { id, disabled, readonly, value, uiSchema, options, onChange, includeEmpty = (_a = options.includeEmpty) !== null && _a !== void 0 ? _a : true } = props;
     const { theme } = (0, react_1.useContext)(ReactContext_1.default);
     const { FormControl } = theme;
     const containerRef = (0, react_1.useRef)(null);

package/lib/types.d.ts

@@ -18,6 +18,7 @@ export declare function isJSONSchemaObject(schema: JSONSchema): schema is JSONSc
 export type JSONSchemaArray<T = JSONSchema, D = never> = JSONShemaTypeCommon<"array", D[]> & {
     items: T;
     uniqueItems?: boolean;
+    minItems?: number;
     maxItems?: number;
 };
 export declare function isJSONSchemaArray(schema: JSONSchema): schema is JSONSchemaArray;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luomus/laji-form",
-  "version": "15.1.110",
+  "version": "15.1.112",
   "description": "React module capable of building dynamic forms from Laji form json schemas",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -41,7 +41,7 @@
   "license": "MIT",
   "dependencies": {
     "@luomus/laji-map": "^5.1.19",
-    "@luomus/laji-validate": "^0.0.130",
+    "@luomus/laji-validate": "^0.0.131",
     "@rjsf/core": "~5.1.0",
     "@rjsf/utils": "~5.1.0",
     "@rjsf/validator-ajv6": "~5.1.0",