@rjsf/core 5.2.1 → 5.3.1

package/dist/core.umd.development.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('react'), require('@rjsf/utils'), require('lodash-es/get'), require('lodash-es/isEmpty'), require('lodash-es/pick'), require('lodash-es/toPath'), require('lodash-es/isObject'), require('lodash-es/set'), require('nanoid'), require('lodash-es/omit'), require('lodash-es/has'), require('lodash-es/unset'), require('markdown-to-jsx')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'react', '@rjsf/utils', 'lodash-es/get', 'lodash-es/isEmpty', 'lodash-es/pick', 'lodash-es/toPath', 'lodash-es/isObject', 'lodash-es/set', 'nanoid', 'lodash-es/omit', 'lodash-es/has', 'lodash-es/unset', 'markdown-to-jsx'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.JSONSchemaForm = {}, global.jsxRuntime, global.React, global.utils, global.get, global.isEmpty, global._pick, global._toPath, global.isObject, global.set, global.nanoid, global.omit, global.has, global.unset, global.Markdown));
-})(this, (function (exports, jsxRuntime, react, utils, get, isEmpty, _pick, _toPath, isObject, set, nanoid, omit, has, unset, Markdown) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('react'), require('@rjsf/utils'), require('lodash-es/get'), require('lodash-es/isEmpty'), require('lodash-es/pick'), require('lodash-es/toPath'), require('lodash-es/cloneDeep'), require('lodash-es/isObject'), require('lodash-es/set'), require('nanoid'), require('lodash-es/omit'), require('markdown-to-jsx'), require('lodash-es/has'), require('lodash-es/unset')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'react', '@rjsf/utils', 'lodash-es/get', 'lodash-es/isEmpty', 'lodash-es/pick', 'lodash-es/toPath', 'lodash-es/cloneDeep', 'lodash-es/isObject', 'lodash-es/set', 'nanoid', 'lodash-es/omit', 'markdown-to-jsx', 'lodash-es/has', 'lodash-es/unset'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.JSONSchemaForm = {}, global.jsxRuntime, global.React, global.utils, global.get, global.isEmpty, global._pick, global._toPath, global.cloneDeep, global.isObject, global.set, global.nanoid, global.omit, global.Markdown, global.has, global.unset));
+})(this, (function (exports, jsxRuntime, react, utils, get, isEmpty, _pick, _toPath, cloneDeep, isObject, set, nanoid, omit, Markdown, has, unset) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -10,12 +10,13 @@
   var isEmpty__default = /*#__PURE__*/_interopDefaultLegacy(isEmpty);
   var _pick__default = /*#__PURE__*/_interopDefaultLegacy(_pick);
   var _toPath__default = /*#__PURE__*/_interopDefaultLegacy(_toPath);
+  var cloneDeep__default = /*#__PURE__*/_interopDefaultLegacy(cloneDeep);
   var isObject__default = /*#__PURE__*/_interopDefaultLegacy(isObject);
   var set__default = /*#__PURE__*/_interopDefaultLegacy(set);
   var omit__default = /*#__PURE__*/_interopDefaultLegacy(omit);
+  var Markdown__default = /*#__PURE__*/_interopDefaultLegacy(Markdown);
   var has__default = /*#__PURE__*/_interopDefaultLegacy(has);
   var unset__default = /*#__PURE__*/_interopDefaultLegacy(unset);
-  var Markdown__default = /*#__PURE__*/_interopDefaultLegacy(Markdown);
 
   function _defineProperties(target, props) {
     for (var i = 0; i < props.length; i++) {
@@ -152,6 +153,31 @@
           _this._handleAddClick(event, index);
         };
       };
+      _this.onCopyIndexClick = function (index) {
+        return function (event) {
+          if (event) {
+            event.preventDefault();
+          }
+          var onChange = _this.props.onChange;
+          var keyedFormData = _this.state.keyedFormData;
+          var newKeyedFormDataRow = {
+            key: generateRowId(),
+            item: cloneDeep__default["default"](keyedFormData[index].item)
+          };
+          var newKeyedFormData = [].concat(keyedFormData);
+          if (index !== undefined) {
+            newKeyedFormData.splice(index + 1, 0, newKeyedFormDataRow);
+          } else {
+            newKeyedFormData.push(newKeyedFormDataRow);
+          }
+          _this.setState({
+            keyedFormData: newKeyedFormData,
+            updatedKeyedFormData: true
+          }, function () {
+            return onChange(keyedToPlainFormData(newKeyedFormData));
+          });
+        };
+      };
       _this.onDropIndexClick = function (index) {
         return function (event) {
           if (event) {
@@ -311,8 +337,9 @@
     _proto.canAddItem = function canAddItem(formItems) {
       var _this$props6 = this.props,
         schema = _this$props6.schema,
-        uiSchema = _this$props6.uiSchema;
-      var _getUiOptions = utils.getUiOptions(uiSchema),
+        uiSchema = _this$props6.uiSchema,
+        registry = _this$props6.registry;
+      var _getUiOptions = utils.getUiOptions(uiSchema, registry.globalUiOptions),
         addable = _getUiOptions.addable;
       if (addable !== false) {
         // if ui:options.addable was not explicitly set to false, we can add
@@ -754,10 +781,8 @@
         canAdd = props.canAdd,
         _props$canRemove = props.canRemove,
         canRemove = _props$canRemove === void 0 ? true : _props$canRemove,
-        _props$canMoveUp = props.canMoveUp,
-        canMoveUp = _props$canMoveUp === void 0 ? true : _props$canMoveUp,
-        _props$canMoveDown = props.canMoveDown,
-        canMoveDown = _props$canMoveDown === void 0 ? true : _props$canMoveDown,
+        canMoveUp = props.canMoveUp,
+        canMoveDown = props.canMoveDown,
         itemSchema = props.itemSchema,
         itemData = props.itemData,
         itemUiSchema = props.itemUiSchema,
@@ -779,16 +804,20 @@
         formContext = _this$props13.formContext;
       var _registry$fields = registry.fields,
         ArraySchemaField = _registry$fields.ArraySchemaField,
-        SchemaField = _registry$fields.SchemaField;
+        SchemaField = _registry$fields.SchemaField,
+        globalUiOptions = registry.globalUiOptions;
       var ItemSchemaField = ArraySchemaField || SchemaField;
-      var _getUiOptions5 = utils.getUiOptions(uiSchema),
+      var _getUiOptions5 = utils.getUiOptions(uiSchema, globalUiOptions),
         _getUiOptions5$ordera = _getUiOptions5.orderable,
         orderable = _getUiOptions5$ordera === void 0 ? true : _getUiOptions5$ordera,
         _getUiOptions5$remova = _getUiOptions5.removable,
-        removable = _getUiOptions5$remova === void 0 ? true : _getUiOptions5$remova;
+        removable = _getUiOptions5$remova === void 0 ? true : _getUiOptions5$remova,
+        _getUiOptions5$copyab = _getUiOptions5.copyable,
+        copyable = _getUiOptions5$copyab === void 0 ? false : _getUiOptions5$copyab;
       var has = {
         moveUp: orderable && canMoveUp,
         moveDown: orderable && canMoveDown,
+        copy: copyable && canAdd,
         remove: removable && canRemove,
         toolbar: false
       };
@@ -821,6 +850,7 @@
         className: 'array-item',
         disabled: disabled,
         canAdd: canAdd,
+        hasCopy: has.copy,
         hasToolbar: has.toolbar,
         hasMoveUp: has.moveUp,
         hasMoveDown: has.moveDown,
@@ -829,6 +859,7 @@
         totalItems: totalItems,
         key: key,
         onAddIndexClick: this.onAddIndexClick,
+        onCopyIndexClick: this.onCopyIndexClick,
         onDropIndexClick: this.onDropIndexClick,
         onReorderClick: this.onReorderClick,
         readonly: readonly,
@@ -1281,8 +1312,10 @@
         };
       };
       _this.getAvailableKey = function (preferredKey, formData) {
-        var uiSchema = _this.props.uiSchema;
-        var _getUiOptions = utils.getUiOptions(uiSchema),
+        var _this$props3 = _this.props,
+          uiSchema = _this$props3.uiSchema,
+          registry = _this$props3.registry;
+        var _getUiOptions = utils.getUiOptions(uiSchema, registry.globalUiOptions),
           _getUiOptions$duplica = _getUiOptions.duplicateKeySuffixSeparator,
           duplicateKeySuffixSeparator = _getUiOptions$duplica === void 0 ? '-' : _getUiOptions$duplica;
         var index = 0;
@@ -1298,10 +1331,10 @@
           if (oldValue === value) {
             return;
           }
-          var _this$props3 = _this.props,
-            formData = _this$props3.formData,
-            onChange = _this$props3.onChange,
-            errorSchema = _this$props3.errorSchema;
+          var _this$props4 = _this.props,
+            formData = _this$props4.formData,
+            onChange = _this$props4.onChange,
+            errorSchema = _this$props4.errorSchema;
           value = _this.getAvailableKey(value, formData);
           var newFormData = _extends({}, formData);
           var newKeys = (_newKeys = {}, _newKeys[oldValue] = value, _newKeys);
@@ -1322,10 +1355,10 @@
           if (!schema.additionalProperties) {
             return;
           }
-          var _this$props4 = _this.props,
-            formData = _this$props4.formData,
-            onChange = _this$props4.onChange,
-            registry = _this$props4.registry;
+          var _this$props5 = _this.props,
+            formData = _this$props5.formData,
+            onChange = _this$props5.onChange,
+            registry = _this$props5.registry;
           var newFormData = _extends({}, formData);
           var type = undefined;
           if (isObject__default["default"](schema.additionalProperties)) {
@@ -1400,35 +1433,36 @@
      */
     _proto.render = function render() {
       var _this2 = this;
-      var _this$props5 = this.props,
-        rawSchema = _this$props5.schema,
-        _this$props5$uiSchema = _this$props5.uiSchema,
-        uiSchema = _this$props5$uiSchema === void 0 ? {} : _this$props5$uiSchema,
-        formData = _this$props5.formData,
-        errorSchema = _this$props5.errorSchema,
-        idSchema = _this$props5.idSchema,
-        name = _this$props5.name,
-        _this$props5$required = _this$props5.required,
-        required = _this$props5$required === void 0 ? false : _this$props5$required,
-        _this$props5$disabled = _this$props5.disabled,
-        disabled = _this$props5$disabled === void 0 ? false : _this$props5$disabled,
-        _this$props5$readonly = _this$props5.readonly,
-        readonly = _this$props5$readonly === void 0 ? false : _this$props5$readonly,
-        hideError = _this$props5.hideError,
-        idPrefix = _this$props5.idPrefix,
-        idSeparator = _this$props5.idSeparator,
-        onBlur = _this$props5.onBlur,
-        onFocus = _this$props5.onFocus,
-        registry = _this$props5.registry;
+      var _this$props6 = this.props,
+        rawSchema = _this$props6.schema,
+        _this$props6$uiSchema = _this$props6.uiSchema,
+        uiSchema = _this$props6$uiSchema === void 0 ? {} : _this$props6$uiSchema,
+        formData = _this$props6.formData,
+        errorSchema = _this$props6.errorSchema,
+        idSchema = _this$props6.idSchema,
+        name = _this$props6.name,
+        _this$props6$required = _this$props6.required,
+        required = _this$props6$required === void 0 ? false : _this$props6$required,
+        _this$props6$disabled = _this$props6.disabled,
+        disabled = _this$props6$disabled === void 0 ? false : _this$props6$disabled,
+        _this$props6$readonly = _this$props6.readonly,
+        readonly = _this$props6$readonly === void 0 ? false : _this$props6$readonly,
+        hideError = _this$props6.hideError,
+        idPrefix = _this$props6.idPrefix,
+        idSeparator = _this$props6.idSeparator,
+        onBlur = _this$props6.onBlur,
+        onFocus = _this$props6.onFocus,
+        registry = _this$props6.registry;
       var fields = registry.fields,
         formContext = registry.formContext,
-        schemaUtils = registry.schemaUtils;
+        schemaUtils = registry.schemaUtils,
+        translateString = registry.translateString;
       var SchemaField = fields.SchemaField;
       var schema = schemaUtils.retrieveSchema(rawSchema, formData);
       var uiOptions = utils.getUiOptions(uiSchema);
       var _schema$properties = schema.properties,
         schemaProperties = _schema$properties === void 0 ? {} : _schema$properties;
-      var title = schema.title === undefined ? name : schema.title;
+      var title = uiOptions.title || (schema.title === undefined ? name : schema.title);
       var description = uiOptions.description || schema.description;
       var orderedProperties;
       try {
@@ -1436,14 +1470,14 @@
         orderedProperties = utils.orderProperties(properties, uiOptions.order);
       } catch (err) {
         return jsxRuntime.jsxs("div", {
-          children: [jsxRuntime.jsxs("p", {
+          children: [jsxRuntime.jsx("p", {
             className: 'config-error',
             style: {
               color: 'red'
             },
-            children: ["Invalid ", name || 'root', " object field configuration:", jsxRuntime.jsx("em", {
-              children: err.message
-            }), "."]
+            children: jsxRuntime.jsx(Markdown__default["default"], {
+              children: translateString(utils.TranslatableString.InvalidObjectField, [name || 'root', err.message])
+            })
           }), jsxRuntime.jsx("pre", {
             children: JSON.stringify(schema)
           })]
@@ -1451,7 +1485,7 @@
       }
       var Template = utils.getTemplate('ObjectFieldTemplate', registry, uiOptions);
       var templateProps = {
-        title: uiOptions.title || title,
+        title: title,
         description: description,
         properties: orderedProperties.map(function (name) {
           var addedByAdditionalProperties = has__default["default"](schema, [utils.PROPERTIES_KEY, name, utils.ADDITIONAL_PROPERTY_FLAG]);
@@ -1579,8 +1613,9 @@
       _props$wasPropertyKey = props.wasPropertyKeyModified,
       wasPropertyKeyModified = _props$wasPropertyKey === void 0 ? false : _props$wasPropertyKey;
     var formContext = registry.formContext,
-      schemaUtils = registry.schemaUtils;
-    var uiOptions = utils.getUiOptions(uiSchema);
+      schemaUtils = registry.schemaUtils,
+      globalUiOptions = registry.globalUiOptions;
+    var uiOptions = utils.getUiOptions(uiSchema, globalUiOptions);
     var FieldTemplate = utils.getTemplate('FieldTemplate', registry, uiOptions);
     var DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, uiOptions);
     var FieldHelpTemplate = utils.getTemplate('FieldHelpTemplate', registry, uiOptions);
@@ -1605,7 +1640,7 @@
     if (Object.keys(schema).length === 0) {
       return null;
     }
-    var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema);
+    var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema, globalUiOptions);
     var _ref = errorSchema || {},
       __errors = _ref.__errors,
       fieldErrorSchema = _objectWithoutPropertiesLoose(_ref, _excluded$6);
@@ -1902,13 +1937,16 @@
       hasMoveDown = props.hasMoveDown,
       hasMoveUp = props.hasMoveUp,
       hasRemove = props.hasRemove,
+      hasCopy = props.hasCopy,
       index = props.index,
+      onCopyIndexClick = props.onCopyIndexClick,
       onDropIndexClick = props.onDropIndexClick,
       onReorderClick = props.onReorderClick,
       readonly = props.readonly,
       registry = props.registry,
       uiSchema = props.uiSchema;
     var _registry$templates$B = registry.templates.ButtonTemplates,
+      CopyButton = _registry$templates$B.CopyButton,
       MoveDownButton = _registry$templates$B.MoveDownButton,
       MoveUpButton = _registry$templates$B.MoveUpButton,
       RemoveButton = _registry$templates$B.RemoveButton;
@@ -1943,6 +1981,12 @@
             onClick: onReorderClick(index, index + 1),
             uiSchema: uiSchema,
             registry: registry
+          }), hasCopy && jsxRuntime.jsx(CopyButton, {
+            style: btnStyle,
+            disabled: disabled || readonly,
+            onClick: onCopyIndexClick(index),
+            uiSchema: uiSchema,
+            registry: registry
           }), hasRemove && jsxRuntime.jsx(RemoveButton, {
             style: btnStyle,
             disabled: disabled || readonly,
@@ -2151,6 +2195,15 @@
       })
     }));
   }
+  function CopyButton(props) {
+    var translateString = props.registry.translateString;
+    return jsxRuntime.jsx(IconButton, _extends({
+      title: translateString(utils.TranslatableString.CopyButton),
+      className: 'array-item-copy'
+    }, props, {
+      icon: 'copy'
+    }));
+  }
   function MoveDownButton(props) {
     var translateString = props.registry.translateString;
     return jsxRuntime.jsx(IconButton, _extends({
@@ -2209,6 +2262,7 @@
     return {
       SubmitButton: SubmitButton,
       AddButton: AddButton,
+      CopyButton: CopyButton,
       MoveDownButton: MoveDownButton,
       MoveUpButton: MoveUpButton,
       RemoveButton: RemoveButton
@@ -2690,22 +2744,25 @@
       onChange = _ref2.onChange,
       value = _ref2.value;
     var translateString = registry.translateString;
+    var _useState = react.useState(value),
+      lastValue = _useState[0],
+      setLastValue = _useState[1];
     var _useReducer = react.useReducer(function (state, action) {
         return _extends({}, state, action);
       }, utils.parseDateString(value, time)),
       state = _useReducer[0],
       setState = _useReducer[1];
     react.useEffect(function () {
-      if (value && value !== utils.toDateString(state, time)) {
+      var stateValue = utils.toDateString(state, time);
+      if (readyForChange(state) && stateValue !== value) {
+        // The user changed the date to a new valid data via the comboboxes, so call onChange
+        onChange(stateValue);
+      } else if (lastValue !== value) {
+        // We got a new value in the props
+        setLastValue(value);
         setState(utils.parseDateString(value, time));
       }
-    }, [value, state, time]);
-    react.useEffect(function () {
-      if (readyForChange(state)) {
-        // Only propagate to parent state if we have a complete date{time}
-        onChange(utils.toDateString(state, time));
-      }
-    }, [state, time, onChange]);
+    }, [time, value, onChange, state, lastValue]);
     var handleChange = react.useCallback(function (property, value) {
       var _setState;
       setState((_setState = {}, _setState[property] = value, _setState));
@@ -2715,17 +2772,16 @@
       if (disabled || readonly) {
         return;
       }
-      var nowDateObj = utils.parseDateString(new Date().toJSON(), time);
-      setState(nowDateObj);
+      var nextState = utils.parseDateString(new Date().toJSON(), time);
+      onChange(utils.toDateString(nextState, time));
     }, [disabled, readonly, time]);
     var handleClear = react.useCallback(function (event) {
       event.preventDefault();
       if (disabled || readonly) {
         return;
       }
-      setState(utils.parseDateString('', time));
       onChange(undefined);
-    }, [disabled, readonly, time, onChange]);
+    }, [disabled, readonly, onChange]);
     return jsxRuntime.jsxs("ul", {
       className: 'list-inline',
       children: [dateElementProps(state, time, options.yearsRange).map(function (elemProps, i) {
@@ -3369,6 +3425,26 @@
     return jsxRuntime.jsx(BaseInputTemplate, _extends({}, props));
   }
 
+  /** The `TimeWidget` component uses the `BaseInputTemplate` changing the type to `time` and transforms
+   * the value to undefined when it is falsy during the `onChange` handling.
+   *
+   * @param props - The `WidgetProps` for this component
+   */
+  function TimeWidget(props) {
+    var onChange = props.onChange,
+      options = props.options,
+      registry = props.registry;
+    var BaseInputTemplate = utils.getTemplate('BaseInputTemplate', registry, options);
+    var handleChange = react.useCallback(function (value) {
+      return onChange(value ? value + ":00" : undefined);
+    }, [onChange]);
+    return jsxRuntime.jsx(BaseInputTemplate, _extends({
+      type: 'time'
+    }, props, {
+      onChange: handleChange
+    }));
+  }
+
   /** The `URLWidget` component uses the `BaseInputTemplate` changing the type to `url`.
    *
    * @param props - The `WidgetProps` for this component
@@ -3397,24 +3473,25 @@
 
   function widgets() {
     return {
+      AltDateWidget: AltDateWidget,
+      AltDateTimeWidget: AltDateTimeWidget,
+      CheckboxWidget: CheckboxWidget,
+      CheckboxesWidget: CheckboxesWidget,
+      ColorWidget: ColorWidget,
+      DateWidget: DateWidget,
+      DateTimeWidget: DateTimeWidget,
+      EmailWidget: EmailWidget,
+      FileWidget: FileWidget,
+      HiddenWidget: HiddenWidget,
       PasswordWidget: PasswordWidget,
       RadioWidget: RadioWidget,
-      UpDownWidget: UpDownWidget,
       RangeWidget: RangeWidget,
       SelectWidget: SelectWidget,
       TextWidget: TextWidget,
-      DateWidget: DateWidget,
-      DateTimeWidget: DateTimeWidget,
-      AltDateWidget: AltDateWidget,
-      AltDateTimeWidget: AltDateTimeWidget,
-      EmailWidget: EmailWidget,
-      URLWidget: URLWidget,
       TextareaWidget: TextareaWidget,
-      HiddenWidget: HiddenWidget,
-      ColorWidget: ColorWidget,
-      FileWidget: FileWidget,
-      CheckboxWidget: CheckboxWidget,
-      CheckboxesWidget: CheckboxesWidget
+      TimeWidget: TimeWidget,
+      UpDownWidget: UpDownWidget,
+      URLWidget: URLWidget
     };
   }
 
@@ -3558,6 +3635,21 @@
           return onChange && onChange(_extends({}, _this.state, state), id);
         });
       };
+      _this.reset = function () {
+        var onChange = _this.props.onChange;
+        var newState = _this.getStateFromProps(_this.props, undefined);
+        var newFormData = newState.formData;
+        var state = {
+          formData: newFormData,
+          errorSchema: {},
+          errors: [],
+          schemaValidationErrors: [],
+          schemaValidationErrorSchema: {}
+        };
+        _this.setState(state, function () {
+          return onChange && onChange(_extends({}, _this.state, state));
+        });
+      };
       _this.onBlur = function (id, data) {
         var onBlur = _this.props.onBlur;
         if (onBlur) {
@@ -3771,7 +3863,10 @@
     /** Returns the registry for the form */
     _proto.getRegistry = function getRegistry() {
       var _this$props$templates;
-      var customTranslateString = this.props.translateString;
+      var _this$props4 = this.props,
+        customTranslateString = _this$props4.translateString,
+        _this$props4$uiSchema = _this$props4.uiSchema,
+        uiSchema = _this$props4$uiSchema === void 0 ? {} : _this$props4$uiSchema;
       var schemaUtils = this.state.schemaUtils;
       var _getDefaultRegistry = getDefaultRegistry(),
         fields = _getDefaultRegistry.fields,
@@ -3788,7 +3883,8 @@
         rootSchema: this.props.schema,
         formContext: this.props.formContext || formContext,
         schemaUtils: schemaUtils,
-        translateString: customTranslateString || translateString
+        translateString: customTranslateString || translateString,
+        globalUiOptions: uiSchema[utils.UI_GLOBAL_OPTIONS_KEY]
       };
     }
     /** Provides a function that can be used to programmatically submit the `Form` */;
@@ -3807,11 +3903,11 @@
      * @param error - The error on which to focus
      */;
     _proto.focusOnError = function focusOnError(error) {
-      var _this$props4 = this.props,
-        _this$props4$idPrefix = _this$props4.idPrefix,
-        idPrefix = _this$props4$idPrefix === void 0 ? 'root' : _this$props4$idPrefix,
-        _this$props4$idSepara = _this$props4.idSeparator,
-        idSeparator = _this$props4$idSepara === void 0 ? '_' : _this$props4$idSepara;
+      var _this$props5 = this.props,
+        _this$props5$idPrefix = _this$props5.idPrefix,
+        idPrefix = _this$props5$idPrefix === void 0 ? 'root' : _this$props5$idPrefix,
+        _this$props5$idSepara = _this$props5.idSeparator,
+        idSeparator = _this$props5$idSepara === void 0 ? '_' : _this$props5$idSepara;
       var property = error.property;
       var path = _toPath__default["default"](property);
       if (path[0] === '') {
@@ -3837,10 +3933,10 @@
      * @returns - True if the form is valid, false otherwise.
      */;
     _proto.validateForm = function validateForm() {
-      var _this$props5 = this.props,
-        extraErrors = _this$props5.extraErrors,
-        focusOnFirstError = _this$props5.focusOnFirstError,
-        onError = _this$props5.onError;
+      var _this$props6 = this.props,
+        extraErrors = _this$props6.extraErrors,
+        focusOnFirstError = _this$props6.focusOnFirstError,
+        onError = _this$props6.onError;
       var formData = this.state.formData;
       var schemaUtils = this.state.schemaUtils;
       var schemaValidation = this.validate(formData);
@@ -3877,31 +3973,31 @@
      * needed along with the submit button or any children of the form.
      */;
     _proto.render = function render() {
-      var _this$props6 = this.props,
-        children = _this$props6.children,
-        id = _this$props6.id,
-        idPrefix = _this$props6.idPrefix,
-        idSeparator = _this$props6.idSeparator,
-        _this$props6$classNam = _this$props6.className,
-        className = _this$props6$classNam === void 0 ? '' : _this$props6$classNam,
-        tagName = _this$props6.tagName,
-        name = _this$props6.name,
-        method = _this$props6.method,
-        target = _this$props6.target,
-        action = _this$props6.action,
-        autoComplete = _this$props6.autoComplete,
-        enctype = _this$props6.enctype,
-        acceptcharset = _this$props6.acceptcharset,
-        _this$props6$noHtml5V = _this$props6.noHtml5Validate,
-        noHtml5Validate = _this$props6$noHtml5V === void 0 ? false : _this$props6$noHtml5V,
-        _this$props6$disabled = _this$props6.disabled,
-        disabled = _this$props6$disabled === void 0 ? false : _this$props6$disabled,
-        _this$props6$readonly = _this$props6.readonly,
-        readonly = _this$props6$readonly === void 0 ? false : _this$props6$readonly,
-        formContext = _this$props6.formContext,
-        _this$props6$showErro = _this$props6.showErrorList,
-        showErrorList = _this$props6$showErro === void 0 ? 'top' : _this$props6$showErro,
-        _internalFormWrapper = _this$props6._internalFormWrapper;
+      var _this$props7 = this.props,
+        children = _this$props7.children,
+        id = _this$props7.id,
+        idPrefix = _this$props7.idPrefix,
+        idSeparator = _this$props7.idSeparator,
+        _this$props7$classNam = _this$props7.className,
+        className = _this$props7$classNam === void 0 ? '' : _this$props7$classNam,
+        tagName = _this$props7.tagName,
+        name = _this$props7.name,
+        method = _this$props7.method,
+        target = _this$props7.target,
+        action = _this$props7.action,
+        autoComplete = _this$props7.autoComplete,
+        enctype = _this$props7.enctype,
+        acceptcharset = _this$props7.acceptcharset,
+        _this$props7$noHtml5V = _this$props7.noHtml5Validate,
+        noHtml5Validate = _this$props7$noHtml5V === void 0 ? false : _this$props7$noHtml5V,
+        _this$props7$disabled = _this$props7.disabled,
+        disabled = _this$props7$disabled === void 0 ? false : _this$props7$disabled,
+        _this$props7$readonly = _this$props7.readonly,
+        readonly = _this$props7$readonly === void 0 ? false : _this$props7$readonly,
+        formContext = _this$props7.formContext,
+        _this$props7$showErro = _this$props7.showErrorList,
+        showErrorList = _this$props7$showErro === void 0 ? 'top' : _this$props7$showErro,
+        _internalFormWrapper = _this$props7._internalFormWrapper;
       var _this$state4 = this.state,
         schema = _this$state4.schema,
         uiSchema = _this$state4.uiSchema,