@rjsf/mui 5.11.2 → 5.12.1

package/dist/mui.cjs.development.js

@@ -1,1239 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var core = require('@rjsf/core');
-var jsxRuntime = require('react/jsx-runtime');
-var AddIcon = require('@mui/icons-material/Add');
-var IconButton = require('@mui/material/IconButton');
-var utils = require('@rjsf/utils');
-var Box = require('@mui/material/Box');
-var Grid = require('@mui/material/Grid');
-var Paper = require('@mui/material/Paper');
-var TextField = require('@mui/material/TextField');
-var Typography = require('@mui/material/Typography');
-var ErrorIcon = require('@mui/icons-material/Error');
-var List = require('@mui/material/List');
-var ListItem = require('@mui/material/ListItem');
-var ListItemIcon = require('@mui/material/ListItemIcon');
-var ListItemText = require('@mui/material/ListItemText');
-var ArrowDownwardIcon = require('@mui/icons-material/ArrowDownward');
-var ArrowUpwardIcon = require('@mui/icons-material/ArrowUpward');
-var CopyIcon = require('@mui/icons-material/ContentCopy');
-var RemoveIcon = require('@mui/icons-material/Remove');
-var FormHelperText = require('@mui/material/FormHelperText');
-var FormControl = require('@mui/material/FormControl');
-var Button = require('@mui/material/Button');
-var Divider = require('@mui/material/Divider');
-var Checkbox = require('@mui/material/Checkbox');
-var FormControlLabel = require('@mui/material/FormControlLabel');
-var FormGroup = require('@mui/material/FormGroup');
-var FormLabel = require('@mui/material/FormLabel');
-var Radio = require('@mui/material/Radio');
-var RadioGroup = require('@mui/material/RadioGroup');
-var Slider = require('@mui/material/Slider');
-var MenuItem = require('@mui/material/MenuItem');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var AddIcon__default = /*#__PURE__*/_interopDefaultLegacy(AddIcon);
-var IconButton__default = /*#__PURE__*/_interopDefaultLegacy(IconButton);
-var Box__default = /*#__PURE__*/_interopDefaultLegacy(Box);
-var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
-var Paper__default = /*#__PURE__*/_interopDefaultLegacy(Paper);
-var TextField__default = /*#__PURE__*/_interopDefaultLegacy(TextField);
-var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
-var ErrorIcon__default = /*#__PURE__*/_interopDefaultLegacy(ErrorIcon);
-var List__default = /*#__PURE__*/_interopDefaultLegacy(List);
-var ListItem__default = /*#__PURE__*/_interopDefaultLegacy(ListItem);
-var ListItemIcon__default = /*#__PURE__*/_interopDefaultLegacy(ListItemIcon);
-var ListItemText__default = /*#__PURE__*/_interopDefaultLegacy(ListItemText);
-var ArrowDownwardIcon__default = /*#__PURE__*/_interopDefaultLegacy(ArrowDownwardIcon);
-var ArrowUpwardIcon__default = /*#__PURE__*/_interopDefaultLegacy(ArrowUpwardIcon);
-var CopyIcon__default = /*#__PURE__*/_interopDefaultLegacy(CopyIcon);
-var RemoveIcon__default = /*#__PURE__*/_interopDefaultLegacy(RemoveIcon);
-var FormHelperText__default = /*#__PURE__*/_interopDefaultLegacy(FormHelperText);
-var FormControl__default = /*#__PURE__*/_interopDefaultLegacy(FormControl);
-var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
-var Divider__default = /*#__PURE__*/_interopDefaultLegacy(Divider);
-var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
-var FormControlLabel__default = /*#__PURE__*/_interopDefaultLegacy(FormControlLabel);
-var FormGroup__default = /*#__PURE__*/_interopDefaultLegacy(FormGroup);
-var FormLabel__default = /*#__PURE__*/_interopDefaultLegacy(FormLabel);
-var Radio__default = /*#__PURE__*/_interopDefaultLegacy(Radio);
-var RadioGroup__default = /*#__PURE__*/_interopDefaultLegacy(RadioGroup);
-var Slider__default = /*#__PURE__*/_interopDefaultLegacy(Slider);
-var MenuItem__default = /*#__PURE__*/_interopDefaultLegacy(MenuItem);
-
-/** The `AddButton` renders a button that represent the `Add` action on a form
- */
-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.
- *
- * @param props - The `ArrayFieldTemplateItemType` props for the component
- */
-function ArrayFieldItemTemplate(props) {
-  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,
-    fontWeight: 'bold',
-    minWidth: 0
-  };
-  return jsxRuntime.jsxs(Grid__default["default"], {
-    container: true,
-    alignItems: 'center',
-    children: [jsxRuntime.jsx(Grid__default["default"], {
-      item: true,
-      xs: true,
-      style: {
-        overflow: 'auto'
-      },
-      children: jsxRuntime.jsx(Box__default["default"], {
-        mb: 2,
-        children: jsxRuntime.jsx(Paper__default["default"], {
-          elevation: 2,
-          children: jsxRuntime.jsx(Box__default["default"], {
-            p: 2,
-            children: children
-          })
-        })
-      })
-    }), hasToolbar && jsxRuntime.jsxs(Grid__default["default"], {
-      item: true,
-      children: [(hasMoveUp || hasMoveDown) && jsxRuntime.jsx(MoveUpButton, {
-        style: btnStyle,
-        disabled: disabled || readonly || !hasMoveUp,
-        onClick: onReorderClick(index, index - 1),
-        uiSchema: uiSchema,
-        registry: registry
-      }), (hasMoveUp || hasMoveDown) && jsxRuntime.jsx(MoveDownButton, {
-        style: btnStyle,
-        disabled: disabled || readonly || !hasMoveDown,
-        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,
-        onClick: onDropIndexClick(index),
-        uiSchema: uiSchema,
-        registry: registry
-      })]
-    })]
-  });
-}
-
-/** 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) {
-  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
-  const {
-    ButtonTemplates: {
-      AddButton
-    }
-  } = registry.templates;
-  return jsxRuntime.jsx(Paper__default["default"], {
-    elevation: 2,
-    children: jsxRuntime.jsxs(Box__default["default"], {
-      p: 2,
-      children: [jsxRuntime.jsx(ArrayFieldTitleTemplate, {
-        idSchema: idSchema,
-        title: uiOptions.title || title,
-        schema: schema,
-        uiSchema: uiSchema,
-        required: required,
-        registry: registry
-      }), jsxRuntime.jsx(ArrayFieldDescriptionTemplate, {
-        idSchema: idSchema,
-        description: uiOptions.description || schema.description,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), jsxRuntime.jsxs(Grid__default["default"], {
-        container: true,
-        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"], {
-            item: true,
-            children: jsxRuntime.jsx(Box__default["default"], {
-              mt: 2,
-              children: jsxRuntime.jsx(AddButton, {
-                className: 'array-item-add',
-                onClick: onAddClick,
-                disabled: disabled || readonly,
-                uiSchema: uiSchema,
-                registry: registry
-              })
-            })
-          })
-        })]
-      }, `array-item-list-${idSchema.$id}`)]
-    })
-  });
-}
-
-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.
- *
- * @param props - The `WidgetProps` for this template
- */
-function BaseInputTemplate(props) {
-  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
-  const {
-    step,
-    min,
-    max,
-    ...rest
-  } = inputProps;
-  const otherProps = {
-    inputProps: {
-      step,
-      min,
-      max,
-      ...(schema.examples ? {
-        list: utils.examplesId(id)
-      } : undefined)
-    },
-    ...rest
-  };
-  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;
-  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    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,
-      value: value || value === 0 ? value : '',
-      error: rawErrors.length > 0,
-      onChange: onChangeOverride || _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      InputLabelProps: DisplayInputLabelProps,
-      ...textFieldProps,
-      "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
-    }), 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(example => {
-        return jsxRuntime.jsx("option", {
-          value: example
-        }, example);
-      })
-    })]
-  });
-}
-
-/** The `DescriptionField` is the template to use to render the description of a field
- *
- * @param props - The `DescriptionFieldProps` for this component
- */
-function DescriptionField(props) {
-  const {
-    id,
-    description
-  } = props;
-  if (description) {
-    return jsxRuntime.jsx(Typography__default["default"], {
-      id: id,
-      variant: 'subtitle2',
-      style: {
-        marginTop: '5px'
-      },
-      children: description
-    });
-  }
-  return null;
-}
-
-/** The `ErrorList` component is the template that renders the all the errors associated with the fields in the `Form`
- *
- * @param props - The `ErrorListProps` for this component
- */
-function ErrorList({
-  errors,
-  registry
-}) {
-  const {
-    translateString
-  } = registry;
-  return jsxRuntime.jsx(Paper__default["default"], {
-    elevation: 2,
-    children: jsxRuntime.jsxs(Box__default["default"], {
-      mb: 2,
-      p: 2,
-      children: [jsxRuntime.jsx(Typography__default["default"], {
-        variant: 'h6',
-        children: translateString(utils.TranslatableString.ErrorsLabel)
-      }), jsxRuntime.jsx(List__default["default"], {
-        dense: true,
-        children: errors.map((error, i) => {
-          return jsxRuntime.jsxs(ListItem__default["default"], {
-            children: [jsxRuntime.jsx(ListItemIcon__default["default"], {
-              children: jsxRuntime.jsx(ErrorIcon__default["default"], {
-                color: 'error'
-              })
-            }), jsxRuntime.jsx(ListItemText__default["default"], {
-              primary: error.stack
-            })]
-          }, i);
-        })
-      })]
-    })
-  });
-}
-
-function MuiIconButton(props) {
-  const {
-    icon,
-    color,
-    uiSchema,
-    registry,
-    ...otherProps
-  } = props;
-  return jsxRuntime.jsx(IconButton__default["default"], {
-    ...otherProps,
-    size: 'small',
-    color: color,
-    children: icon
-  });
-}
-function 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) {
-  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) {
-  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) {
-  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
- *
- * @param props - The `FieldErrorProps` for the errors being rendered
- */
-function FieldErrorTemplate(props) {
-  const {
-    errors = [],
-    idSchema
-  } = props;
-  if (errors.length === 0) {
-    return null;
-  }
-  const id = utils.errorId(idSchema);
-  return jsxRuntime.jsx(List__default["default"], {
-    dense: true,
-    disablePadding: true,
-    children: errors.map((error, i) => {
-      return jsxRuntime.jsx(ListItem__default["default"], {
-        disableGutters: true,
-        children: jsxRuntime.jsx(FormHelperText__default["default"], {
-          id: id,
-          children: error
-        })
-      }, i);
-    })
-  });
-}
-
-/** The `FieldHelpTemplate` component renders any help desired for a field
- *
- * @param props - The `FieldHelpProps` to be rendered
- */
-function FieldHelpTemplate(props) {
-  const {
-    idSchema,
-    help
-  } = props;
-  if (!help) {
-    return null;
-  }
-  const id = utils.helpId(idSchema);
-  return jsxRuntime.jsx(FormHelperText__default["default"], {
-    id: id,
-    children: help
-  });
-}
-
-/** The `FieldTemplate` component is the template used by `SchemaField` to render any field. It renders the field
- * content, (label, description, children, errors and help) inside of a `WrapIfAdditional` component.
- *
- * @param props - The `FieldTemplateProps` for this component
- */
-function FieldTemplate(props) {
-  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: {
-        display: 'none'
-      },
-      children: children
-    });
-  }
-  return jsxRuntime.jsx(WrapIfAdditionalTemplate, {
-    classNames: classNames,
-    style: style,
-    disabled: disabled,
-    id: id,
-    label: label,
-    onDropPropertyClick: onDropPropertyClick,
-    onKeyChange: onKeyChange,
-    readonly: readonly,
-    required: required,
-    schema: schema,
-    uiSchema: uiSchema,
-    registry: registry,
-    children: jsxRuntime.jsxs(FormControl__default["default"], {
-      fullWidth: true,
-      error: rawErrors.length ? true : false,
-      required: required,
-      children: [children, displayLabel && rawDescription ? jsxRuntime.jsx(Typography__default["default"], {
-        variant: 'caption',
-        color: 'textSecondary',
-        children: description
-      }) : null, errors, help]
-    })
-  });
-}
-
-/** The `ObjectFieldTemplate` is the template to use to render all the inner properties of an object along with the
- * title and description if available. If the object is expandable, then an `AddButton` is also rendered after all
- * the properties.
- *
- * @param props - The `ObjectFieldTemplateProps` for this component
- */
-function ObjectFieldTemplate(props) {
-  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
-  const {
-    ButtonTemplates: {
-      AddButton
-    }
-  } = registry.templates;
-  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [title && jsxRuntime.jsx(TitleFieldTemplate, {
-      id: utils.titleId(idSchema),
-      title: title,
-      required: required,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), description && jsxRuntime.jsx(DescriptionFieldTemplate, {
-      id: utils.descriptionId(idSchema),
-      description: description,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), jsxRuntime.jsxs(Grid__default["default"], {
-      container: true,
-      spacing: 2,
-      style: {
-        marginTop: '10px'
-      },
-      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"], {
-          item: true,
-          children: jsxRuntime.jsx(AddButton, {
-            className: 'object-property-expand',
-            onClick: onAddClick(schema),
-            disabled: disabled || readonly,
-            uiSchema: uiSchema,
-            registry: registry
-          })
-        })
-      })]
-    })]
-  });
-}
-
-/** The `SubmitButton` renders a button that represent the `Submit` action on a form
- */
-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"], {
-      type: 'submit',
-      variant: 'contained',
-      color: 'primary',
-      ...submitButtonProps,
-      children: submitText
-    })
-  });
-}
-
-/** The `TitleField` is the template to use to render the title of a field
- *
- * @param props - The `TitleFieldProps` for this component
- */
-function TitleField({
-  id,
-  title
-}) {
-  return jsxRuntime.jsxs(Box__default["default"], {
-    id: id,
-    mb: 1,
-    mt: 1,
-    children: [jsxRuntime.jsx(Typography__default["default"], {
-      variant: 'h5',
-      children: title
-    }), jsxRuntime.jsx(Divider__default["default"], {})]
-  });
-}
-
-/** The `WrapIfAdditional` component is used by the `FieldTemplate` to rename, or remove properties that are
- * part of an `additionalProperties` part of a schema.
- *
- * @param props - The `WrapIfAdditionalProps` for this component
- */
-function WrapIfAdditionalTemplate(props) {
-  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
-  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,
-    fontWeight: 'bold'
-  };
-  if (!additional) {
-    return jsxRuntime.jsx("div", {
-      className: classNames,
-      style: style,
-      children: children
-    });
-  }
-  const handleBlur = ({
-    target
-  }) => onKeyChange(target.value);
-  return jsxRuntime.jsxs(Grid__default["default"], {
-    container: true,
-    alignItems: 'center',
-    spacing: 2,
-    className: classNames,
-    style: style,
-    children: [jsxRuntime.jsx(Grid__default["default"], {
-      item: true,
-      xs: true,
-      children: jsxRuntime.jsx(TextField__default["default"], {
-        fullWidth: true,
-        required: required,
-        label: keyLabel,
-        defaultValue: label,
-        disabled: disabled || readonly,
-        id: `${id}-key`,
-        name: `${id}-key`,
-        onBlur: !readonly ? handleBlur : undefined,
-        type: 'text'
-      })
-    }), jsxRuntime.jsx(Grid__default["default"], {
-      item: true,
-      xs: true,
-      children: children
-    }), jsxRuntime.jsx(Grid__default["default"], {
-      item: true,
-      children: jsxRuntime.jsx(RemoveButton, {
-        iconType: 'default',
-        style: btnStyle,
-        disabled: disabled || readonly,
-        onClick: onDropPropertyClick(label),
-        uiSchema: uiSchema,
-        registry: registry
-      })
-    })]
-  }, `${id}-key`);
-}
-
-function generateTemplates() {
-  return {
-    ArrayFieldItemTemplate,
-    ArrayFieldTemplate,
-    BaseInputTemplate,
-    ButtonTemplates: {
-      AddButton,
-      CopyButton,
-      MoveDownButton,
-      MoveUpButton,
-      RemoveButton,
-      SubmitButton
-    },
-    DescriptionFieldTemplate: DescriptionField,
-    ErrorListTemplate: ErrorList,
-    FieldErrorTemplate,
-    FieldHelpTemplate,
-    FieldTemplate,
-    ObjectFieldTemplate,
-    TitleFieldTemplate: TitleField,
-    WrapIfAdditionalTemplate
-  };
-}
-var Templates = /*#__PURE__*/generateTemplates();
-
-/** The `CheckBoxWidget` is a widget for rendering boolean properties.
- *  It is typically used to represent a boolean.
- *
- * @param props - The `WidgetProps` for this component
- */
-function CheckboxWidget(props) {
-  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
-  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),
-      description: description,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), jsxRuntime.jsx(FormControlLabel__default["default"], {
-      control: jsxRuntime.jsx(Checkbox__default["default"], {
-        id: id,
-        name: id,
-        checked: typeof value === 'undefined' ? false : Boolean(value),
-        required: required,
-        disabled: disabled || readonly,
-        autoFocus: autofocus,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id)
-      }),
-      label: utils.labelValue(label, hideLabel, false)
-    })]
-  });
-}
-
-/** The `CheckboxesWidget` is a widget for rendering checkbox groups.
- *  It is typically used to represent an array of enums.
- *
- * @param props - The `WidgetProps` for this component
- */
-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,
-      htmlFor: id,
-      children: label || undefined
-    }), hideLabel), jsxRuntime.jsx(FormGroup__default["default"], {
-      id: id,
-      row: !!inline,
-      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,
-          disabled: disabled || itemDisabled || readonly,
-          autoFocus: autofocus && index === 0,
-          onChange: _onChange(index),
-          onBlur: _onBlur,
-          onFocus: _onFocus,
-          "aria-describedby": utils.ariaDescribedByIds(id)
-        });
-        return jsxRuntime.jsx(FormControlLabel__default["default"], {
-          control: checkbox,
-          label: option.label
-        }, index);
-      })
-    })]
-  });
-}
-
-/** The `RadioWidget` is a widget for rendering a radio group.
- *  It is typically used with a string property constrained with enum options.
- *
- * @param props - The `WidgetProps` for this component
- */
-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,
-      htmlFor: id,
-      children: label || undefined
-    }), hideLabel), jsxRuntime.jsx(RadioGroup__default["default"], {
-      id: id,
-      name: id,
-      value: selectedIndex,
-      row: row,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": utils.ariaDescribedByIds(id),
-      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),
-            color: 'primary'
-          }),
-          label: option.label,
-          value: String(index),
-          disabled: disabled || itemDisabled || readonly
-        }, index);
-        return radio;
-      })
-    })]
-  });
-}
-
-/** The `RangeWidget` component uses the `BaseInputTemplate` changing the type to `range` and wrapping the result
- * in a div, with the value along side it.
- *
- * @param props - The `WidgetProps` for this component
- */
-function RangeWidget(props) {
-  const {
-    value,
-    readonly,
-    disabled,
-    onBlur,
-    onFocus,
-    options,
-    schema,
-    onChange,
-    required,
-    label,
-    hideLabel,
-    id
-  } = props;
-  const sliderProps = {
-    value,
-    label,
-    id,
-    name: id,
-    ...utils.rangeSpec(schema)
-  };
-  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"], {
-      disabled: disabled || readonly,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      valueLabelDisplay: 'auto',
-      ...sliderProps,
-      "aria-describedby": utils.ariaDescribedByIds(id)
-    })]
-  });
-}
-
-/** 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({
-  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;
-  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),
-    value: isEmpty ? emptyValue : selectedIndexes,
-    required: required,
-    disabled: disabled || readonly,
-    autoFocus: autofocus,
-    placeholder: placeholder,
-    error: rawErrors.length > 0,
-    onChange: _onChange,
-    onBlur: _onBlur,
-    onFocus: _onFocus,
-    ...textFieldProps,
-    select // Apply this and the following props after the potential overrides defined in textFieldProps
-    : true,
-    InputLabelProps: {
-      ...textFieldProps.InputLabelProps,
-      shrink: !isEmpty
-    },
-    SelectProps: {
-      ...textFieldProps.SelectProps,
-      multiple
-    },
-    "aria-describedby": utils.ariaDescribedByIds(id),
-    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.
- *
- * @param props - The `WidgetProps` for this component
- */
-function TextareaWidget(props) {
-  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, {
-    ...props,
-    multiline: true,
-    rows: rows
-  });
-}
-
-function generateWidgets() {
-  return {
-    CheckboxWidget,
-    CheckboxesWidget,
-    RadioWidget,
-    RangeWidget,
-    SelectWidget,
-    TextareaWidget
-  };
-}
-var Widgets = /*#__PURE__*/generateWidgets();
-
-function generateTheme() {
-  return {
-    templates: generateTemplates(),
-    widgets: generateWidgets()
-  };
-}
-var Theme = /*#__PURE__*/generateTheme();
-
-function generateForm() {
-  return core.withTheme(generateTheme());
-}
-var MuiForm = /*#__PURE__*/generateForm();
-
-exports.Form = MuiForm;
-exports.Templates = Templates;
-exports.Theme = Theme;
-exports.Widgets = Widgets;
-exports["default"] = MuiForm;
-exports.generateForm = generateForm;
-exports.generateTemplates = generateTemplates;
-exports.generateTheme = generateTheme;
-exports.generateWidgets = generateWidgets;
-//# sourceMappingURL=mui.cjs.development.js.map