@luomus/laji-form 15.1.71 → 15.1.72

package/lib/components/LajiForm.d.ts

@@ -5,7 +5,7 @@ import { ReactUtilsType } from "../utils";
 import { Theme } from "../themes/theme";
 import { ContextProps } from "../ReactContext";
 import Form from "@rjsf/core";
-import { Field, Widget, TemplatesType } from "@rjsf/utils";
+import { Field, Widget, TemplatesType, ErrorSchema } from "@rjsf/utils";
 import ApiClient, { ApiClientImplementation } from "../ApiClient";
 import KeyHandlerService, { ShortcutKeys } from "../services/key-handler-service";
 import SettingsService, { Settings } from "../services/settings-service";
@@ -53,19 +53,21 @@ export interface LajiFormProps extends HasMaybeChildren {
     onSubmit?: (data: {
         formData: any;
     }) => void;
-    onValidationError?: (extraErrors: any) => void;
+    onValidationError?: (extraErrors: ErrorSchema) => void;
     validators?: any;
     warnings?: any;
     onSettingsChange?: (settings: any, global: boolean) => void;
     mediaMetadata?: MediaMetadata;
     theme?: Theme;
     lajiGeoServerAddress?: string;
+    extraErrors: ErrorSchema;
 }
 export interface LajiFormState {
     submitHooks?: SubmitHook[];
     formContext: FormContext;
     formData?: any;
-    extraErrors?: any;
+    extraErrors?: ErrorSchema;
+    externalErrors?: ErrorSchema;
     error?: boolean;
     runningSubmitHooks?: boolean;
 }

package/lib/components/LajiForm.js

@@ -282,7 +282,8 @@ class LajiForm extends React.Component {
         this.validateAndSubmit = (warnings = true, onlySchema = false) => {
             const { formData } = this.state;
             const { onValidationError, onSubmit } = this.props;
-            return this.validate(warnings, true, onlySchema).then((valid) => {
+            this.setState({ externalErrors: undefined });
+            return this.validate(warnings, true, onlySchema).then(valid => {
                 if (formData !== this.state.formData) {
                     this.validateAndSubmit(warnings, onlySchema);
                 }
@@ -329,12 +330,15 @@ class LajiForm extends React.Component {
                     this.cachedNonliveValidations = (0, deepmerge_1.default)(schemaErrors, _validations);
                     block && this.memoizedFormContext.services.blocker.pop();
                 }
-                const merged = (0, deepmerge_1.default)(_liveValidations, !nonlive
+                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);
                 this.validating = false;
-                resolve(!Object.keys(merged).length);
-                !equals((this.state.extraErrors || {}), merged) && this.setState({ extraErrors: merged }, this.popErrorListIfNeeded);
+                resolve(!Object.keys(mergedAll).length);
+                if (!equals((this.state.extraErrors || {}), mergedAll)) {
+                    this.setState({ extraErrors: mergedAll }, this.popErrorListIfNeeded);
+                }
             }).catch((e) => {
                 block && this.memoizedFormContext.services.blocker.pop();
                 throw e;
@@ -516,11 +520,16 @@ class LajiForm extends React.Component {
         if (this.apiClient && "lang" in props && this.props.lang !== props.lang) {
             this.apiClient.setLang(props.lang);
         }
-        this.setState(this.getStateFromProps(props));
+        this.setState(this.getStateFromProps(props), this.popErrorListIfNeeded);
     }
     getStateFromProps(props) {
+        var _a;
         const state = {
-            formContext: this.getMemoizedFormContext(props)
+            formContext: this.getMemoizedFormContext(props),
+            externalErrors: props.extraErrors,
+            extraErrors: ((_a = this.state) === null || _a === void 0 ? void 0 : _a.extraErrors)
+                ? (0, deepmerge_1.default)(this.state.extraErrors, props.extraErrors || {})
+                : props.extraErrors
         };
         if (((!this.state && props.schema && Object.keys(props.schema).length) || (this.state && !("formData" in this.state))) || ("formData" in props && props.formData !== this.props.formData)) {
             state.formData = state.formContext.services.ids.addLajiFormIds((0, utils_1.getDefaultFormState)(props.schema, props.formData, props.schema))[0];
@@ -632,7 +641,7 @@ class LajiForm extends React.Component {
                 showShortcutsButton && this.props.showShortcutButton !== false && shortcuts && (React.createElement(components_1.TooltipComponent, { tooltip: this.getShorcutButtonTooltip() },
                     React.createElement(components_1.Button, { variant: undefined, onClick: this.toggleHelp }, translations.Shortcuts))),
                 React.createElement(components_1.FailedBackgroundJobsPanel, { jobs: this.state.submitHooks, schema: this.props.schema, uiSchema: uiSchema, formContext: this.state.formContext, errorClickHandler: this.memoizedFormContext.services.focus.focus, ref: this.bgJobRef }),
-                React.createElement(core_1.default, Object.assign({}, this.props, { formData: this.state.formData, uiSchema: uiSchema, ref: this.formRef, onChange: this.onChange, onSubmit: this.onSubmit, fields: this.getFields(this.props.fields), widgets: this.getWidgets(this.props.widgets), templates: this.getTemplates(this.props.templates), formContext: this.state.formContext, validator: validator_ajv6_1.default, noValidate: true, extraErrors: this.state.extraErrors, noHtml5Validate: true, liveValidate: true, autoComplete: "off", tagName: "div", readonly: readonly, disabled: disabled }), this.props.children),
+                React.createElement(core_1.default, Object.assign({}, this.props, { formData: this.state.formData, uiSchema: uiSchema, ref: this.formRef, onChange: this.onChange, onSubmit: this.onSubmit, fields: this.getFields(this.props.fields), widgets: this.getWidgets(this.props.widgets), templates: this.getTemplates(this.props.templates), formContext: this.state.formContext, validator: validator_ajv6_1.default, noValidate: true, extraErrors: this.state.extraErrors || {}, noHtml5Validate: true, liveValidate: true, autoComplete: "off", tagName: "div", readonly: readonly, disabled: disabled }), this.props.children),
                 (!this.props.children && this.props.renderSubmit !== false) ? (React.createElement(components_1.Button, { id: "submit", onClick: this.submit, disabled: readonly || disabled }, this.props.submitText || translations.Submit)) : null,
                 shortcuts &&
                     React.createElement(Panel, { ref: this.shortcutHelpRef, className: "shortcut-help laji-form-popped z-depth-3 hidden", style: { top: (this.props.topOffset || 0) + 5, bottom: (this.props.bottomOffset || 0) + 5 }, variant: "info" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luomus/laji-form",
-  "version": "15.1.71",
+  "version": "15.1.72",
   "description": "React module capable of building dynamic forms from Laji form json schemas",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",