@rjsf/mui 5.10.0 → 5.11.1

package/dist/mui.umd.development.js

@@ -35,46 +35,22 @@
   var Slider__default = /*#__PURE__*/_interopDefaultLegacy(Slider);
   var MenuItem__default = /*#__PURE__*/_interopDefaultLegacy(MenuItem);
 
-  function _extends() {
-    _extends = Object.assign ? Object.assign.bind() : function (target) {
-      for (var i = 1; i < arguments.length; i++) {
-        var source = arguments[i];
-        for (var key in source) {
-          if (Object.prototype.hasOwnProperty.call(source, key)) {
-            target[key] = source[key];
-          }
-        }
-      }
-      return target;
-    };
-    return _extends.apply(this, arguments);
-  }
-  function _objectWithoutPropertiesLoose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-    for (i = 0; i < sourceKeys.length; i++) {
-      key = sourceKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      target[key] = source[key];
-    }
-    return target;
-  }
-
-  var _excluded$4 = ["uiSchema", "registry"];
   /** The `AddButton` renders a button that represent the `Add` action on a form
    */
-  function AddButton(_ref) {
-    var registry = _ref.registry,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
-    var translateString = registry.translateString;
-    return jsxRuntime.jsx(IconButton__default["default"], _extends({
-      title: translateString(utils.TranslatableString.AddItemButton)
-    }, props, {
+  function AddButton({
+    uiSchema,
+    registry,
+    ...props
+  }) {
+    const {
+      translateString
+    } = registry;
+    return jsxRuntime.jsx(IconButton__default["default"], {
+      title: translateString(utils.TranslatableString.AddItemButton),
+      ...props,
       color: 'primary',
       children: jsxRuntime.jsx(AddIcon__default["default"], {})
-    }));
+    });
   }
 
   /** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
@@ -82,26 +58,29 @@
    * @param props - The `ArrayFieldTemplateItemType` props for the component
    */
   function ArrayFieldItemTemplate(props) {
-    var children = props.children,
-      disabled = props.disabled,
-      hasToolbar = props.hasToolbar,
-      hasCopy = props.hasCopy,
-      hasMoveDown = props.hasMoveDown,
-      hasMoveUp = props.hasMoveUp,
-      hasRemove = props.hasRemove,
-      index = props.index,
-      onCopyIndexClick = props.onCopyIndexClick,
-      onDropIndexClick = props.onDropIndexClick,
-      onReorderClick = props.onReorderClick,
-      readonly = props.readonly,
-      uiSchema = props.uiSchema,
-      registry = props.registry;
-    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;
-    var btnStyle = {
+    const {
+      children,
+      disabled,
+      hasToolbar,
+      hasCopy,
+      hasMoveDown,
+      hasMoveUp,
+      hasRemove,
+      index,
+      onCopyIndexClick,
+      onDropIndexClick,
+      onReorderClick,
+      readonly,
+      uiSchema,
+      registry
+    } = props;
+    const {
+      CopyButton,
+      MoveDownButton,
+      MoveUpButton,
+      RemoveButton
+    } = registry.templates.ButtonTemplates;
+    const btnStyle = {
       flex: 1,
       paddingLeft: 6,
       paddingRight: 6,
@@ -158,29 +137,34 @@
     });
   }
 
-  var _excluded$3 = ["key"];
   /** The `ArrayFieldTemplate` component is the template used to render all items in an array.
    *
    * @param props - The `ArrayFieldTemplateItemType` props for the component
    */
   function ArrayFieldTemplate(props) {
-    var canAdd = props.canAdd,
-      disabled = props.disabled,
-      idSchema = props.idSchema,
-      uiSchema = props.uiSchema,
-      items = props.items,
-      onAddClick = props.onAddClick,
-      readonly = props.readonly,
-      registry = props.registry,
-      required = props.required,
-      schema = props.schema,
-      title = props.title;
-    var uiOptions = utils.getUiOptions(uiSchema);
-    var ArrayFieldDescriptionTemplate = utils.getTemplate('ArrayFieldDescriptionTemplate', registry, uiOptions);
-    var ArrayFieldItemTemplate = utils.getTemplate('ArrayFieldItemTemplate', registry, uiOptions);
-    var ArrayFieldTitleTemplate = utils.getTemplate('ArrayFieldTitleTemplate', registry, uiOptions);
+    const {
+      canAdd,
+      disabled,
+      idSchema,
+      uiSchema,
+      items,
+      onAddClick,
+      readonly,
+      registry,
+      required,
+      schema,
+      title
+    } = props;
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const ArrayFieldDescriptionTemplate = utils.getTemplate('ArrayFieldDescriptionTemplate', registry, uiOptions);
+    const ArrayFieldItemTemplate = utils.getTemplate('ArrayFieldItemTemplate', registry, uiOptions);
+    const ArrayFieldTitleTemplate = utils.getTemplate('ArrayFieldTitleTemplate', registry, uiOptions);
     // Button templates are not overridden in the uiSchema
-    var AddButton = registry.templates.ButtonTemplates.AddButton;
+    const {
+      ButtonTemplates: {
+        AddButton
+      }
+    } = registry.templates;
     return jsxRuntime.jsx(Paper__default["default"], {
       elevation: 2,
       children: jsxRuntime.jsxs(Box__default["default"], {
@@ -200,11 +184,12 @@
           registry: registry
         }), jsxRuntime.jsxs(Grid__default["default"], {
           container: true,
-          children: [items && items.map(function (_ref) {
-            var key = _ref.key,
-              itemProps = _objectWithoutPropertiesLoose(_ref, _excluded$3);
-            return jsxRuntime.jsx(ArrayFieldItemTemplate, _extends({}, itemProps), key);
-          }), canAdd && jsxRuntime.jsx(Grid__default["default"], {
+          children: [items && items.map(({
+            key,
+            ...itemProps
+          }) => jsxRuntime.jsx(ArrayFieldItemTemplate, {
+            ...itemProps
+          }, key)), canAdd && jsxRuntime.jsx(Grid__default["default"], {
             container: true,
             justifyContent: 'flex-end',
             children: jsxRuntime.jsx(Grid__default["default"], {
@@ -221,14 +206,12 @@
               })
             })
           })]
-        }, "array-item-list-" + idSchema.$id)]
+        }, `array-item-list-${idSchema.$id}`)]
       })
     });
   }
 
-  var _excluded$2 = ["id", "name", "placeholder", "required", "readonly", "disabled", "type", "label", "hideLabel", "value", "onChange", "onChangeOverride", "onBlur", "onFocus", "autofocus", "options", "schema", "uiSchema", "rawErrors", "formContext", "registry", "InputLabelProps"],
-    _excluded2$1 = ["step", "min", "max"];
-  var TYPES_THAT_SHRINK_LABEL = ['date', 'datetime-local', 'file', 'time'];
+  const TYPES_THAT_SHRINK_LABEL = ['date', 'datetime-local', 'file', 'time'];
   /** The `BaseInputTemplate` is the template to use to render the basic `<input>` component for the `core` theme.
    * It is used as the template for rendering many of the <input> based widgets that differ by `type` and callbacks only.
    * It can be customized/overridden for other themes or individual implementations as needed.
@@ -236,77 +219,91 @@
    * @param props - The `WidgetProps` for this template
    */
   function BaseInputTemplate(props) {
-    var id = props.id,
-      placeholder = props.placeholder,
-      required = props.required,
-      readonly = props.readonly,
-      disabled = props.disabled,
-      type = props.type,
-      label = props.label,
-      hideLabel = props.hideLabel,
-      value = props.value,
-      onChange = props.onChange,
-      onChangeOverride = props.onChangeOverride,
-      onBlur = props.onBlur,
-      onFocus = props.onFocus,
-      autofocus = props.autofocus,
-      options = props.options,
-      schema = props.schema,
-      _props$rawErrors = props.rawErrors,
-      rawErrors = _props$rawErrors === void 0 ? [] : _props$rawErrors,
-      InputLabelProps = props.InputLabelProps,
-      textFieldProps = _objectWithoutPropertiesLoose(props, _excluded$2);
-    var inputProps = utils.getInputProps(schema, type, options);
+    const {
+      id,
+      name,
+      // remove this from textFieldProps
+      placeholder,
+      required,
+      readonly,
+      disabled,
+      type,
+      label,
+      hideLabel,
+      value,
+      onChange,
+      onChangeOverride,
+      onBlur,
+      onFocus,
+      autofocus,
+      options,
+      schema,
+      uiSchema,
+      rawErrors = [],
+      formContext,
+      registry,
+      InputLabelProps,
+      ...textFieldProps
+    } = props;
+    const inputProps = utils.getInputProps(schema, type, options);
     // Now we need to pull out the step, min, max into an inner `inputProps` for material-ui
-    var step = inputProps.step,
-      min = inputProps.min,
-      max = inputProps.max,
-      rest = _objectWithoutPropertiesLoose(inputProps, _excluded2$1);
-    var otherProps = _extends({
-      inputProps: _extends({
-        step: step,
-        min: min,
-        max: max
-      }, schema.examples ? {
-        list: utils.examplesId(id)
-      } : undefined)
-    }, rest);
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange(value === '' ? options.emptyValue : value);
-    };
-    var _onBlur = function _onBlur(_ref2) {
-      var value = _ref2.target.value;
-      return onBlur(id, value);
-    };
-    var _onFocus = function _onFocus(_ref3) {
-      var value = _ref3.target.value;
-      return onFocus(id, value);
+    const {
+      step,
+      min,
+      max,
+      ...rest
+    } = inputProps;
+    const otherProps = {
+      inputProps: {
+        step,
+        min,
+        max,
+        ...(schema.examples ? {
+          list: utils.examplesId(id)
+        } : undefined)
+      },
+      ...rest
     };
-    var DisplayInputLabelProps = TYPES_THAT_SHRINK_LABEL.includes(type) ? _extends({}, InputLabelProps, {
+    const _onChange = ({
+      target: {
+        value
+      }
+    }) => onChange(value === '' ? options.emptyValue : value);
+    const _onBlur = ({
+      target: {
+        value
+      }
+    }) => onBlur(id, value);
+    const _onFocus = ({
+      target: {
+        value
+      }
+    }) => onFocus(id, value);
+    const DisplayInputLabelProps = TYPES_THAT_SHRINK_LABEL.includes(type) ? {
+      ...InputLabelProps,
       shrink: true
-    }) : InputLabelProps;
+    } : InputLabelProps;
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [jsxRuntime.jsx(TextField__default["default"], _extends({
+      children: [jsxRuntime.jsx(TextField__default["default"], {
         id: id,
         name: id,
         placeholder: placeholder,
         label: utils.labelValue(label || undefined, hideLabel, false),
         autoFocus: autofocus,
         required: required,
-        disabled: disabled || readonly
-      }, otherProps, {
+        disabled: disabled || readonly,
+        ...otherProps,
         value: value || value === 0 ? value : '',
         error: rawErrors.length > 0,
         onChange: onChangeOverride || _onChange,
         onBlur: _onBlur,
         onFocus: _onFocus,
-        InputLabelProps: DisplayInputLabelProps
-      }, textFieldProps, {
+        InputLabelProps: DisplayInputLabelProps,
+        ...textFieldProps,
         "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
-      })), Array.isArray(schema.examples) && jsxRuntime.jsx("datalist", {
+      }), Array.isArray(schema.examples) && jsxRuntime.jsx("datalist", {
         id: utils.examplesId(id),
-        children: schema.examples.concat(schema["default"] && !schema.examples.includes(schema["default"]) ? [schema["default"]] : []).map(function (example) {
+        children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map(example => {
           return jsxRuntime.jsx("option", {
             value: example
           }, example);
@@ -320,8 +317,10 @@
    * @param props - The `DescriptionFieldProps` for this component
    */
   function DescriptionField(props) {
-    var id = props.id,
-      description = props.description;
+    const {
+      id,
+      description
+    } = props;
     if (description) {
       return jsxRuntime.jsx(Typography__default["default"], {
         id: id,
@@ -339,10 +338,13 @@
    *
    * @param props - The `ErrorListProps` for this component
    */
-  function ErrorList(_ref) {
-    var errors = _ref.errors,
-      registry = _ref.registry;
-    var translateString = registry.translateString;
+  function ErrorList({
+    errors,
+    registry
+  }) {
+    const {
+      translateString
+    } = registry;
     return jsxRuntime.jsx(Paper__default["default"], {
       elevation: 2,
       children: jsxRuntime.jsxs(Box__default["default"], {
@@ -353,7 +355,7 @@
           children: translateString(utils.TranslatableString.ErrorsLabel)
         }), jsxRuntime.jsx(List__default["default"], {
           dense: true,
-          children: errors.map(function (error, i) {
+          children: errors.map((error, i) => {
             return jsxRuntime.jsxs(ListItem__default["default"], {
               children: [jsxRuntime.jsx(ListItemIcon__default["default"], {
                 children: jsxRuntime.jsx(ErrorIcon__default["default"], {
@@ -369,60 +371,81 @@
     });
   }
 
-  var _excluded$1 = ["icon", "color", "uiSchema", "registry"],
-    _excluded2 = ["iconType"];
   function MuiIconButton(props) {
-    var icon = props.icon,
-      color = props.color,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded$1);
-    return jsxRuntime.jsx(IconButton__default["default"], _extends({}, otherProps, {
+    const {
+      icon,
+      color,
+      uiSchema,
+      registry,
+      ...otherProps
+    } = props;
+    return jsxRuntime.jsx(IconButton__default["default"], {
+      ...otherProps,
       size: 'small',
       color: color,
       children: icon
-    }));
+    });
   }
   function CopyButton(props) {
-    var translateString = props.registry.translateString;
-    return jsxRuntime.jsx(MuiIconButton, _extends({
-      title: translateString(utils.TranslatableString.CopyButton)
-    }, props, {
+    const {
+      registry: {
+        translateString
+      }
+    } = props;
+    return jsxRuntime.jsx(MuiIconButton, {
+      title: translateString(utils.TranslatableString.CopyButton),
+      ...props,
       icon: jsxRuntime.jsx(CopyIcon__default["default"], {
         fontSize: 'small'
       })
-    }));
+    });
   }
   function MoveDownButton(props) {
-    var translateString = props.registry.translateString;
-    return jsxRuntime.jsx(MuiIconButton, _extends({
-      title: translateString(utils.TranslatableString.MoveDownButton)
-    }, props, {
+    const {
+      registry: {
+        translateString
+      }
+    } = props;
+    return jsxRuntime.jsx(MuiIconButton, {
+      title: translateString(utils.TranslatableString.MoveDownButton),
+      ...props,
       icon: jsxRuntime.jsx(ArrowDownwardIcon__default["default"], {
         fontSize: 'small'
       })
-    }));
+    });
   }
   function MoveUpButton(props) {
-    var translateString = props.registry.translateString;
-    return jsxRuntime.jsx(MuiIconButton, _extends({
-      title: translateString(utils.TranslatableString.MoveUpButton)
-    }, props, {
+    const {
+      registry: {
+        translateString
+      }
+    } = props;
+    return jsxRuntime.jsx(MuiIconButton, {
+      title: translateString(utils.TranslatableString.MoveUpButton),
+      ...props,
       icon: jsxRuntime.jsx(ArrowUpwardIcon__default["default"], {
         fontSize: 'small'
       })
-    }));
+    });
   }
   function RemoveButton(props) {
-    var iconType = props.iconType,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded2);
-    var translateString = otherProps.registry.translateString;
-    return jsxRuntime.jsx(MuiIconButton, _extends({
-      title: translateString(utils.TranslatableString.RemoveButton)
-    }, otherProps, {
+    const {
+      iconType,
+      ...otherProps
+    } = props;
+    const {
+      registry: {
+        translateString
+      }
+    } = otherProps;
+    return jsxRuntime.jsx(MuiIconButton, {
+      title: translateString(utils.TranslatableString.RemoveButton),
+      ...otherProps,
       color: 'error',
       icon: jsxRuntime.jsx(RemoveIcon__default["default"], {
         fontSize: iconType === 'default' ? undefined : 'small'
       })
-    }));
+    });
   }
 
   /** The `FieldErrorTemplate` component renders the errors local to the particular field
@@ -430,17 +453,18 @@
    * @param props - The `FieldErrorProps` for the errors being rendered
    */
   function FieldErrorTemplate(props) {
-    var _props$errors = props.errors,
-      errors = _props$errors === void 0 ? [] : _props$errors,
-      idSchema = props.idSchema;
+    const {
+      errors = [],
+      idSchema
+    } = props;
     if (errors.length === 0) {
       return null;
     }
-    var id = utils.errorId(idSchema);
+    const id = utils.errorId(idSchema);
     return jsxRuntime.jsx(List__default["default"], {
       dense: true,
       disablePadding: true,
-      children: errors.map(function (error, i) {
+      children: errors.map((error, i) => {
         return jsxRuntime.jsx(ListItem__default["default"], {
           disableGutters: true,
           children: jsxRuntime.jsx(FormHelperText__default["default"], {
@@ -457,12 +481,14 @@
    * @param props - The `FieldHelpProps` to be rendered
    */
   function FieldHelpTemplate(props) {
-    var idSchema = props.idSchema,
-      help = props.help;
+    const {
+      idSchema,
+      help
+    } = props;
     if (!help) {
       return null;
     }
-    var id = utils.helpId(idSchema);
+    const id = utils.helpId(idSchema);
     return jsxRuntime.jsx(FormHelperText__default["default"], {
       id: id,
       children: help
@@ -475,29 +501,30 @@
    * @param props - The `FieldTemplateProps` for this component
    */
   function FieldTemplate(props) {
-    var id = props.id,
-      children = props.children,
-      classNames = props.classNames,
-      style = props.style,
-      disabled = props.disabled,
-      displayLabel = props.displayLabel,
-      hidden = props.hidden,
-      label = props.label,
-      onDropPropertyClick = props.onDropPropertyClick,
-      onKeyChange = props.onKeyChange,
-      readonly = props.readonly,
-      required = props.required,
-      _props$rawErrors = props.rawErrors,
-      rawErrors = _props$rawErrors === void 0 ? [] : _props$rawErrors,
-      errors = props.errors,
-      help = props.help,
-      description = props.description,
-      rawDescription = props.rawDescription,
-      schema = props.schema,
-      uiSchema = props.uiSchema,
-      registry = props.registry;
-    var uiOptions = utils.getUiOptions(uiSchema);
-    var WrapIfAdditionalTemplate = utils.getTemplate('WrapIfAdditionalTemplate', registry, uiOptions);
+    const {
+      id,
+      children,
+      classNames,
+      style,
+      disabled,
+      displayLabel,
+      hidden,
+      label,
+      onDropPropertyClick,
+      onKeyChange,
+      readonly,
+      required,
+      rawErrors = [],
+      errors,
+      help,
+      description,
+      rawDescription,
+      schema,
+      uiSchema,
+      registry
+    } = props;
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const WrapIfAdditionalTemplate = utils.getTemplate('WrapIfAdditionalTemplate', registry, uiOptions);
     if (hidden) {
       return jsxRuntime.jsx("div", {
         style: {
@@ -539,23 +566,29 @@
    * @param props - The `ObjectFieldTemplateProps` for this component
    */
   function ObjectFieldTemplate(props) {
-    var description = props.description,
-      title = props.title,
-      properties = props.properties,
-      required = props.required,
-      disabled = props.disabled,
-      readonly = props.readonly,
-      uiSchema = props.uiSchema,
-      idSchema = props.idSchema,
-      schema = props.schema,
-      formData = props.formData,
-      onAddClick = props.onAddClick,
-      registry = props.registry;
-    var uiOptions = utils.getUiOptions(uiSchema);
-    var TitleFieldTemplate = utils.getTemplate('TitleFieldTemplate', registry, uiOptions);
-    var DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, uiOptions);
+    const {
+      description,
+      title,
+      properties,
+      required,
+      disabled,
+      readonly,
+      uiSchema,
+      idSchema,
+      schema,
+      formData,
+      onAddClick,
+      registry
+    } = props;
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const TitleFieldTemplate = utils.getTemplate('TitleFieldTemplate', registry, uiOptions);
+    const DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, uiOptions);
     // Button templates are not overridden in the uiSchema
-    var AddButton = registry.templates.ButtonTemplates.AddButton;
+    const {
+      ButtonTemplates: {
+        AddButton
+      }
+    } = registry.templates;
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [title && jsxRuntime.jsx(TitleFieldTemplate, {
         id: utils.titleId(idSchema),
@@ -576,20 +609,17 @@
         style: {
           marginTop: '10px'
         },
-        children: [properties.map(function (element, index) {
-          return (
-            // Remove the <Grid> if the inner element is hidden as the <Grid>
-            // itself would otherwise still take up space.
-            element.hidden ? element.content : jsxRuntime.jsx(Grid__default["default"], {
-              item: true,
-              xs: 12,
-              style: {
-                marginBottom: '10px'
-              },
-              children: element.content
-            }, index)
-          );
-        }), utils.canExpand(schema, uiSchema, formData) && jsxRuntime.jsx(Grid__default["default"], {
+        children: [properties.map((element, index) =>
+        // Remove the <Grid> if the inner element is hidden as the <Grid>
+        // itself would otherwise still take up space.
+        element.hidden ? element.content : jsxRuntime.jsx(Grid__default["default"], {
+          item: true,
+          xs: 12,
+          style: {
+            marginBottom: '10px'
+          },
+          children: element.content
+        }, index)), utils.canExpand(schema, uiSchema, formData) && jsxRuntime.jsx(Grid__default["default"], {
           container: true,
           justifyContent: 'flex-end',
           children: jsxRuntime.jsx(Grid__default["default"], {
@@ -609,25 +639,26 @@
 
   /** The `SubmitButton` renders a button that represent the `Submit` action on a form
    */
-  function SubmitButton(_ref) {
-    var uiSchema = _ref.uiSchema;
-    var _getSubmitButtonOptio = utils.getSubmitButtonOptions(uiSchema),
-      submitText = _getSubmitButtonOptio.submitText,
-      norender = _getSubmitButtonOptio.norender,
-      _getSubmitButtonOptio2 = _getSubmitButtonOptio.props,
-      submitButtonProps = _getSubmitButtonOptio2 === void 0 ? {} : _getSubmitButtonOptio2;
+  function SubmitButton({
+    uiSchema
+  }) {
+    const {
+      submitText,
+      norender,
+      props: submitButtonProps = {}
+    } = utils.getSubmitButtonOptions(uiSchema);
     if (norender) {
       return null;
     }
     return jsxRuntime.jsx(Box__default["default"], {
       marginTop: 3,
-      children: jsxRuntime.jsx(Button__default["default"], _extends({
+      children: jsxRuntime.jsx(Button__default["default"], {
         type: 'submit',
         variant: 'contained',
-        color: 'primary'
-      }, submitButtonProps, {
+        color: 'primary',
+        ...submitButtonProps,
         children: submitText
-      }))
+      })
     });
   }
 
@@ -635,9 +666,10 @@
    *
    * @param props - The `TitleFieldProps` for this component
    */
-  function TitleField(_ref) {
-    var id = _ref.id,
-      title = _ref.title;
+  function TitleField({
+    id,
+    title
+  }) {
     return jsxRuntime.jsxs(Box__default["default"], {
       id: id,
       mb: 1,
@@ -655,26 +687,32 @@
    * @param props - The `WrapIfAdditionalProps` for this component
    */
   function WrapIfAdditionalTemplate(props) {
-    var children = props.children,
-      classNames = props.classNames,
-      style = props.style,
-      disabled = props.disabled,
-      id = props.id,
-      label = props.label,
-      onDropPropertyClick = props.onDropPropertyClick,
-      onKeyChange = props.onKeyChange,
-      readonly = props.readonly,
-      required = props.required,
-      schema = props.schema,
-      uiSchema = props.uiSchema,
-      registry = props.registry;
-    var templates = registry.templates,
-      translateString = registry.translateString;
+    const {
+      children,
+      classNames,
+      style,
+      disabled,
+      id,
+      label,
+      onDropPropertyClick,
+      onKeyChange,
+      readonly,
+      required,
+      schema,
+      uiSchema,
+      registry
+    } = props;
+    const {
+      templates,
+      translateString
+    } = registry;
     // Button templates are not overridden in the uiSchema
-    var RemoveButton = templates.ButtonTemplates.RemoveButton;
-    var keyLabel = translateString(utils.TranslatableString.KeyLabel, [label]);
-    var additional = (utils.ADDITIONAL_PROPERTY_FLAG in schema);
-    var btnStyle = {
+    const {
+      RemoveButton
+    } = templates.ButtonTemplates;
+    const keyLabel = translateString(utils.TranslatableString.KeyLabel, [label]);
+    const additional = (utils.ADDITIONAL_PROPERTY_FLAG in schema);
+    const btnStyle = {
       flex: 1,
       paddingLeft: 6,
       paddingRight: 6,
@@ -687,10 +725,9 @@
         children: children
       });
     }
-    var handleBlur = function handleBlur(_ref) {
-      var target = _ref.target;
-      return onKeyChange(target.value);
-    };
+    const handleBlur = ({
+      target
+    }) => onKeyChange(target.value);
     return jsxRuntime.jsxs(Grid__default["default"], {
       container: true,
       alignItems: 'center',
@@ -706,8 +743,8 @@
           label: keyLabel,
           defaultValue: label,
           disabled: disabled || readonly,
-          id: id + "-key",
-          name: id + "-key",
+          id: `${id}-key`,
+          name: `${id}-key`,
           onBlur: !readonly ? handleBlur : undefined,
           type: 'text'
         })
@@ -726,30 +763,30 @@
           registry: registry
         })
       })]
-    }, id + "-key");
+    }, `${id}-key`);
   }
 
   function generateTemplates() {
     return {
-      ArrayFieldItemTemplate: ArrayFieldItemTemplate,
-      ArrayFieldTemplate: ArrayFieldTemplate,
-      BaseInputTemplate: BaseInputTemplate,
+      ArrayFieldItemTemplate,
+      ArrayFieldTemplate,
+      BaseInputTemplate,
       ButtonTemplates: {
-        AddButton: AddButton,
-        CopyButton: CopyButton,
-        MoveDownButton: MoveDownButton,
-        MoveUpButton: MoveUpButton,
-        RemoveButton: RemoveButton,
-        SubmitButton: SubmitButton
+        AddButton,
+        CopyButton,
+        MoveDownButton,
+        MoveUpButton,
+        RemoveButton,
+        SubmitButton
       },
       DescriptionFieldTemplate: DescriptionField,
       ErrorListTemplate: ErrorList,
-      FieldErrorTemplate: FieldErrorTemplate,
-      FieldHelpTemplate: FieldHelpTemplate,
-      FieldTemplate: FieldTemplate,
-      ObjectFieldTemplate: ObjectFieldTemplate,
+      FieldErrorTemplate,
+      FieldHelpTemplate,
+      FieldTemplate,
+      ObjectFieldTemplate,
       TitleFieldTemplate: TitleField,
-      WrapIfAdditionalTemplate: WrapIfAdditionalTemplate
+      WrapIfAdditionalTemplate
     };
   }
   var Templates = /*#__PURE__*/generateTemplates();
@@ -760,39 +797,39 @@
    * @param props - The `WidgetProps` for this component
    */
   function CheckboxWidget(props) {
-    var _options$description;
-    var schema = props.schema,
-      id = props.id,
-      value = props.value,
-      disabled = props.disabled,
-      readonly = props.readonly,
-      _props$label = props.label,
-      label = _props$label === void 0 ? '' : _props$label,
-      hideLabel = props.hideLabel,
-      autofocus = props.autofocus,
-      onChange = props.onChange,
-      onBlur = props.onBlur,
-      onFocus = props.onFocus,
-      registry = props.registry,
-      options = props.options,
-      uiSchema = props.uiSchema;
-    var DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, options);
+    const {
+      schema,
+      id,
+      value,
+      disabled,
+      readonly,
+      label = '',
+      hideLabel,
+      autofocus,
+      onChange,
+      onBlur,
+      onFocus,
+      registry,
+      options,
+      uiSchema
+    } = props;
+    const DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, options);
     // Because an unchecked checkbox will cause html5 validation to fail, only add
     // the "required" attribute if the field value must be "true", due to the
     // "const" or "enum" keywords
-    var required = utils.schemaRequiresTrueValue(schema);
-    var _onChange = function _onChange(_, checked) {
-      return onChange(checked);
-    };
-    var _onBlur = function _onBlur(_ref) {
-      var value = _ref.target.value;
-      return onBlur(id, value);
-    };
-    var _onFocus = function _onFocus(_ref2) {
-      var value = _ref2.target.value;
-      return onFocus(id, value);
-    };
-    var description = (_options$description = options.description) != null ? _options$description : schema.description;
+    const required = utils.schemaRequiresTrueValue(schema);
+    const _onChange = (_, checked) => onChange(checked);
+    const _onBlur = ({
+      target: {
+        value
+      }
+    }) => onBlur(id, value);
+    const _onFocus = ({
+      target: {
+        value
+      }
+    }) => onFocus(id, value);
+    const description = options.description ?? schema.description;
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [!hideLabel && !!description && jsxRuntime.jsx(DescriptionFieldTemplate, {
         id: utils.descriptionId(id),
@@ -823,42 +860,48 @@
    *
    * @param props - The `WidgetProps` for this component
    */
-  function CheckboxesWidget(_ref) {
-    var label = _ref.label,
-      hideLabel = _ref.hideLabel,
-      id = _ref.id,
-      disabled = _ref.disabled,
-      options = _ref.options,
-      value = _ref.value,
-      autofocus = _ref.autofocus,
-      readonly = _ref.readonly,
-      required = _ref.required,
-      onChange = _ref.onChange,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus;
-    var enumOptions = options.enumOptions,
-      enumDisabled = options.enumDisabled,
-      inline = options.inline,
-      emptyValue = options.emptyValue;
-    var checkboxesValues = Array.isArray(value) ? value : [value];
-    var _onChange = function _onChange(index) {
-      return function (_ref2) {
-        var checked = _ref2.target.checked;
-        if (checked) {
-          onChange(utils.enumOptionsSelectValue(index, checkboxesValues, enumOptions));
-        } else {
-          onChange(utils.enumOptionsDeselectValue(index, checkboxesValues, enumOptions));
-        }
-      };
-    };
-    var _onBlur = function _onBlur(_ref3) {
-      var value = _ref3.target.value;
-      return onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    };
-    var _onFocus = function _onFocus(_ref4) {
-      var value = _ref4.target.value;
-      return onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
+  function CheckboxesWidget({
+    label,
+    hideLabel,
+    id,
+    disabled,
+    options,
+    value,
+    autofocus,
+    readonly,
+    required,
+    onChange,
+    onBlur,
+    onFocus
+  }) {
+    const {
+      enumOptions,
+      enumDisabled,
+      inline,
+      emptyValue
+    } = options;
+    const checkboxesValues = Array.isArray(value) ? value : [value];
+    const _onChange = index => ({
+      target: {
+        checked
+      }
+    }) => {
+      if (checked) {
+        onChange(utils.enumOptionsSelectValue(index, checkboxesValues, enumOptions));
+      } else {
+        onChange(utils.enumOptionsDeselectValue(index, checkboxesValues, enumOptions));
+      }
     };
+    const _onBlur = ({
+      target: {
+        value
+      }
+    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
+    const _onFocus = ({
+      target: {
+        value
+      }
+    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [utils.labelValue(jsxRuntime.jsx(FormLabel__default["default"], {
         required: required,
@@ -867,10 +910,10 @@
       }), hideLabel), jsxRuntime.jsx(FormGroup__default["default"], {
         id: id,
         row: !!inline,
-        children: Array.isArray(enumOptions) && enumOptions.map(function (option, index) {
-          var checked = utils.enumOptionsIsSelected(option.value, checkboxesValues);
-          var itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-          var checkbox = jsxRuntime.jsx(Checkbox__default["default"], {
+        children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+          const checked = utils.enumOptionsIsSelected(option.value, checkboxesValues);
+          const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
+          const checkbox = jsxRuntime.jsx(Checkbox__default["default"], {
             id: utils.optionId(id, index),
             name: id,
             checked: checked,
@@ -895,35 +938,37 @@
    *
    * @param props - The `WidgetProps` for this component
    */
-  function RadioWidget(_ref) {
-    var _enumOptionsIndexForV;
-    var id = _ref.id,
-      options = _ref.options,
-      value = _ref.value,
-      required = _ref.required,
-      disabled = _ref.disabled,
-      readonly = _ref.readonly,
-      label = _ref.label,
-      hideLabel = _ref.hideLabel,
-      onChange = _ref.onChange,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus;
-    var enumOptions = options.enumOptions,
-      enumDisabled = options.enumDisabled,
-      emptyValue = options.emptyValue;
-    var _onChange = function _onChange(_, value) {
-      return onChange(utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    };
-    var _onBlur = function _onBlur(_ref2) {
-      var value = _ref2.target.value;
-      return onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    };
-    var _onFocus = function _onFocus(_ref3) {
-      var value = _ref3.target.value;
-      return onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    };
-    var row = options ? options.inline : false;
-    var selectedIndex = (_enumOptionsIndexForV = utils.enumOptionsIndexForValue(value, enumOptions)) != null ? _enumOptionsIndexForV : null;
+  function RadioWidget({
+    id,
+    options,
+    value,
+    required,
+    disabled,
+    readonly,
+    label,
+    hideLabel,
+    onChange,
+    onBlur,
+    onFocus
+  }) {
+    const {
+      enumOptions,
+      enumDisabled,
+      emptyValue
+    } = options;
+    const _onChange = (_, value) => onChange(utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
+    const _onBlur = ({
+      target: {
+        value
+      }
+    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
+    const _onFocus = ({
+      target: {
+        value
+      }
+    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
+    const row = options ? options.inline : false;
+    const selectedIndex = utils.enumOptionsIndexForValue(value, enumOptions) ?? null;
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [utils.labelValue(jsxRuntime.jsx(FormLabel__default["default"], {
         required: required,
@@ -938,9 +983,9 @@
         onBlur: _onBlur,
         onFocus: _onFocus,
         "aria-describedby": utils.ariaDescribedByIds(id),
-        children: Array.isArray(enumOptions) && enumOptions.map(function (option, index) {
-          var itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-          var radio = jsxRuntime.jsx(FormControlLabel__default["default"], {
+        children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+          const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
+          const radio = jsxRuntime.jsx(FormControlLabel__default["default"], {
             control: jsxRuntime.jsx(Radio__default["default"], {
               name: id,
               id: utils.optionId(id, index),
@@ -962,96 +1007,112 @@
    * @param props - The `WidgetProps` for this component
    */
   function RangeWidget(props) {
-    var value = props.value,
-      readonly = props.readonly,
-      disabled = props.disabled,
-      onBlur = props.onBlur,
-      onFocus = props.onFocus,
-      options = props.options,
-      schema = props.schema,
-      onChange = props.onChange,
-      required = props.required,
-      label = props.label,
-      hideLabel = props.hideLabel,
-      id = props.id;
-    var sliderProps = _extends({
-      value: value,
-      label: label,
-      id: id,
-      name: id
-    }, utils.rangeSpec(schema));
-    var _onChange = function _onChange(_, value) {
-      onChange(value != null ? value : options.emptyValue);
-    };
-    var _onBlur = function _onBlur(_ref) {
-      var value = _ref.target.value;
-      return onBlur(id, value);
+    const {
+      value,
+      readonly,
+      disabled,
+      onBlur,
+      onFocus,
+      options,
+      schema,
+      onChange,
+      required,
+      label,
+      hideLabel,
+      id
+    } = props;
+    const sliderProps = {
+      value,
+      label,
+      id,
+      name: id,
+      ...utils.rangeSpec(schema)
     };
-    var _onFocus = function _onFocus(_ref2) {
-      var value = _ref2.target.value;
-      return onFocus(id, value);
+    const _onChange = (_, value) => {
+      onChange(value ?? options.emptyValue);
     };
+    const _onBlur = ({
+      target: {
+        value
+      }
+    }) => onBlur(id, value);
+    const _onFocus = ({
+      target: {
+        value
+      }
+    }) => onFocus(id, value);
     return jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [utils.labelValue(jsxRuntime.jsx(FormLabel__default["default"], {
         required: required,
         htmlFor: id,
         children: label || undefined
-      }), hideLabel), jsxRuntime.jsx(Slider__default["default"], _extends({
+      }), hideLabel), jsxRuntime.jsx(Slider__default["default"], {
         disabled: disabled || readonly,
         onChange: _onChange,
         onBlur: _onBlur,
         onFocus: _onFocus,
-        valueLabelDisplay: 'auto'
-      }, sliderProps, {
+        valueLabelDisplay: 'auto',
+        ...sliderProps,
         "aria-describedby": utils.ariaDescribedByIds(id)
-      }))]
+      })]
     });
   }
 
-  var _excluded = ["schema", "id", "name", "options", "label", "hideLabel", "required", "disabled", "placeholder", "readonly", "value", "multiple", "autofocus", "onChange", "onBlur", "onFocus", "rawErrors", "registry", "uiSchema", "hideError", "formContext"];
   /** The `SelectWidget` is a widget for rendering dropdowns.
    *  It is typically used with string properties constrained with enum options.
    *
    * @param props - The `WidgetProps` for this component
    */
-  function SelectWidget(_ref) {
-    var id = _ref.id,
-      options = _ref.options,
-      label = _ref.label,
-      hideLabel = _ref.hideLabel,
-      required = _ref.required,
-      disabled = _ref.disabled,
-      placeholder = _ref.placeholder,
-      readonly = _ref.readonly,
-      value = _ref.value,
-      multiple = _ref.multiple,
-      autofocus = _ref.autofocus,
-      onChange = _ref.onChange,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus,
-      _ref$rawErrors = _ref.rawErrors,
-      rawErrors = _ref$rawErrors === void 0 ? [] : _ref$rawErrors,
-      textFieldProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-    var enumOptions = options.enumOptions,
-      enumDisabled = options.enumDisabled,
-      optEmptyVal = options.emptyValue;
+  function SelectWidget({
+    schema,
+    id,
+    name,
+    // remove this from textFieldProps
+    options,
+    label,
+    hideLabel,
+    required,
+    disabled,
+    placeholder,
+    readonly,
+    value,
+    multiple,
+    autofocus,
+    onChange,
+    onBlur,
+    onFocus,
+    rawErrors = [],
+    registry,
+    uiSchema,
+    hideError,
+    formContext,
+    ...textFieldProps
+  }) {
+    const {
+      enumOptions,
+      enumDisabled,
+      emptyValue: optEmptyVal
+    } = options;
     multiple = typeof multiple === 'undefined' ? false : !!multiple;
-    var emptyValue = multiple ? [] : '';
-    var isEmpty = typeof value === 'undefined' || multiple && value.length < 1 || !multiple && value === emptyValue;
-    var _onChange = function _onChange(_ref2) {
-      var value = _ref2.target.value;
-      return onChange(utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-    };
-    var _onBlur = function _onBlur(_ref3) {
-      var value = _ref3.target.value;
-      return onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-    };
-    var _onFocus = function _onFocus(_ref4) {
-      var value = _ref4.target.value;
-      return onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-    };
-    var selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions, multiple);
-    return jsxRuntime.jsx(TextField__default["default"], _extends({
+    const emptyValue = multiple ? [] : '';
+    const isEmpty = typeof value === 'undefined' || multiple && value.length < 1 || !multiple && value === emptyValue;
+    const _onChange = ({
+      target: {
+        value
+      }
+    }) => onChange(utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
+    const _onBlur = ({
+      target: {
+        value
+      }
+    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
+    const _onFocus = ({
+      target: {
+        value
+      }
+    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
+    const selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions, multiple);
+    return jsxRuntime.jsx(TextField__default["default"], {
       id: id,
       name: id,
       label: utils.labelValue(label || undefined, hideLabel, false),
@@ -1063,28 +1124,31 @@
       error: rawErrors.length > 0,
       onChange: _onChange,
       onBlur: _onBlur,
-      onFocus: _onFocus
-    }, textFieldProps, {
+      onFocus: _onFocus,
+      ...textFieldProps,
       select // Apply this and the following props after the potential overrides defined in textFieldProps
       : true,
-      InputLabelProps: _extends({}, textFieldProps.InputLabelProps, {
+      InputLabelProps: {
+        ...textFieldProps.InputLabelProps,
         shrink: !isEmpty
-      }),
-      SelectProps: _extends({}, textFieldProps.SelectProps, {
-        multiple: multiple
-      }),
+      },
+      SelectProps: {
+        ...textFieldProps.SelectProps,
+        multiple
+      },
       "aria-describedby": utils.ariaDescribedByIds(id),
-      children: Array.isArray(enumOptions) && enumOptions.map(function (_ref5, i) {
-        var value = _ref5.value,
-          label = _ref5.label;
-        var disabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1;
+      children: Array.isArray(enumOptions) && enumOptions.map(({
+        value,
+        label
+      }, i) => {
+        const disabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1;
         return jsxRuntime.jsx(MenuItem__default["default"], {
           value: String(i),
           disabled: disabled,
           children: label
         }, i);
       })
-    }));
+    });
   }
 
   /** The `TextareaWidget` is a widget for rendering input fields as textarea.
@@ -1092,27 +1156,30 @@
    * @param props - The `WidgetProps` for this component
    */
   function TextareaWidget(props) {
-    var options = props.options,
-      registry = props.registry;
-    var BaseInputTemplate = utils.getTemplate('BaseInputTemplate', registry, options);
-    var rows = 5;
+    const {
+      options,
+      registry
+    } = props;
+    const BaseInputTemplate = utils.getTemplate('BaseInputTemplate', registry, options);
+    let rows = 5;
     if (typeof options.rows === 'string' || typeof options.rows === 'number') {
       rows = options.rows;
     }
-    return jsxRuntime.jsx(BaseInputTemplate, _extends({}, props, {
+    return jsxRuntime.jsx(BaseInputTemplate, {
+      ...props,
       multiline: true,
       rows: rows
-    }));
+    });
   }
 
   function generateWidgets() {
     return {
-      CheckboxWidget: CheckboxWidget,
-      CheckboxesWidget: CheckboxesWidget,
-      RadioWidget: RadioWidget,
-      RangeWidget: RangeWidget,
-      SelectWidget: SelectWidget,
-      TextareaWidget: TextareaWidget
+      CheckboxWidget,
+      CheckboxesWidget,
+      RadioWidget,
+      RangeWidget,
+      SelectWidget,
+      TextareaWidget
     };
   }
   var Widgets = /*#__PURE__*/generateWidgets();