@rjsf/mui 5.0.0-beta.1

package/dist/mui.esm.js

@@ -0,0 +1,1016 @@
+import { withTheme } from '@rjsf/core';
+import React from 'react';
+import AddIcon from '@mui/icons-material/Add';
+import IconButton from '@mui/material/IconButton';
+import Box from '@mui/material/Box';
+import Grid from '@mui/material/Grid';
+import Paper from '@mui/material/Paper';
+import { getUiOptions, getTemplate, getInputProps, ADDITIONAL_PROPERTY_FLAG, canExpand, getSubmitButtonOptions, schemaRequiresTrueValue, utcToLocal, localToUTC, rangeSpec, processSelectValue } from '@rjsf/utils';
+import TextField from '@mui/material/TextField';
+import Typography from '@mui/material/Typography';
+import ErrorIcon from '@mui/icons-material/Error';
+import List from '@mui/material/List';
+import ListItem from '@mui/material/ListItem';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import ArrowDownwardIcon from '@mui/icons-material/ArrowDownward';
+import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
+import RemoveIcon from '@mui/icons-material/Remove';
+import FormControl from '@mui/material/FormControl';
+import FormHelperText from '@mui/material/FormHelperText';
+import InputLabel from '@mui/material/InputLabel';
+import Input from '@mui/material/OutlinedInput';
+import Button from '@mui/material/Button';
+import Divider from '@mui/material/Divider';
+import Checkbox from '@mui/material/Checkbox';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import FormGroup from '@mui/material/FormGroup';
+import FormLabel from '@mui/material/FormLabel';
+import Radio from '@mui/material/Radio';
+import RadioGroup from '@mui/material/RadioGroup';
+import Slider from '@mui/material/Slider';
+import MenuItem from '@mui/material/MenuItem';
+
+const AddButton = props => {
+  return /*#__PURE__*/React.createElement(IconButton, {
+    title: "Add Item",
+    ...props,
+    color: "primary"
+  }, /*#__PURE__*/React.createElement(AddIcon, null));
+};
+
+const ArrayFieldItemTemplate = props => {
+  const {
+    children,
+    disabled,
+    hasToolbar,
+    hasMoveDown,
+    hasMoveUp,
+    hasRemove,
+    index,
+    onDropIndexClick,
+    onReorderClick,
+    readonly,
+    registry
+  } = props;
+  const {
+    MoveDownButton,
+    MoveUpButton,
+    RemoveButton
+  } = registry.templates.ButtonTemplates;
+  const btnStyle = {
+    flex: 1,
+    paddingLeft: 6,
+    paddingRight: 6,
+    fontWeight: "bold",
+    minWidth: 0
+  };
+  return /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(Grid, {
+    item: true,
+    xs: true,
+    style: {
+      overflow: "auto"
+    }
+  }, /*#__PURE__*/React.createElement(Box, {
+    mb: 2
+  }, /*#__PURE__*/React.createElement(Paper, {
+    elevation: 2
+  }, /*#__PURE__*/React.createElement(Box, {
+    p: 2
+  }, children)))), hasToolbar && /*#__PURE__*/React.createElement(Grid, {
+    item: true
+  }, (hasMoveUp || hasMoveDown) && /*#__PURE__*/React.createElement(MoveUpButton, {
+    style: btnStyle,
+    disabled: disabled || readonly || !hasMoveUp,
+    onClick: onReorderClick(index, index - 1)
+  }), (hasMoveUp || hasMoveDown) && /*#__PURE__*/React.createElement(MoveDownButton, {
+    style: btnStyle,
+    disabled: disabled || readonly || !hasMoveDown,
+    onClick: onReorderClick(index, index + 1)
+  }), hasRemove && /*#__PURE__*/React.createElement(RemoveButton, {
+    style: btnStyle,
+    disabled: disabled || readonly,
+    onClick: onDropIndexClick(index)
+  })));
+};
+
+const ArrayFieldTemplate = props => {
+  const {
+    canAdd,
+    disabled,
+    idSchema,
+    uiSchema,
+    items,
+    onAddClick,
+    readonly,
+    registry,
+    required,
+    schema,
+    title
+  } = props;
+  const uiOptions = getUiOptions(uiSchema);
+  const ArrayFieldDescriptionTemplate = getTemplate("ArrayFieldDescriptionTemplate", registry, uiOptions);
+  const ArrayFieldItemTemplate = getTemplate("ArrayFieldItemTemplate", registry, uiOptions);
+  const ArrayFieldTitleTemplate = getTemplate("ArrayFieldTitleTemplate", registry, uiOptions); // Button templates are not overridden in the uiSchema
+
+  const {
+    ButtonTemplates: {
+      AddButton
+    }
+  } = registry.templates;
+  return /*#__PURE__*/React.createElement(Paper, {
+    elevation: 2
+  }, /*#__PURE__*/React.createElement(Box, {
+    p: 2
+  }, /*#__PURE__*/React.createElement(ArrayFieldTitleTemplate, {
+    idSchema: idSchema,
+    title: uiOptions.title || title,
+    uiSchema: uiSchema,
+    required: required,
+    registry: registry
+  }), (uiOptions.description || schema.description) && /*#__PURE__*/React.createElement(ArrayFieldDescriptionTemplate, {
+    idSchema: idSchema,
+    description: uiOptions.description || schema.description,
+    uiSchema: uiSchema,
+    registry: registry
+  }), /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    key: "array-item-list-" + idSchema.$id
+  }, items && items.map(_ref => {
+    let {
+      key,
+      ...itemProps
+    } = _ref;
+    return /*#__PURE__*/React.createElement(ArrayFieldItemTemplate, {
+      key: key,
+      ...itemProps
+    });
+  }), canAdd && /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    justifyContent: "flex-end"
+  }, /*#__PURE__*/React.createElement(Grid, {
+    item: true
+  }, /*#__PURE__*/React.createElement(Box, {
+    mt: 2
+  }, /*#__PURE__*/React.createElement(AddButton, {
+    className: "array-item-add",
+    onClick: onAddClick,
+    disabled: disabled || readonly
+  })))))));
+};
+
+const BaseInputTemplate = _ref => {
+  let {
+    id,
+    placeholder,
+    required,
+    readonly,
+    disabled,
+    type,
+    label,
+    value,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    schema,
+    uiSchema,
+    rawErrors = [],
+    formContext,
+    registry,
+    ...textFieldProps
+  } = _ref;
+  const inputProps = 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
+    },
+    ...rest
+  };
+
+  const _onChange = _ref2 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref2;
+    return onChange(value === "" ? options.emptyValue : value);
+  };
+
+  const _onBlur = _ref3 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref3;
+    return onBlur(id, value);
+  };
+
+  const _onFocus = _ref4 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref4;
+    return onFocus(id, value);
+  };
+
+  const {
+    schemaUtils
+  } = registry;
+  const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema);
+  return /*#__PURE__*/React.createElement(TextField, {
+    id: id,
+    placeholder: placeholder,
+    label: displayLabel ? label || schema.title : false,
+    autoFocus: autofocus,
+    required: required,
+    disabled: disabled || readonly,
+    ...otherProps,
+    value: value || value === 0 ? value : "",
+    error: rawErrors.length > 0,
+    onChange: _onChange,
+    onBlur: _onBlur,
+    onFocus: _onFocus,
+    ...textFieldProps
+  });
+};
+
+const DescriptionField = _ref => {
+  let {
+    description,
+    id
+  } = _ref;
+
+  if (description) {
+    return /*#__PURE__*/React.createElement(Typography, {
+      id: id,
+      variant: "subtitle2",
+      style: {
+        marginTop: "5px"
+      }
+    }, description);
+  }
+
+  return null;
+};
+
+const ErrorList = _ref => {
+  let {
+    errors
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Paper, {
+    elevation: 2
+  }, /*#__PURE__*/React.createElement(Box, {
+    mb: 2,
+    p: 2
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "h6"
+  }, "Errors"), /*#__PURE__*/React.createElement(List, {
+    dense: true
+  }, errors.map((error, i) => {
+    return /*#__PURE__*/React.createElement(ListItem, {
+      key: i
+    }, /*#__PURE__*/React.createElement(ListItemIcon, null, /*#__PURE__*/React.createElement(ErrorIcon, {
+      color: "error"
+    })), /*#__PURE__*/React.createElement(ListItemText, {
+      primary: error.stack
+    }));
+  }))));
+};
+
+function MuiIconButton(props) {
+  const {
+    icon,
+    color,
+    ...otherProps
+  } = props;
+  return /*#__PURE__*/React.createElement(IconButton, { ...otherProps,
+    size: "small",
+    color: color
+  }, icon);
+}
+function MoveDownButton(props) {
+  return /*#__PURE__*/React.createElement(MuiIconButton, {
+    title: "Move down",
+    ...props,
+    icon: /*#__PURE__*/React.createElement(ArrowDownwardIcon, {
+      fontSize: "small"
+    })
+  });
+}
+function MoveUpButton(props) {
+  return /*#__PURE__*/React.createElement(MuiIconButton, {
+    title: "Move up",
+    ...props,
+    icon: /*#__PURE__*/React.createElement(ArrowUpwardIcon, {
+      fontSize: "small"
+    })
+  });
+}
+function RemoveButton(props) {
+  const {
+    iconType,
+    ...otherProps
+  } = props;
+  return /*#__PURE__*/React.createElement(MuiIconButton, {
+    title: "Remove",
+    ...otherProps,
+    color: "error",
+    icon: /*#__PURE__*/React.createElement(RemoveIcon, {
+      fontSize: iconType === "default" ? undefined : "small"
+    })
+  });
+}
+
+const WrapIfAdditional = _ref => {
+  let {
+    children,
+    classNames,
+    disabled,
+    id,
+    label,
+    onDropPropertyClick,
+    onKeyChange,
+    readonly,
+    required,
+    schema,
+    registry
+  } = _ref;
+  const {
+    RemoveButton
+  } = registry.templates.ButtonTemplates;
+  const keyLabel = label + " Key"; // i18n ?
+
+  const additional = (ADDITIONAL_PROPERTY_FLAG in schema);
+  const btnStyle = {
+    flex: 1,
+    paddingLeft: 6,
+    paddingRight: 6,
+    fontWeight: "bold"
+  };
+
+  if (!additional) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNames
+    }, children);
+  }
+
+  const handleBlur = _ref2 => {
+    let {
+      target
+    } = _ref2;
+    return onKeyChange(target.value);
+  };
+
+  return /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    key: id + "-key",
+    alignItems: "center",
+    spacing: 2,
+    className: classNames
+  }, /*#__PURE__*/React.createElement(Grid, {
+    item: true,
+    xs: true
+  }, /*#__PURE__*/React.createElement(FormControl, {
+    fullWidth: true,
+    required: required
+  }, /*#__PURE__*/React.createElement(InputLabel, null, keyLabel), /*#__PURE__*/React.createElement(Input, {
+    defaultValue: label,
+    disabled: disabled || readonly,
+    id: id + "-key",
+    name: id + "-key",
+    onBlur: !readonly ? handleBlur : undefined,
+    type: "text"
+  }))), /*#__PURE__*/React.createElement(Grid, {
+    item: true,
+    xs: true
+  }, children), /*#__PURE__*/React.createElement(Grid, {
+    item: true
+  }, /*#__PURE__*/React.createElement(RemoveButton, {
+    iconType: "default",
+    style: btnStyle,
+    disabled: disabled || readonly,
+    onClick: onDropPropertyClick(label)
+  })));
+};
+
+const FieldTemplate = _ref => {
+  let {
+    id,
+    children,
+    classNames,
+    disabled,
+    displayLabel,
+    hidden,
+    label,
+    onDropPropertyClick,
+    onKeyChange,
+    readonly,
+    required,
+    rawErrors = [],
+    rawHelp,
+    rawDescription,
+    schema,
+    registry
+  } = _ref;
+
+  if (hidden) {
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: "none"
+      }
+    }, children);
+  }
+
+  return /*#__PURE__*/React.createElement(WrapIfAdditional, {
+    classNames: classNames,
+    disabled: disabled,
+    id: id,
+    label: label,
+    onDropPropertyClick: onDropPropertyClick,
+    onKeyChange: onKeyChange,
+    readonly: readonly,
+    required: required,
+    schema: schema,
+    registry: registry
+  }, /*#__PURE__*/React.createElement(FormControl, {
+    fullWidth: true,
+    error: rawErrors.length ? true : false,
+    required: required
+  }, children, displayLabel && rawDescription ? /*#__PURE__*/React.createElement(Typography, {
+    variant: "caption",
+    color: "textSecondary"
+  }, rawDescription) : null, rawErrors.length > 0 && /*#__PURE__*/React.createElement(List, {
+    dense: true,
+    disablePadding: true
+  }, rawErrors.map((error, i) => {
+    return /*#__PURE__*/React.createElement(ListItem, {
+      key: i,
+      disableGutters: true
+    }, /*#__PURE__*/React.createElement(FormHelperText, {
+      id: id
+    }, error));
+  })), rawHelp && /*#__PURE__*/React.createElement(FormHelperText, {
+    id: id
+  }, rawHelp)));
+};
+
+const ObjectFieldTemplate = _ref => {
+  let {
+    description,
+    title,
+    properties,
+    required,
+    disabled,
+    readonly,
+    uiSchema,
+    idSchema,
+    schema,
+    formData,
+    onAddClick,
+    registry
+  } = _ref;
+  const uiOptions = getUiOptions(uiSchema);
+  const TitleFieldTemplate = getTemplate("TitleFieldTemplate", registry, uiOptions);
+  const DescriptionFieldTemplate = getTemplate("DescriptionFieldTemplate", registry, uiOptions); // Button templates are not overridden in the uiSchema
+
+  const {
+    ButtonTemplates: {
+      AddButton
+    }
+  } = registry.templates;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, (uiOptions.title || title) && /*#__PURE__*/React.createElement(TitleFieldTemplate, {
+    id: idSchema.$id + "-title",
+    title: title,
+    required: required,
+    uiSchema: uiSchema,
+    registry: registry
+  }), (uiOptions.description || description) && /*#__PURE__*/React.createElement(DescriptionFieldTemplate, {
+    id: idSchema.$id + "-description",
+    description: uiOptions.description || description,
+    registry: registry
+  }), /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    spacing: 2,
+    style: {
+      marginTop: "10px"
+    }
+  }, 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 : /*#__PURE__*/React.createElement(Grid, {
+    item: true,
+    xs: 12,
+    key: index,
+    style: {
+      marginBottom: "10px"
+    }
+  }, element.content)), canExpand(schema, uiSchema, formData) && /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    justifyContent: "flex-end"
+  }, /*#__PURE__*/React.createElement(Grid, {
+    item: true
+  }, /*#__PURE__*/React.createElement(AddButton, {
+    className: "object-property-expand",
+    onClick: onAddClick(schema),
+    disabled: disabled || readonly
+  })))));
+};
+
+const SubmitButton = props => {
+  const {
+    submitText,
+    norender,
+    props: submitButtonProps
+  } = getSubmitButtonOptions(props.uiSchema);
+
+  if (norender) {
+    return null;
+  }
+
+  return /*#__PURE__*/React.createElement(Box, {
+    marginTop: 3
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "submit",
+    variant: "contained",
+    color: "primary",
+    ...submitButtonProps
+  }, submitText));
+};
+
+const TitleField = _ref => {
+  let {
+    id,
+    title
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Box, {
+    id: id,
+    mb: 1,
+    mt: 1
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "h5"
+  }, title), /*#__PURE__*/React.createElement(Divider, null));
+};
+
+var Templates = {
+  ArrayFieldItemTemplate,
+  ArrayFieldTemplate,
+  BaseInputTemplate,
+  ButtonTemplates: {
+    AddButton,
+    MoveDownButton,
+    MoveUpButton,
+    RemoveButton,
+    SubmitButton
+  },
+  DescriptionFieldTemplate: DescriptionField,
+  ErrorListTemplate: ErrorList,
+  FieldTemplate,
+  ObjectFieldTemplate,
+  TitleFieldTemplate: TitleField
+};
+
+const CheckboxWidget = props => {
+  const {
+    schema,
+    id,
+    value,
+    disabled,
+    readonly,
+    label,
+    autofocus,
+    onChange,
+    onBlur,
+    onFocus
+  } = props; // 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 = schemaRequiresTrueValue(schema);
+
+  const _onChange = (_, checked) => onChange(checked);
+
+  const _onBlur = _ref => {
+    let {
+      target: {
+        value
+      }
+    } = _ref;
+    return onBlur(id, value);
+  };
+
+  const _onFocus = _ref2 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref2;
+    return onFocus(id, value);
+  };
+
+  return /*#__PURE__*/React.createElement(FormControlLabel, {
+    control: /*#__PURE__*/React.createElement(Checkbox, {
+      id: id,
+      checked: typeof value === "undefined" ? false : Boolean(value),
+      required: required,
+      disabled: disabled || readonly,
+      autoFocus: autofocus,
+      onChange: _onChange,
+      onBlur: _onBlur,
+      onFocus: _onFocus
+    }),
+    label: label || ""
+  });
+};
+
+const selectValue = (value, selected, all) => {
+  const at = all.indexOf(value);
+  const updated = selected.slice(0, at).concat(value, selected.slice(at)); // As inserting values at predefined index positions doesn't work with empty
+  // arrays, we need to reorder the updated selection to match the initial order
+
+  return updated.sort((a, b) => all.indexOf(a) > all.indexOf(b));
+};
+
+const deselectValue = (value, selected) => {
+  return selected.filter(v => v !== value);
+};
+
+const CheckboxesWidget = _ref => {
+  let {
+    schema,
+    label,
+    id,
+    disabled,
+    options,
+    value,
+    autofocus,
+    readonly,
+    required,
+    onChange,
+    onBlur,
+    onFocus
+  } = _ref;
+  const {
+    enumOptions,
+    enumDisabled,
+    inline
+  } = options;
+
+  const _onChange = option => _ref2 => {
+    let {
+      target: {
+        checked
+      }
+    } = _ref2;
+    const all = enumOptions.map(_ref3 => {
+      let {
+        value
+      } = _ref3;
+      return value;
+    });
+
+    if (checked) {
+      onChange(selectValue(option.value, value, all));
+    } else {
+      onChange(deselectValue(option.value, value));
+    }
+  };
+
+  const _onBlur = _ref4 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref4;
+    return onBlur(id, value);
+  };
+
+  const _onFocus = _ref5 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref5;
+    return onFocus(id, value);
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormLabel, {
+    required: required,
+    htmlFor: id
+  }, label || schema.title), /*#__PURE__*/React.createElement(FormGroup, {
+    id: id,
+    row: !!inline
+  }, enumOptions.map((option, index) => {
+    const checked = value.indexOf(option.value) !== -1;
+    const itemDisabled = enumDisabled && enumDisabled.indexOf(option.value) != -1;
+    const checkbox = /*#__PURE__*/React.createElement(Checkbox, {
+      id: id + "_" + index,
+      checked: checked,
+      disabled: disabled || itemDisabled || readonly,
+      autoFocus: autofocus && index === 0,
+      onChange: _onChange(option),
+      onBlur: _onBlur,
+      onFocus: _onFocus
+    });
+    return /*#__PURE__*/React.createElement(FormControlLabel, {
+      control: checkbox,
+      key: index,
+      label: option.label
+    });
+  })));
+};
+
+const DateWidget = props => {
+  const {
+    options,
+    registry
+  } = props;
+  const BaseInputTemplate = getTemplate("BaseInputTemplate", registry, options);
+  return /*#__PURE__*/React.createElement(BaseInputTemplate, {
+    type: "date",
+    InputLabelProps: {
+      shrink: true
+    },
+    ...props
+  });
+};
+
+const DateTimeWidget = props => {
+  const {
+    options,
+    registry
+  } = props;
+  const BaseInputTemplate = getTemplate("BaseInputTemplate", registry, options);
+  const value = utcToLocal(props.value);
+
+  const onChange = value => {
+    props.onChange(localToUTC(value));
+  };
+
+  return /*#__PURE__*/React.createElement(BaseInputTemplate, {
+    type: "datetime-local",
+    InputLabelProps: {
+      shrink: true
+    },
+    ...props,
+    value: value,
+    onChange: onChange
+  });
+};
+
+const RadioWidget = _ref => {
+  let {
+    id,
+    schema,
+    options,
+    value,
+    required,
+    disabled,
+    readonly,
+    label,
+    onChange,
+    onBlur,
+    onFocus
+  } = _ref;
+  const {
+    enumOptions,
+    enumDisabled
+  } = options;
+
+  const _onChange = (_, value) => onChange(schema.type == "boolean" ? value !== "false" : value);
+
+  const _onBlur = _ref2 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref2;
+    return onBlur(id, value);
+  };
+
+  const _onFocus = _ref3 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref3;
+    return onFocus(id, value);
+  };
+
+  const row = options ? options.inline : false;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormLabel, {
+    required: required,
+    htmlFor: id
+  }, label || schema.title), /*#__PURE__*/React.createElement(RadioGroup, {
+    id: id,
+    value: "" + value,
+    row: row,
+    onChange: _onChange,
+    onBlur: _onBlur,
+    onFocus: _onFocus
+  }, enumOptions.map((option, i) => {
+    const itemDisabled = enumDisabled && enumDisabled.indexOf(option.value) != -1;
+    const radio = /*#__PURE__*/React.createElement(FormControlLabel, {
+      control: /*#__PURE__*/React.createElement(Radio, {
+        name: id + "-" + i,
+        color: "primary",
+        key: i
+      }),
+      label: "" + option.label,
+      value: "" + option.value,
+      key: i,
+      disabled: disabled || itemDisabled || readonly
+    });
+    return radio;
+  })));
+};
+
+const RangeWidget = _ref => {
+  let {
+    value,
+    readonly,
+    disabled,
+    onBlur,
+    onFocus,
+    options,
+    schema,
+    onChange,
+    required,
+    label,
+    id
+  } = _ref;
+  const sliderProps = {
+    value,
+    label,
+    id,
+    ...rangeSpec(schema)
+  };
+
+  const _onChange = (_, value) => {
+    onChange(value ? options.emptyValue : value);
+  };
+
+  const _onBlur = _ref2 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref2;
+    return onBlur(id, value);
+  };
+
+  const _onFocus = _ref3 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref3;
+    return onFocus(id, value);
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormLabel, {
+    required: required,
+    id: id
+  }, label), /*#__PURE__*/React.createElement(Slider, {
+    disabled: disabled || readonly,
+    onChange: _onChange,
+    onBlur: _onBlur,
+    onFocus: _onFocus,
+    valueLabelDisplay: "auto",
+    ...sliderProps
+  }));
+};
+
+const SelectWidget = _ref => {
+  let {
+    schema,
+    id,
+    options,
+    label,
+    required,
+    disabled,
+    readonly,
+    value,
+    multiple,
+    autofocus,
+    onChange,
+    onBlur,
+    onFocus,
+    rawErrors = []
+  } = _ref;
+  const {
+    enumOptions,
+    enumDisabled
+  } = options;
+  const emptyValue = multiple ? [] : "";
+
+  const _onChange = _ref2 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref2;
+    return onChange(processSelectValue(schema, value, options));
+  };
+
+  const _onBlur = _ref3 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref3;
+    return onBlur(id, processSelectValue(schema, value, options));
+  };
+
+  const _onFocus = _ref4 => {
+    let {
+      target: {
+        value
+      }
+    } = _ref4;
+    return onFocus(id, processSelectValue(schema, value, options));
+  };
+
+  return /*#__PURE__*/React.createElement(TextField, {
+    id: id,
+    label: label || schema.title,
+    select: true,
+    value: typeof value === "undefined" ? emptyValue : value,
+    required: required,
+    disabled: disabled || readonly,
+    autoFocus: autofocus,
+    error: rawErrors.length > 0,
+    onChange: _onChange,
+    onBlur: _onBlur,
+    onFocus: _onFocus,
+    InputLabelProps: {
+      shrink: true
+    },
+    SelectProps: {
+      multiple: typeof multiple === "undefined" ? false : multiple
+    }
+  }, enumOptions.map((_ref5, i) => {
+    let {
+      value,
+      label
+    } = _ref5;
+    const disabled = enumDisabled && enumDisabled.indexOf(value) != -1;
+    return /*#__PURE__*/React.createElement(MenuItem, {
+      key: i,
+      value: value,
+      disabled: disabled
+    }, label);
+  }));
+};
+
+const TextareaWidget = props => {
+  const {
+    options,
+    registry
+  } = props;
+  const BaseInputTemplate = getTemplate("BaseInputTemplate", registry, options);
+  let rows = 5;
+
+  if (typeof options.rows === "string" || typeof options.rows === "number") {
+    rows = options.rows;
+  }
+
+  return /*#__PURE__*/React.createElement(BaseInputTemplate, { ...props,
+    multiline: true,
+    rows: rows
+  });
+};
+
+var Widgets = {
+  CheckboxWidget,
+  CheckboxesWidget,
+  DateWidget,
+  DateTimeWidget,
+  RadioWidget,
+  RangeWidget,
+  SelectWidget,
+  TextareaWidget
+};
+
+const Theme = {
+  templates: Templates,
+  widgets: Widgets
+};
+
+const MuiForm = /*#__PURE__*/withTheme(Theme);
+
+export { MuiForm as Form, Templates, Theme, Widgets, MuiForm as default };
+//# sourceMappingURL=mui.esm.js.map