@rjsf/core 5.18.5 → 5.19.0

package/dist/index.js

@@ -1505,7 +1505,7 @@ function SchemaFieldRender(props) {
   );
   const FieldComponent = getFieldComponent(schema, uiOptions, idSchema, registry);
   const disabled = Boolean(uiOptions.disabled ?? props.disabled);
-  const readonly = Boolean(uiOptions.readonly ?? props.readonly ?? props.schema.readOnly ?? schema.readOnly);
+  const readonly = Boolean(uiOptions.readonly ?? (props.readonly || props.schema.readOnly || schema.readOnly));
   const uiSchemaHideError = uiOptions.hideError;
   const hideError = uiSchemaHideError === void 0 ? props.hideError : Boolean(uiSchemaHideError);
   const autofocus = Boolean(uiOptions.autofocus ?? props.autofocus);
@@ -2462,13 +2462,6 @@ var templates_default = templates;
 var import_react8 = require("react");
 var import_utils22 = require("@rjsf/utils");
 var import_jsx_runtime26 = require("react/jsx-runtime");
-function rangeOptions(start, stop) {
-  const options = [];
-  for (let i = start; i <= stop; i++) {
-    options.push({ value: i, label: (0, import_utils22.pad)(i, 2) });
-  }
-  return options;
-}
 function readyForChange(state) {
   return Object.values(state).every((value) => value !== -1);
 }
@@ -2495,7 +2488,7 @@ function DateElement({
       id,
       name,
       className: "form-control",
-      options: { enumOptions: rangeOptions(range[0], range[1]) },
+      options: { enumOptions: (0, import_utils22.dateRangeOptions)(range[0], range[1]) },
       placeholder: type,
       value,
       disabled,
@@ -3285,9 +3278,22 @@ var Form = class extends import_react17.Component {
       };
       return getAllPaths(pathSchema);
     };
+    /** Returns the `formData` after filtering to remove any extra data not in a form field
+     *
+     * @param formData - The data for the `Form`
+     * @returns The `formData` after omitting extra data
+     */
+    this.omitExtraData = (formData) => {
+      const { schema, schemaUtils } = this.state;
+      const retrievedSchema = schemaUtils.retrieveSchema(schema, formData);
+      const pathSchema = schemaUtils.toPathSchema(retrievedSchema, "", formData);
+      const fieldNames = this.getFieldNames(pathSchema, formData);
+      const newFormData = this.getUsedFormData(formData, fieldNames);
+      return newFormData;
+    };
     /** Function to handle changes made to a field in the `Form`. This handler receives an entirely new copy of the
      * `formData` along with a new `ErrorSchema`. It will first update the `formData` with any missing default fields and
-     * then, if `omitExtraData` and `liveOmit` are turned on, the `formData` will be filterer to remove any extra data not
+     * then, if `omitExtraData` and `liveOmit` are turned on, the `formData` will be filtered to remove any extra data not
      * in a form field. Then, the resulting formData will be validated if required. The state will be updated with the new
      * updated (potentially filtered) `formData`, any errors that resulted from validation. Finally the `onChange`
      * callback will be called if specified with the updated state.
@@ -3308,10 +3314,7 @@ var Form = class extends import_react17.Component {
       let newFormData = formData;
       let _retrievedSchema;
       if (omitExtraData === true && liveOmit === true) {
-        _retrievedSchema = schemaUtils.retrieveSchema(schema, formData);
-        const pathSchema = schemaUtils.toPathSchema(_retrievedSchema, "", formData);
-        const fieldNames = this.getFieldNames(pathSchema, formData);
-        newFormData = this.getUsedFormData(formData, fieldNames);
+        newFormData = this.omitExtraData(formData);
         state = {
           formData: newFormData
         };
@@ -3406,14 +3409,10 @@ var Form = class extends import_react17.Component {
       event.persist();
       const { omitExtraData, extraErrors, noValidate, onSubmit } = this.props;
       let { formData: newFormData } = this.state;
-      const { schema, schemaUtils } = this.state;
       if (omitExtraData === true) {
-        const retrievedSchema = schemaUtils.retrieveSchema(schema, newFormData);
-        const pathSchema = schemaUtils.toPathSchema(retrievedSchema, "", newFormData);
-        const fieldNames = this.getFieldNames(pathSchema, newFormData);
-        newFormData = this.getUsedFormData(newFormData, fieldNames);
+        newFormData = this.omitExtraData(newFormData);
       }
-      if (noValidate || this.validateForm()) {
+      if (noValidate || this.validateFormWithFormData(newFormData)) {
         const errorSchema = extraErrors || {};
         const errors = extraErrors ? (0, import_utils39.toErrorList)(extraErrors) : [];
         this.setState(
@@ -3443,6 +3442,59 @@ var Form = class extends import_react17.Component {
         this.formElement.current.requestSubmit();
       }
     };
+    /** Validates the form using the given `formData`. For use on form submission or on programmatic validation.
+     * If `onError` is provided, then it will be called with the list of errors.
+     *
+     * @param formData - The form data to validate
+     * @returns - True if the form is valid, false otherwise.
+     */
+    this.validateFormWithFormData = (formData) => {
+      const { extraErrors, extraErrorsBlockSubmit, focusOnFirstError, onError } = this.props;
+      const { errors: prevErrors } = this.state;
+      const schemaValidation = this.validate(formData);
+      let errors = schemaValidation.errors;
+      let errorSchema = schemaValidation.errorSchema;
+      const schemaValidationErrors = errors;
+      const schemaValidationErrorSchema = errorSchema;
+      const hasError = errors.length > 0 || extraErrors && extraErrorsBlockSubmit;
+      if (hasError) {
+        if (extraErrors) {
+          const merged = (0, import_utils39.validationDataMerge)(schemaValidation, extraErrors);
+          errorSchema = merged.errorSchema;
+          errors = merged.errors;
+        }
+        if (focusOnFirstError) {
+          if (typeof focusOnFirstError === "function") {
+            focusOnFirstError(errors[0]);
+          } else {
+            this.focusOnError(errors[0]);
+          }
+        }
+        this.setState(
+          {
+            errors,
+            errorSchema,
+            schemaValidationErrors,
+            schemaValidationErrorSchema
+          },
+          () => {
+            if (onError) {
+              onError(errors);
+            } else {
+              console.error("Form validation failed", errors);
+            }
+          }
+        );
+      } else if (prevErrors.length > 0) {
+        this.setState({
+          errors: [],
+          errorSchema: {},
+          schemaValidationErrors: [],
+          schemaValidationErrorSchema: {}
+        });
+      }
+      return !hasError;
+    };
     if (!props.validator) {
       throw new Error("A validator is required for Form functionality to work");
     }
@@ -3686,57 +3738,19 @@ var Form = class extends import_react17.Component {
       field.focus();
     }
   }
-  /** Programmatically validate the form. If `onError` is provided, then it will be called with the list of errors the
+  /** Programmatically validate the form.  If `omitExtraData` is true, the `formData` will first be filtered to remove
+   * any extra data not in a form field. If `onError` is provided, then it will be called with the list of errors the
    * same way as would happen on form submission.
    *
    * @returns - True if the form is valid, false otherwise.
    */
   validateForm() {
-    const { extraErrors, extraErrorsBlockSubmit, focusOnFirstError, onError } = this.props;
-    const { formData, errors: prevErrors } = this.state;
-    const schemaValidation = this.validate(formData);
-    let errors = schemaValidation.errors;
-    let errorSchema = schemaValidation.errorSchema;
-    const schemaValidationErrors = errors;
-    const schemaValidationErrorSchema = errorSchema;
-    const hasError = errors.length > 0 || extraErrors && extraErrorsBlockSubmit;
-    if (hasError) {
-      if (extraErrors) {
-        const merged = (0, import_utils39.validationDataMerge)(schemaValidation, extraErrors);
-        errorSchema = merged.errorSchema;
-        errors = merged.errors;
-      }
-      if (focusOnFirstError) {
-        if (typeof focusOnFirstError === "function") {
-          focusOnFirstError(errors[0]);
-        } else {
-          this.focusOnError(errors[0]);
-        }
-      }
-      this.setState(
-        {
-          errors,
-          errorSchema,
-          schemaValidationErrors,
-          schemaValidationErrorSchema
-        },
-        () => {
-          if (onError) {
-            onError(errors);
-          } else {
-            console.error("Form validation failed", errors);
-          }
-        }
-      );
-    } else if (prevErrors.length > 0) {
-      this.setState({
-        errors: [],
-        errorSchema: {},
-        schemaValidationErrors: [],
-        schemaValidationErrorSchema: {}
-      });
+    const { omitExtraData } = this.props;
+    let { formData: newFormData } = this.state;
+    if (omitExtraData === true) {
+      newFormData = this.omitExtraData(newFormData);
     }
-    return !hasError;
+    return this.validateFormWithFormData(newFormData);
   }
   /** Renders the `Form` fields inside the <form> | `tagName` or `_internalFormWrapper`, rendering any errors if
    * needed along with the submit button or any children of the form.