@jsonforms/material-renderers 3.1.0-alpha.1 → 3.1.0-alpha.3

package/lib/jsonforms-react-material.cjs.js

@@ -2,14 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var core = require('@jsonforms/core');
 var React = require('react');
+var material = require('@mui/material');
+var core = require('@jsonforms/core');
 var react = require('@jsonforms/react');
+var omit = require('lodash/omit');
 var isEmpty = require('lodash/isEmpty');
 var union = require('lodash/union');
 var startCase = require('lodash/startCase');
 var range = require('lodash/range');
-var material = require('@mui/material');
 var DeleteIcon = require('@mui/icons-material/Delete');
 var ArrowDownward = require('@mui/icons-material/ArrowDownward');
 var ArrowUpward = require('@mui/icons-material/ArrowUpward');
@@ -17,7 +18,6 @@ var styles$1 = require('@mui/material/styles');
 var AddIcon = require('@mui/icons-material/Add');
 var ErrorOutlineIcon = require('@mui/icons-material/ErrorOutline');
 var merge = require('lodash/merge');
-var omit = require('lodash/omit');
 var dayjs = require('dayjs');
 var customParsing = require('dayjs/plugin/customParseFormat');
 var debounce = require('lodash/debounce');
@@ -32,6 +32,7 @@ var Input = require('@mui/material/Input');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var omit__default = /*#__PURE__*/_interopDefaultLegacy(omit);
 var isEmpty__default = /*#__PURE__*/_interopDefaultLegacy(isEmpty);
 var union__default = /*#__PURE__*/_interopDefaultLegacy(union);
 var startCase__default = /*#__PURE__*/_interopDefaultLegacy(startCase);
@@ -42,7 +43,6 @@ var ArrowUpward__default = /*#__PURE__*/_interopDefaultLegacy(ArrowUpward);
 var AddIcon__default = /*#__PURE__*/_interopDefaultLegacy(AddIcon);
 var ErrorOutlineIcon__default = /*#__PURE__*/_interopDefaultLegacy(ErrorOutlineIcon);
 var merge__default = /*#__PURE__*/_interopDefaultLegacy(merge);
-var omit__default = /*#__PURE__*/_interopDefaultLegacy(omit);
 var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
 var customParsing__default = /*#__PURE__*/_interopDefaultLegacy(customParsing);
 var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
@@ -106,8 +106,58 @@ function __rest(s, e) {
     return t;
 }
 
+var MaterialAllOfRenderer = function (_a) {
+    var schema = _a.schema, rootSchema = _a.rootSchema, visible = _a.visible, renderers = _a.renderers, cells = _a.cells, path = _a.path, uischemas = _a.uischemas, uischema = _a.uischema;
+    var delegateUISchema = core.findMatchingUISchema(uischemas)(schema, uischema.scope, path);
+    if (delegateUISchema) {
+        return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+            React__default["default"].createElement(react.JsonFormsDispatch, { schema: schema, uischema: delegateUISchema, path: path, renderers: renderers, cells: cells })));
+    }
+    var allOfRenderInfos = core.createCombinatorRenderInfos(schema.allOf, rootSchema, 'allOf', uischema, path, uischemas);
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible }, allOfRenderInfos.map(function (allOfRenderInfo, allOfIndex) { return (React__default["default"].createElement(react.JsonFormsDispatch, { key: allOfIndex, schema: allOfRenderInfo.schema, uischema: allOfRenderInfo.uischema, path: path, renderers: renderers, cells: cells })); })));
+};
+var materialAllOfControlTester = core.rankWith(3, core.isAllOfControl);
+var MaterialAllOfRenderer$1 = react.withJsonFormsAllOfProps(MaterialAllOfRenderer);
+
+var CombinatorProperties =  (function (_super) {
+    __extends(CombinatorProperties, _super);
+    function CombinatorProperties() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    CombinatorProperties.prototype.render = function () {
+        var _a = this.props, schema = _a.schema, combinatorKeyword = _a.combinatorKeyword, path = _a.path;
+        var otherProps = omit__default["default"](schema, combinatorKeyword);
+        var foundUISchema = core.Generate.uiSchema(otherProps, 'VerticalLayout');
+        var isLayoutWithElements = false;
+        if (foundUISchema !== null && core.isLayout(foundUISchema)) {
+            isLayoutWithElements = foundUISchema.elements.length > 0;
+        }
+        if (isLayoutWithElements) {
+            return (React__default["default"].createElement(react.JsonFormsDispatch, { schema: otherProps, path: path, uischema: foundUISchema }));
+        }
+        return null;
+    };
+    return CombinatorProperties;
+}(React__default["default"].Component));
+
+var MaterialAnyOfRenderer = function (_a) {
+    var schema = _a.schema, rootSchema = _a.rootSchema, indexOfFittingSchema = _a.indexOfFittingSchema, visible = _a.visible, path = _a.path, renderers = _a.renderers, cells = _a.cells, uischema = _a.uischema, uischemas = _a.uischemas;
+    var _b = React.useState(indexOfFittingSchema || 0), selectedAnyOf = _b[0], setSelectedAnyOf = _b[1];
+    var handleChange = React.useCallback(function (_ev, value) { return setSelectedAnyOf(value); }, [setSelectedAnyOf]);
+    var anyOf = 'anyOf';
+    var anyOfRenderInfos = core.createCombinatorRenderInfos(schema.anyOf, rootSchema, anyOf, uischema, path, uischemas);
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+        React__default["default"].createElement(CombinatorProperties, { schema: schema, combinatorKeyword: anyOf, path: path }),
+        React__default["default"].createElement(material.Tabs, { value: selectedAnyOf, onChange: handleChange }, anyOfRenderInfos.map(function (anyOfRenderInfo) { return (React__default["default"].createElement(material.Tab, { key: anyOfRenderInfo.label, label: anyOfRenderInfo.label })); })),
+        anyOfRenderInfos.map(function (anyOfRenderInfo, anyOfIndex) {
+            return selectedAnyOf === anyOfIndex && (React__default["default"].createElement(react.JsonFormsDispatch, { key: anyOfIndex, schema: anyOfRenderInfo.schema, uischema: anyOfRenderInfo.uischema, path: path, renderers: renderers, cells: cells }));
+        })));
+};
+var materialAnyOfControlTester = core.rankWith(3, core.isAnyOfControl);
+var MaterialAnyOfRenderer$1 = react.withJsonFormsAnyOfProps(MaterialAnyOfRenderer);
+
 var StyledTableCell = styles$1.styled(material.TableCell)({
-    borderBottom: 'none'
+    borderBottom: 'none',
 });
 var NoBorderTableCell = function (_a) {
     var children = _a.children, otherProps = __rest(_a, ["children"]);
@@ -117,7 +167,7 @@ var NoBorderTableCell = function (_a) {
 var StyledBadge = material.styled(material.Badge)(function (_a) {
     var theme = _a.theme;
     return ({
-        color: theme.palette.error.main
+        color: theme.palette.error.main,
     });
 });
 var ValidationIcon = function (_a) {
@@ -131,19 +181,18 @@ var fixedCellSmall = {
     paddingLeft: 0,
     paddingRight: 0,
 };
-var TableToolbar = React__default["default"].memo(function (_a) {
-    var numColumns = _a.numColumns, errors = _a.errors, label = _a.label, path = _a.path, addItem = _a.addItem, schema = _a.schema, enabled = _a.enabled;
+var TableToolbar = React__default["default"].memo(function TableToolbar(_a) {
+    var numColumns = _a.numColumns, errors = _a.errors, label = _a.label, path = _a.path, addItem = _a.addItem, schema = _a.schema, enabled = _a.enabled, translations = _a.translations;
     return (React__default["default"].createElement(material.TableRow, null,
         React__default["default"].createElement(NoBorderTableCell, { colSpan: numColumns },
             React__default["default"].createElement(material.Grid, { container: true, justifyContent: 'flex-start', alignItems: 'center', spacing: 2 },
                 React__default["default"].createElement(material.Grid, { item: true },
                     React__default["default"].createElement(material.Typography, { variant: 'h6' }, label)),
-                React__default["default"].createElement(material.Grid, { item: true }, errors.length !== 0 &&
-                    React__default["default"].createElement(material.Grid, { item: true },
-                        React__default["default"].createElement(ValidationIcon, { id: 'tooltip-validation', errorMessages: errors }))))),
+                React__default["default"].createElement(material.Grid, { item: true }, errors.length !== 0 && (React__default["default"].createElement(material.Grid, { item: true },
+                    React__default["default"].createElement(ValidationIcon, { id: 'tooltip-validation', errorMessages: errors })))))),
         enabled ? (React__default["default"].createElement(NoBorderTableCell, { align: 'right', style: fixedCellSmall },
-            React__default["default"].createElement(material.Tooltip, { id: 'tooltip-add', title: "Add to " + label, placement: 'bottom' },
-                React__default["default"].createElement(material.IconButton, { "aria-label": "Add to " + label, onClick: addItem(path, core.createDefaultValue(schema)), size: 'large' },
+            React__default["default"].createElement(material.Tooltip, { id: 'tooltip-add', title: translations.addTooltip, placement: 'bottom' },
+                React__default["default"].createElement(material.IconButton, { "aria-label": translations.addAriaLabel, onClick: addItem(path, core.createDefaultValue(schema)), size: 'large' },
                     React__default["default"].createElement(AddIcon__default["default"], null))))) : null));
 });
 
@@ -153,15 +202,15 @@ var styles = {
         height: '50px',
         paddingLeft: 0,
         paddingRight: 0,
-        textAlign: 'center'
+        textAlign: 'center',
     },
     fixedCellSmall: {
         width: '50px',
         height: '50px',
         paddingLeft: 0,
         paddingRight: 0,
-        textAlign: 'center'
-    }
+        textAlign: 'center',
+    },
 };
 var generateCells = function (Cell, schema, rowPath, enabled, cells) {
     if (schema.type === 'object') {
@@ -175,7 +224,7 @@ var generateCells = function (Cell, schema, rowPath, enabled, cells) {
                 rowPath: rowPath,
                 cellPath: cellPath,
                 enabled: enabled,
-                cells: cells
+                cells: cells,
             };
             return React__default["default"].createElement(Cell, __assign({ key: cellPath }, props));
         });
@@ -185,26 +234,27 @@ var generateCells = function (Cell, schema, rowPath, enabled, cells) {
             schema: schema,
             rowPath: rowPath,
             cellPath: rowPath,
-            enabled: enabled
+            enabled: enabled,
         };
         return React__default["default"].createElement(Cell, __assign({ key: rowPath }, props));
     }
 };
 var getValidColumnProps = function (scopedSchema) {
-    if (scopedSchema.type === 'object' && typeof scopedSchema.properties === 'object') {
+    if (scopedSchema.type === 'object' &&
+        typeof scopedSchema.properties === 'object') {
         return Object.keys(scopedSchema.properties).filter(function (prop) { return scopedSchema.properties[prop].type !== 'array'; });
     }
     return [''];
 };
 var EmptyTable = function (_a) {
-    var numColumns = _a.numColumns;
+    var numColumns = _a.numColumns, translations = _a.translations;
     return (React__default["default"].createElement(material.TableRow, null,
         React__default["default"].createElement(NoBorderTableCell, { colSpan: numColumns },
-            React__default["default"].createElement(material.Typography, { align: 'center' }, "No data"))));
+            React__default["default"].createElement(material.Typography, { align: 'center' }, translations.noDataMessage))));
 };
-var TableHeaderCell = React__default["default"].memo(function (_a) {
+var TableHeaderCell = React__default["default"].memo(function TableHeaderCell(_a) {
     var title = _a.title;
-    return (React__default["default"].createElement(material.TableCell, null, title));
+    return React__default["default"].createElement(material.TableCell, null, title);
 });
 var ctxToNonEmptyCellProps = function (ctx, ownProps) {
     var path = ownProps.rowPath +
@@ -219,15 +269,15 @@ var ctxToNonEmptyCellProps = function (ctx, ownProps) {
         path: path,
         enabled: ownProps.enabled,
         cells: ownProps.cells || ctx.cells,
-        renderers: ownProps.renderers || ctx.renderers
+        renderers: ownProps.renderers || ctx.renderers,
     };
 };
 var controlWithoutLabel = function (scope) { return ({
     type: 'Control',
     scope: scope,
-    label: false
+    label: false,
 }); };
-var NonEmptyCellComponent = React__default["default"].memo(function (_a) {
+var NonEmptyCellComponent = React__default["default"].memo(function NonEmptyCellComponent(_a) {
     var path = _a.path, propName = _a.propName, schema = _a.schema, rootSchema = _a.rootSchema, errors = _a.errors, enabled = _a.enabled, renderers = _a.renderers, cells = _a.cells, isValid = _a.isValid;
     return (React__default["default"].createElement(NoBorderTableCell, null,
         schema.properties ? (React__default["default"].createElement(react.DispatchCell, { schema: core.Resolve.schema(schema, "#/properties/" + core.encode(propName), rootSchema), uischema: controlWithoutLabel("#/properties/" + core.encode(propName)), path: path, enabled: enabled, renderers: renderers, cells: cells })) : (React__default["default"].createElement(react.DispatchCell, { schema: schema, uischema: controlWithoutLabel('#'), path: path, enabled: enabled, renderers: renderers, cells: cells })),
@@ -240,7 +290,7 @@ var NonEmptyCell = function (ownProps) {
     return React__default["default"].createElement(NonEmptyCellComponent, __assign({}, emptyCellProps, { isValid: isValid }));
 };
 var NonEmptyRowComponent = function (_a) {
-    var childPath = _a.childPath, schema = _a.schema, rowIndex = _a.rowIndex, openDeleteDialog = _a.openDeleteDialog, moveUpCreator = _a.moveUpCreator, moveDownCreator = _a.moveDownCreator, enableUp = _a.enableUp, enableDown = _a.enableDown, showSortButtons = _a.showSortButtons, enabled = _a.enabled, cells = _a.cells, path = _a.path;
+    var childPath = _a.childPath, schema = _a.schema, rowIndex = _a.rowIndex, openDeleteDialog = _a.openDeleteDialog, moveUpCreator = _a.moveUpCreator, moveDownCreator = _a.moveDownCreator, enableUp = _a.enableUp, enableDown = _a.enableDown, showSortButtons = _a.showSortButtons, enabled = _a.enabled, cells = _a.cells, path = _a.path, translations = _a.translations;
     var moveUp = React.useMemo(function () { return moveUpCreator(path, rowIndex); }, [moveUpCreator, path, rowIndex]);
     var moveDown = React.useMemo(function () { return moveDownCreator(path, rowIndex); }, [moveDownCreator, path, rowIndex]);
     return (React__default["default"].createElement(material.TableRow, { key: childPath, hover: true },
@@ -249,26 +299,27 @@ var NonEmptyRowComponent = function (_a) {
             React__default["default"].createElement(material.Grid, { container: true, direction: 'row', justifyContent: 'flex-end', alignItems: 'center' },
                 showSortButtons ? (React__default["default"].createElement(React.Fragment, null,
                     React__default["default"].createElement(material.Grid, { item: true },
-                        React__default["default"].createElement(material.IconButton, { "aria-label": "Move up", onClick: moveUp, disabled: !enableUp, size: 'large' },
+                        React__default["default"].createElement(material.IconButton, { "aria-label": translations.upAriaLabel, onClick: moveUp, disabled: !enableUp, size: 'large' },
                             React__default["default"].createElement(ArrowUpward__default["default"], null))),
                     React__default["default"].createElement(material.Grid, { item: true },
-                        React__default["default"].createElement(material.IconButton, { "aria-label": "Move down", onClick: moveDown, disabled: !enableDown, size: 'large' },
+                        React__default["default"].createElement(material.IconButton, { "aria-label": translations.downAriaLabel, onClick: moveDown, disabled: !enableDown, size: 'large' },
                             React__default["default"].createElement(ArrowDownward__default["default"], null))))) : null,
                 React__default["default"].createElement(material.Grid, { item: true },
-                    React__default["default"].createElement(material.IconButton, { "aria-label": "Delete", onClick: function () { return openDeleteDialog(childPath, rowIndex); }, size: 'large' },
+                    React__default["default"].createElement(material.IconButton, { "aria-label": translations.removeAriaLabel, onClick: function () { return openDeleteDialog(childPath, rowIndex); }, size: 'large' },
                         React__default["default"].createElement(DeleteIcon__default["default"], null)))))) : null));
 };
 var NonEmptyRow = React__default["default"].memo(NonEmptyRowComponent);
 var TableRows = function (_a) {
-    var data = _a.data, path = _a.path, schema = _a.schema, openDeleteDialog = _a.openDeleteDialog, moveUp = _a.moveUp, moveDown = _a.moveDown, uischema = _a.uischema, config = _a.config, enabled = _a.enabled, cells = _a.cells;
+    var data = _a.data, path = _a.path, schema = _a.schema, openDeleteDialog = _a.openDeleteDialog, moveUp = _a.moveUp, moveDown = _a.moveDown, uischema = _a.uischema, config = _a.config, enabled = _a.enabled, cells = _a.cells, translations = _a.translations;
     var isEmptyTable = data === 0;
     if (isEmptyTable) {
-        return React__default["default"].createElement(EmptyTable, { numColumns: getValidColumnProps(schema).length + 1 });
+        return (React__default["default"].createElement(EmptyTable, { numColumns: getValidColumnProps(schema).length + 1, translations: translations }));
     }
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     return (React__default["default"].createElement(React__default["default"].Fragment, null, range__default["default"](data).map(function (index) {
         var childPath = core.Paths.compose(path, "" + index);
-        return (React__default["default"].createElement(NonEmptyRow, { key: childPath, childPath: childPath, rowIndex: index, schema: schema, openDeleteDialog: openDeleteDialog, moveUpCreator: moveUp, moveDownCreator: moveDown, enableUp: index !== 0, enableDown: index !== data - 1, showSortButtons: appliedUiSchemaOptions.showSortButtons || appliedUiSchemaOptions.showArrayTableSortButtons, enabled: enabled, cells: cells, path: path }));
+        return (React__default["default"].createElement(NonEmptyRow, { key: childPath, childPath: childPath, rowIndex: index, schema: schema, openDeleteDialog: openDeleteDialog, moveUpCreator: moveUp, moveDownCreator: moveDown, enableUp: index !== 0, enableDown: index !== data - 1, showSortButtons: appliedUiSchemaOptions.showSortButtons ||
+                appliedUiSchemaOptions.showArrayTableSortButtons, enabled: enabled, cells: cells, path: path, translations: translations }));
     })));
 };
 var MaterialTableControl =  (function (_super) {
@@ -279,7 +330,7 @@ var MaterialTableControl =  (function (_super) {
         return _this;
     }
     MaterialTableControl.prototype.render = function () {
-        var _a = this.props, label = _a.label, path = _a.path, schema = _a.schema, rootSchema = _a.rootSchema, uischema = _a.uischema, errors = _a.errors, openDeleteDialog = _a.openDeleteDialog, visible = _a.visible, enabled = _a.enabled, cells = _a.cells;
+        var _a = this.props, label = _a.label, path = _a.path, schema = _a.schema, rootSchema = _a.rootSchema, uischema = _a.uischema, errors = _a.errors, openDeleteDialog = _a.openDeleteDialog, visible = _a.visible, enabled = _a.enabled, cells = _a.cells, translations = _a.translations;
         var controlElement = uischema;
         var isObjectSchema = schema.type === 'object';
         var headerCells = isObjectSchema
@@ -288,25 +339,25 @@ var MaterialTableControl =  (function (_super) {
         return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
             React__default["default"].createElement(material.Table, null,
                 React__default["default"].createElement(material.TableHead, null,
-                    React__default["default"].createElement(TableToolbar, { errors: errors, label: label, addItem: this.addItem, numColumns: isObjectSchema ? headerCells.length : 1, path: path, uischema: controlElement, schema: schema, rootSchema: rootSchema, enabled: enabled }),
+                    React__default["default"].createElement(TableToolbar, { errors: errors, label: label, addItem: this.addItem, numColumns: isObjectSchema ? headerCells.length : 1, path: path, uischema: controlElement, schema: schema, rootSchema: rootSchema, enabled: enabled, translations: translations }),
                     isObjectSchema && (React__default["default"].createElement(material.TableRow, null,
                         headerCells,
                         enabled ? React__default["default"].createElement(material.TableCell, null) : null))),
                 React__default["default"].createElement(material.TableBody, null,
-                    React__default["default"].createElement(TableRows, __assign({ openDeleteDialog: openDeleteDialog }, this.props))))));
+                    React__default["default"].createElement(TableRows, __assign({ openDeleteDialog: openDeleteDialog, translations: translations }, this.props))))));
     };
     return MaterialTableControl;
 }(React__default["default"].Component));
 
-var DeleteDialog = React__default["default"].memo(function (_a) {
-    var open = _a.open, onClose = _a.onClose, onConfirm = _a.onConfirm, onCancel = _a.onCancel;
+var DeleteDialog = React__default["default"].memo(function DeleteDialog(_a) {
+    var open = _a.open, onClose = _a.onClose, onConfirm = _a.onConfirm, onCancel = _a.onCancel, title = _a.title, message = _a.message, acceptText = _a.acceptText, declineText = _a.declineText;
     return (React__default["default"].createElement(material.Dialog, { open: open, keepMounted: true, onClose: onClose, "aria-labelledby": 'alert-dialog-confirmdelete-title', "aria-describedby": 'alert-dialog-confirmdelete-description' },
-        React__default["default"].createElement(material.DialogTitle, { id: 'alert-dialog-confirmdelete-title' }, 'Confirm Deletion'),
+        React__default["default"].createElement(material.DialogTitle, { id: 'alert-dialog-confirmdelete-title' }, title),
         React__default["default"].createElement(material.DialogContent, null,
-            React__default["default"].createElement(material.DialogContentText, { id: 'alert-dialog-confirmdelete-description' }, "Are you sure you want to delete the selected entry?")),
+            React__default["default"].createElement(material.DialogContentText, { id: 'alert-dialog-confirmdelete-description' }, message)),
         React__default["default"].createElement(material.DialogActions, null,
-            React__default["default"].createElement(material.Button, { onClick: onCancel, color: 'primary' }, "No"),
-            React__default["default"].createElement(material.Button, { onClick: onConfirm, color: 'primary' }, "Yes"))));
+            React__default["default"].createElement(material.Button, { onClick: onCancel, color: 'primary' }, declineText),
+            React__default["default"].createElement(material.Button, { onClick: onConfirm, color: 'primary' }, acceptText))));
 });
 
 var MaterialArrayControlRenderer = function (props) {
@@ -321,142 +372,72 @@ var MaterialArrayControlRenderer = function (props) {
     }, [setOpen, setPath, setRowData]);
     var deleteCancel = React.useCallback(function () { return setOpen(false); }, [setOpen]);
     var deleteConfirm = React.useCallback(function () {
-        var p = path.substring(0, path.lastIndexOf(('.')));
+        var p = path.substring(0, path.lastIndexOf('.'));
         removeItems(p, [rowData])();
         setOpen(false);
     }, [setOpen, path, rowData]);
     var deleteClose = React.useCallback(function () { return setOpen(false); }, [setOpen]);
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
         React__default["default"].createElement(MaterialTableControl, __assign({}, props, { openDeleteDialog: openDeleteDialog })),
-        React__default["default"].createElement(DeleteDialog, { open: open, onCancel: deleteCancel, onConfirm: deleteConfirm, onClose: deleteClose })));
+        React__default["default"].createElement(DeleteDialog, { open: open, onCancel: deleteCancel, onConfirm: deleteConfirm, onClose: deleteClose, acceptText: props.translations.deleteDialogAccept, declineText: props.translations.deleteDialogDecline, title: props.translations.deleteDialogTitle, message: props.translations.deleteDialogMessage })));
 };
+var materialArrayControlTester = core.rankWith(3, core.or(core.isObjectArrayControl, core.isPrimitiveArrayControl));
 var MaterialArrayControlRenderer$1 = react.withJsonFormsArrayLayoutProps(MaterialArrayControlRenderer);
 
-var MaterialObjectRenderer = function (_a) {
-    var renderers = _a.renderers, cells = _a.cells, uischemas = _a.uischemas, schema = _a.schema, label = _a.label, path = _a.path, visible = _a.visible, enabled = _a.enabled, uischema = _a.uischema, rootSchema = _a.rootSchema;
-    var detailUiSchema = React.useMemo(function () {
-        return core.findUISchema(uischemas, schema, uischema.scope, path, function () { return isEmpty__default["default"](path) ? core.Generate.uiSchema(schema, 'VerticalLayout') : __assign(__assign({}, core.Generate.uiSchema(schema, 'Group')), { label: label }); }, uischema, rootSchema);
-    }, [uischemas, schema, uischema.scope, path, label, uischema, rootSchema]);
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(react.JsonFormsDispatch, { visible: visible, enabled: enabled, schema: schema, uischema: detailUiSchema, path: path, renderers: renderers, cells: cells })));
-};
-var materialObjectControlTester = core.rankWith(2, core.isObjectControl);
-var MaterialObjectRenderer$1 = react.withJsonFormsDetailProps(MaterialObjectRenderer);
-
-var MaterialAllOfRenderer = function (_a) {
-    var schema = _a.schema, rootSchema = _a.rootSchema, visible = _a.visible, renderers = _a.renderers, cells = _a.cells, path = _a.path, uischemas = _a.uischemas, uischema = _a.uischema;
-    var delegateUISchema = core.findMatchingUISchema(uischemas)(schema, uischema.scope, path);
-    if (delegateUISchema) {
-        return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-            React__default["default"].createElement(react.JsonFormsDispatch, { schema: schema, uischema: delegateUISchema, path: path, renderers: renderers, cells: cells })));
-    }
-    var allOfRenderInfos = core.createCombinatorRenderInfos(schema.allOf, rootSchema, 'allOf', uischema, path, uischemas);
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible }, allOfRenderInfos.map(function (allOfRenderInfo, allOfIndex) { return (React__default["default"].createElement(react.JsonFormsDispatch, { key: allOfIndex, schema: allOfRenderInfo.schema, uischema: allOfRenderInfo.uischema, path: path, renderers: renderers, cells: cells })); })));
-};
-var materialAllOfControlTester = core.rankWith(3, core.isAllOfControl);
-var MaterialAllOfRenderer$1 = react.withJsonFormsAllOfProps(MaterialAllOfRenderer);
-
-var isLayout = function (uischema) {
-    return uischema.hasOwnProperty('elements');
-};
-var CombinatorProperties =  (function (_super) {
-    __extends(CombinatorProperties, _super);
-    function CombinatorProperties() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CombinatorProperties.prototype.render = function () {
-        var _a = this.props, schema = _a.schema, combinatorKeyword = _a.combinatorKeyword, path = _a.path;
-        var otherProps = omit__default["default"](schema, combinatorKeyword);
-        var foundUISchema = core.Generate.uiSchema(otherProps, 'VerticalLayout');
-        var isLayoutWithElements = false;
-        if (foundUISchema !== null && isLayout(foundUISchema)) {
-            isLayoutWithElements = foundUISchema.elements.length > 0;
-        }
-        if (isLayoutWithElements) {
-            return (React__default["default"].createElement(react.JsonFormsDispatch, { schema: otherProps, path: path, uischema: foundUISchema }));
-        }
-        return null;
-    };
-    return CombinatorProperties;
-}(React__default["default"].Component));
-
-var MaterialAnyOfRenderer = function (_a) {
-    var schema = _a.schema, rootSchema = _a.rootSchema, indexOfFittingSchema = _a.indexOfFittingSchema, visible = _a.visible, path = _a.path, renderers = _a.renderers, cells = _a.cells, uischema = _a.uischema, uischemas = _a.uischemas;
-    var _b = React.useState(indexOfFittingSchema || 0), selectedAnyOf = _b[0], setSelectedAnyOf = _b[1];
-    var handleChange = React.useCallback(function (_ev, value) { return setSelectedAnyOf(value); }, [setSelectedAnyOf]);
-    var anyOf = 'anyOf';
-    var anyOfRenderInfos = core.createCombinatorRenderInfos(schema.anyOf, rootSchema, anyOf, uischema, path, uischemas);
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(CombinatorProperties, { schema: schema, combinatorKeyword: anyOf, path: path }),
-        React__default["default"].createElement(material.Tabs, { value: selectedAnyOf, onChange: handleChange }, anyOfRenderInfos.map(function (anyOfRenderInfo) { return (React__default["default"].createElement(material.Tab, { key: anyOfRenderInfo.label, label: anyOfRenderInfo.label })); })),
-        anyOfRenderInfos.map(function (anyOfRenderInfo, anyOfIndex) {
-            return selectedAnyOf === anyOfIndex && (React__default["default"].createElement(react.JsonFormsDispatch, { key: anyOfIndex, schema: anyOfRenderInfo.schema, uischema: anyOfRenderInfo.uischema, path: path, renderers: renderers, cells: cells }));
-        })));
+var useFocus = function () {
+    var _a = React.useState(false), focused = _a[0], setFocused = _a[1];
+    var onFocus = React.useCallback(function () { return setFocused(true); }, []);
+    var onBlur = React.useCallback(function () { return setFocused(false); }, []);
+    return [focused, onFocus, onBlur];
 };
-var materialAnyOfControlTester = core.rankWith(3, core.isAnyOfControl);
-var MaterialAnyOfRenderer$1 = react.withJsonFormsAnyOfProps(MaterialAnyOfRenderer);
 
-var MaterialOneOfRenderer = function (_a) {
-    var handleChange = _a.handleChange, schema = _a.schema, path = _a.path, renderers = _a.renderers, cells = _a.cells, rootSchema = _a.rootSchema, id = _a.id, visible = _a.visible, indexOfFittingSchema = _a.indexOfFittingSchema, uischema = _a.uischema, uischemas = _a.uischemas, data = _a.data;
-    var _b = React.useState(false), open = _b[0], setOpen = _b[1];
-    var _c = React.useState(indexOfFittingSchema || 0), selectedIndex = _c[0], setSelectedIndex = _c[1];
-    var _d = React.useState(0), newSelectedIndex = _d[0], setNewSelectedIndex = _d[1];
-    var handleClose = React.useCallback(function () { return setOpen(false); }, [setOpen]);
-    var cancel = React.useCallback(function () {
-        setOpen(false);
-    }, [setOpen]);
-    var oneOfRenderInfos = core.createCombinatorRenderInfos(schema.oneOf, rootSchema, 'oneOf', uischema, path, uischemas);
-    var openNewTab = function (newIndex) {
-        handleChange(path, core.createDefaultValue(oneOfRenderInfos[newIndex].schema));
-        setSelectedIndex(newIndex);
-    };
-    var confirm = React.useCallback(function () {
-        openNewTab(newSelectedIndex);
-        setOpen(false);
-    }, [handleChange, core.createDefaultValue, newSelectedIndex]);
-    var handleTabChange = React.useCallback(function (_event, newOneOfIndex) {
-        setNewSelectedIndex(newOneOfIndex);
-        if (isEmpty__default["default"](data)) {
-            openNewTab(newOneOfIndex);
-        }
-        else {
-            setOpen(true);
-        }
-    }, [setOpen, setSelectedIndex, data]);
+var MuiAutocomplete = function (props) {
+    var _a;
+    var description = props.description, errors = props.errors, visible = props.visible, required = props.required, label = props.label, data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, options = props.options, config = props.config, getOptionLabel = props.getOptionLabel, renderOption = props.renderOption, filterOptions = props.filterOptions, isValid = props.isValid;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
+    var _b = React__default["default"].useState(data !== null && data !== void 0 ? data : ''), inputValue = _b[0], setInputValue = _b[1];
+    var _c = useFocus(), focused = _c[0], onFocus = _c[1], onBlur = _c[2];
+    var findOption = (_a = options.find(function (o) { return o.value === data; })) !== null && _a !== void 0 ? _a : null;
+    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
+    var firstFormHelperText = showDescription
+        ? description
+        : !isValid
+            ? errors
+            : null;
+    var secondFormHelperText = showDescription && !isValid ? errors : null;
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(CombinatorProperties, { schema: schema, combinatorKeyword: 'oneOf', path: path }),
-        React__default["default"].createElement(material.Tabs, { value: selectedIndex, onChange: handleTabChange }, oneOfRenderInfos.map(function (oneOfRenderInfo) { return React__default["default"].createElement(material.Tab, { key: oneOfRenderInfo.label, label: oneOfRenderInfo.label }); })),
-        oneOfRenderInfos.map(function (oneOfRenderInfo, oneOfIndex) { return (selectedIndex === oneOfIndex && (React__default["default"].createElement(react.JsonFormsDispatch, { key: oneOfIndex, schema: oneOfRenderInfo.schema, uischema: oneOfRenderInfo.uischema, path: path, renderers: renderers, cells: cells }))); }),
-        React__default["default"].createElement(material.Dialog, { open: open, onClose: handleClose, "aria-labelledby": 'alert-dialog-title', "aria-describedby": 'alert-dialog-description' },
-            React__default["default"].createElement(material.DialogTitle, { id: 'alert-dialog-title' }, 'Clear form?'),
-            React__default["default"].createElement(material.DialogContent, null,
-                React__default["default"].createElement(material.DialogContentText, { id: 'alert-dialog-description' }, "Your data will be cleared if you navigate away from this tab. Do you want to proceed?")),
-            React__default["default"].createElement(material.DialogActions, null,
-                React__default["default"].createElement(material.Button, { onClick: cancel, color: 'primary' }, "No"),
-                React__default["default"].createElement(material.Button, { onClick: confirm, color: 'primary', autoFocus: true, id: "oneOf-" + id + "-confirm-yes" }, "Yes")))));
+        React__default["default"].createElement(material.Autocomplete, { className: className, id: id, disabled: !enabled, value: findOption, onChange: function (_event, newValue) {
+                handleChange(path, newValue === null || newValue === void 0 ? void 0 : newValue.value);
+            }, inputValue: inputValue, onInputChange: function (_event, newInputValue) {
+                setInputValue(newInputValue);
+            }, autoHighlight: true, autoSelect: true, autoComplete: true, fullWidth: true, options: options, getOptionLabel: getOptionLabel || (function (option) { return option === null || option === void 0 ? void 0 : option.label; }), freeSolo: false, renderInput: function (params) {
+                return (React__default["default"].createElement(material.TextField, __assign({ label: label, variant: 'standard', type: 'text', inputProps: params.inputProps, inputRef: params.InputProps.ref, autoFocus: appliedUiSchemaOptions.focus, disabled: !enabled }, params, { id: id + '-input', required: required && !appliedUiSchemaOptions.hideRequiredAsterisk, error: !isValid, fullWidth: !appliedUiSchemaOptions.trim, InputLabelProps: data ? { shrink: true } : undefined, onFocus: onFocus, onBlur: onBlur, focused: focused })));
+            }, renderOption: renderOption, filterOptions: filterOptions }),
+        React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
+        React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText)));
 };
-var materialOneOfControlTester = core.rankWith(3, core.isOneOfControl);
-var MaterialOneOfRenderer$1 = react.withJsonFormsOneOfProps(MaterialOneOfRenderer);
 
-var MuiCheckbox = React__default["default"].memo(function (props) {
+var MuiCheckbox = React__default["default"].memo(function MuiCheckbox(props) {
     var data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, config = props.config, inputProps = props.inputProps;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var inputPropsMerged = merge__default["default"]({}, inputProps, {
-        autoFocus: !!appliedUiSchemaOptions.focus
+        autoFocus: !!appliedUiSchemaOptions.focus,
     });
     var checked = !!data;
     return (React__default["default"].createElement(material.Checkbox, { checked: checked, onChange: function (_ev, isChecked) { return handleChange(path, isChecked); }, className: className, id: id, disabled: !enabled, inputProps: inputPropsMerged }));
 });
 
 dayjs__default["default"].extend(customParsing__default["default"]);
-var createOnChangeHandler = function (path, handleChange, saveFormat) { return function (time, textInputValue) {
-    if (!time) {
-        handleChange(path, undefined);
-        return;
-    }
-    var result = dayjs__default["default"](time).format(saveFormat);
-    handleChange(path, result === 'Invalid Date' ? textInputValue : result);
-}; };
+var createOnChangeHandler = function (path, handleChange, saveFormat) {
+    return function (time, textInputValue) {
+        if (!time) {
+            handleChange(path, undefined);
+            return;
+        }
+        var result = dayjs__default["default"](time).format(saveFormat);
+        handleChange(path, result === 'Invalid Date' ? textInputValue : result);
+    };
+};
 var getData = function (data, saveFormat) {
     if (!data) {
         return null;
@@ -469,10 +450,18 @@ var getData = function (data, saveFormat) {
 };
 var ResettableTextField = function (_a) {
     var rawValue = _a.rawValue, dayjsValueIsValid = _a.dayjsValueIsValid, valueInInputFormat = _a.valueInInputFormat, focused = _a.focused, inputProps = _a.inputProps, props = __rest(_a, ["rawValue", "dayjsValueIsValid", "valueInInputFormat", "focused", "inputProps"]);
-    var value = React.useRef({ lastInput: inputProps === null || inputProps === void 0 ? void 0 : inputProps.value, toShow: inputProps === null || inputProps === void 0 ? void 0 : inputProps.value });
+    var value = React.useRef({
+        lastInput: inputProps === null || inputProps === void 0 ? void 0 : inputProps.value,
+        toShow: inputProps === null || inputProps === void 0 ? void 0 : inputProps.value,
+    });
     if (!focused) {
         if (!dayjsValueIsValid) {
-            value.current.toShow = typeof rawValue === 'string' || rawValue === null || rawValue === undefined ? rawValue : JSON.stringify(rawValue);
+            value.current.toShow =
+                typeof rawValue === 'string' ||
+                    rawValue === null ||
+                    rawValue === undefined
+                    ? rawValue
+                    : JSON.stringify(rawValue);
         }
         else {
             value.current.toShow = valueInInputFormat;
@@ -482,7 +471,7 @@ var ResettableTextField = function (_a) {
         value.current.lastInput = inputProps === null || inputProps === void 0 ? void 0 : inputProps.value;
         value.current.toShow = inputProps === null || inputProps === void 0 ? void 0 : inputProps.value;
     }
-    return React__default["default"].createElement(material.TextField, __assign({}, props, { inputProps: __assign(__assign({}, inputProps), { value: value.current.toShow || '' }) }));
+    return (React__default["default"].createElement(material.TextField, __assign({}, props, { inputProps: __assign(__assign({}, inputProps), { value: value.current.toShow || '' }) })));
 };
 
 var renderLayoutElements = function (elements, schema, path, enabled, renderers, cells) {
@@ -501,10 +490,10 @@ var MaterialLayoutRendererComponent = function (_a) {
 };
 var MaterialLayoutRenderer = React__default["default"].memo(MaterialLayoutRendererComponent);
 var withAjvProps = function (Component) {
-    return function (props) {
+    return function WithAjvProps(props) {
         var ctx = react.useJsonForms();
         var ajv = core.getAjv({ jsonforms: __assign({}, ctx) });
-        return (React__default["default"].createElement(Component, __assign({}, props, { ajv: ajv })));
+        return React__default["default"].createElement(Component, __assign({}, props, { ajv: ajv }));
     };
 };
 
@@ -522,34 +511,22 @@ var useDebouncedChange = function (handleChange, defaultValue, data, path, event
         setInput(newValue !== null && newValue !== void 0 ? newValue : defaultValue);
         debouncedUpdate(newValue);
     }, [debouncedUpdate, eventToValueFunction]);
-    var onClear = React.useCallback(function () { setInput(defaultValue); handleChange(path, undefined); }, [defaultValue, handleChange, path]);
+    var onClear = React.useCallback(function () {
+        setInput(defaultValue);
+        handleChange(path, undefined);
+    }, [defaultValue, handleChange, path]);
     return [input, onChange, onClear];
 };
 
-var useFocus = function () {
-    var _a = React.useState(false), focused = _a[0], setFocused = _a[1];
-    var onFocus = React.useCallback(function () { return setFocused(true); }, []);
-    var onBlur = React.useCallback(function () { return setFocused(false); }, []);
-    return [focused, onFocus, onBlur];
-};
-
 var i18nDefaults = {
-    'enum.none': 'None'
+    'enum.none': 'None',
 };
 
-var MuiSelect = React__default["default"].memo(function (props) {
-    var data = props.data, className = props.className, id = props.id, enabled = props.enabled, schema = props.schema, uischema = props.uischema, path = props.path, handleChange = props.handleChange, options = props.options, config = props.config, t = props.t;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
-    var noneOptionLabel = React.useMemo(function () { return t('enum.none', i18nDefaults['enum.none'], { schema: schema, uischema: uischema, path: path }); }, [t, schema, uischema, path]);
-    return (React__default["default"].createElement(material.Select, { className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, value: data !== undefined ? data : '', onChange: function (ev) { return handleChange(path, ev.target.value || undefined); }, fullWidth: true, variant: 'standard' }, [React__default["default"].createElement(material.MenuItem, { value: '', key: 'jsonforms.enum.none' },
-            React__default["default"].createElement("em", null, noneOptionLabel))].concat(options.map(function (optionValue) { return (React__default["default"].createElement(material.MenuItem, { value: optionValue.value, key: optionValue.value }, optionValue.label)); }))));
-});
-
 var toNumber$1 = function (value) {
     return value === '' ? undefined : parseInt(value, 10);
 };
 var eventToValue$2 = function (ev) { return toNumber$1(ev.target.value); };
-var MuiInputInteger = React__default["default"].memo(function (props) {
+var MuiInputInteger = React__default["default"].memo(function MuiInputInteger(props) {
     var data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, config = props.config;
     var inputProps = { step: '1' };
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
@@ -561,7 +538,7 @@ var toNumber = function (value) {
     return value === '' ? undefined : parseFloat(value);
 };
 var eventToValue$1 = function (ev) { return toNumber(ev.target.value); };
-var MuiInputNumber = React__default["default"].memo(function (props) {
+var MuiInputNumber = React__default["default"].memo(function MuiInputNumber(props) {
     var data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, config = props.config;
     var inputProps = { step: '0.1' };
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
@@ -569,7 +546,7 @@ var MuiInputNumber = React__default["default"].memo(function (props) {
     return (React__default["default"].createElement(material.Input, { type: 'number', value: inputValue, onChange: onChange, className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, inputProps: inputProps, fullWidth: true }));
 });
 
-var MuiInputNumberFormat = React__default["default"].memo(function (props) {
+var MuiInputNumberFormat = React__default["default"].memo(function MuiInputNumberFormat(props) {
     var className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, isValid = props.isValid, path = props.path, handleChange = props.handleChange, schema = props.schema, config = props.config;
     var maxLength = schema.maxLength;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
@@ -586,8 +563,10 @@ var MuiInputNumberFormat = React__default["default"].memo(function (props) {
     return (React__default["default"].createElement(material.Input, { type: 'text', value: inputValue, onChange: onChange, className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, multiline: appliedUiSchemaOptions.multi, fullWidth: !appliedUiSchemaOptions.trim || maxLength === undefined, inputProps: inputProps, error: !isValid }));
 });
 
-var eventToValue = function (ev) { return ev.target.value === '' ? undefined : ev.target.value; };
-var MuiInputText = React__default["default"].memo(function (props) {
+var eventToValue = function (ev) {
+    return ev.target.value === '' ? undefined : ev.target.value;
+};
+var MuiInputText = React__default["default"].memo(function MuiInputText(props) {
     var _a, _b, _c;
     var _d = React.useState(false), showAdornment = _d[0], setShowAdornment = _d[1];
     var data = props.data, config = props.config, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, isValid = props.isValid, path = props.path, handleChange = props.handleChange, schema = props.schema, muiInputProps = props.muiInputProps, inputComponent = props.inputComponent;
@@ -609,25 +588,48 @@ var MuiInputText = React__default["default"].memo(function (props) {
     var onPointerLeave = function () { return setShowAdornment(false); };
     var theme = material.useTheme();
     var closeStyle = {
-        background: ((_c = (_b = (_a = theme.jsonforms) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.delete) === null || _c === void 0 ? void 0 : _c.background) || theme.palette.background.default,
-        borderRadius: '50%'
+        background: ((_c = (_b = (_a = theme.jsonforms) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.delete) === null || _c === void 0 ? void 0 : _c.background) ||
+            theme.palette.background.default,
+        borderRadius: '50%',
     };
     return (React__default["default"].createElement(material.Input, { type: appliedUiSchemaOptions.format === 'password' ? 'password' : 'text', value: inputText, onChange: onChange, className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, multiline: appliedUiSchemaOptions.multi, fullWidth: !appliedUiSchemaOptions.trim || maxLength === undefined, inputProps: inputProps, error: !isValid, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, endAdornment: React__default["default"].createElement(material.InputAdornment, { position: 'end', style: {
-                display: !showAdornment || !enabled || data === undefined ? 'none' : 'flex',
+                display: !showAdornment || !enabled || data === undefined
+                    ? 'none'
+                    : 'flex',
                 position: 'absolute',
-                right: 0
+                right: 0,
             } },
             React__default["default"].createElement(material.IconButton, { "aria-label": 'Clear input field', onClick: onClear, size: 'large' },
                 React__default["default"].createElement(Close__default["default"], { style: closeStyle }))), inputComponent: inputComponent }));
 });
 
-var MuiInputTime = React__default["default"].memo(function (props) {
+var MuiInputTime = React__default["default"].memo(function MuiInputTime(props) {
     var data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, config = props.config;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var _a = useDebouncedChange(handleChange, '', data, path), inputValue = _a[0], onChange = _a[1];
     return (React__default["default"].createElement(material.Input, { type: 'time', value: inputValue, onChange: onChange, className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, fullWidth: true }));
 });
 
+var MuiSelect = React__default["default"].memo(function MuiSelect(props) {
+    var data = props.data, className = props.className, id = props.id, enabled = props.enabled, schema = props.schema, uischema = props.uischema, path = props.path, handleChange = props.handleChange, options = props.options, config = props.config, t = props.t;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
+    var noneOptionLabel = React.useMemo(function () { return t('enum.none', i18nDefaults['enum.none'], { schema: schema, uischema: uischema, path: path }); }, [t, schema, uischema, path]);
+    return (React__default["default"].createElement(material.Select, { className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, value: data !== undefined ? data : '', onChange: function (ev) { return handleChange(path, ev.target.value || undefined); }, fullWidth: true, variant: 'standard' }, [
+        React__default["default"].createElement(material.MenuItem, { value: '', key: 'jsonforms.enum.none' },
+            React__default["default"].createElement("em", null, noneOptionLabel)),
+    ].concat(options.map(function (optionValue) { return (React__default["default"].createElement(material.MenuItem, { value: optionValue.value, key: optionValue.value }, optionValue.label)); }))));
+});
+
+var MuiToggle = React__default["default"].memo(function MuiToggle(props) {
+    var data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, config = props.config, inputProps = props.inputProps;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
+    var inputPropsMerged = merge__default["default"]({}, inputProps, {
+        autoFocus: !!appliedUiSchemaOptions.focus,
+    });
+    var checked = !!data;
+    return (React__default["default"].createElement(material.Switch, { checked: checked, onChange: function (_ev, isChecked) { return handleChange(path, isChecked); }, className: className, id: id, disabled: !enabled, inputProps: inputPropsMerged }));
+});
+
 var MaterialEnumArrayRenderer = function (_a) {
     var schema = _a.schema, visible = _a.visible, errors = _a.errors, path = _a.path, options = _a.options, data = _a.data, addItem = _a.addItem, removeItem = _a.removeItem; _a.handleChange; var otherProps = __rest(_a, ["schema", "visible", "errors", "path", "options", "data", "addItem", "removeItem", "handleChange"]);
     return (React__default["default"].createElement(material.Hidden, { xlUp: !visible },
@@ -664,50 +666,106 @@ var materialEnumArrayRendererTester = core.rankWith(5, core.and(core.uiTypeIs('C
 }))));
 var MaterialEnumArrayRenderer$1 = react.withJsonFormsMultiEnumProps(MaterialEnumArrayRenderer);
 
-var materialArrayControlTester = core.rankWith(3, core.or(core.isObjectArrayControl, core.isPrimitiveArrayControl));
-
-var materialLabelRendererTester = core.rankWith(1, core.uiTypeIs('Label'));
-var MaterialLabelRenderer = function (_a) {
-    var text = _a.text, visible = _a.visible;
+var MaterialObjectRenderer = function (_a) {
+    var renderers = _a.renderers, cells = _a.cells, uischemas = _a.uischemas, schema = _a.schema, label = _a.label, path = _a.path, visible = _a.visible, enabled = _a.enabled, uischema = _a.uischema, rootSchema = _a.rootSchema;
+    var detailUiSchema = React.useMemo(function () {
+        return core.findUISchema(uischemas, schema, uischema.scope, path, function () {
+            return isEmpty__default["default"](path)
+                ? core.Generate.uiSchema(schema, 'VerticalLayout')
+                : __assign(__assign({}, core.Generate.uiSchema(schema, 'Group')), { label: label });
+        }, uischema, rootSchema);
+    }, [uischemas, schema, uischema.scope, path, label, uischema, rootSchema]);
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.Typography, { variant: 'h6' }, text)));
-};
-var MaterialLabelRenderer$1 = react.withJsonFormsLabelProps(MaterialLabelRenderer);
-
-var ArrayLayoutToolbar = React__default["default"].memo(function (_a) {
-    var label = _a.label, errors = _a.errors, addItem = _a.addItem, path = _a.path, createDefault = _a.createDefault;
-    return (React__default["default"].createElement(material.Toolbar, { disableGutters: true },
-        React__default["default"].createElement(material.Grid, { container: true, alignItems: 'center', justifyContent: 'space-between' },
-            React__default["default"].createElement(material.Grid, { item: true },
-                React__default["default"].createElement(material.Typography, { variant: 'h6' }, label)),
-            errors.length !== 0 &&
-                React__default["default"].createElement(material.Grid, { item: true },
-                    React__default["default"].createElement(ValidationIcon, { id: 'tooltip-validation', errorMessages: errors })),
-            React__default["default"].createElement(material.Grid, { item: true },
-                React__default["default"].createElement(material.Grid, { container: true },
-                    React__default["default"].createElement(material.Grid, { item: true },
-                        React__default["default"].createElement(material.Tooltip, { id: 'tooltip-add', title: "Add to " + label, placement: 'bottom' },
-                            React__default["default"].createElement(material.IconButton, { "aria-label": "Add to " + label, onClick: addItem(path, createDefault()), size: 'large' },
-                                React__default["default"].createElement(AddIcon__default["default"], null)))))))));
-});
-
-var ListWithDetailMasterItem = function (_a) {
-    var index = _a.index, childLabel = _a.childLabel, selected = _a.selected, handleSelect = _a.handleSelect, removeItem = _a.removeItem, path = _a.path;
-    return (React__default["default"].createElement(material.ListItem, { button: true, selected: selected, onClick: handleSelect(index) },
-        React__default["default"].createElement(material.ListItemAvatar, null,
-            React__default["default"].createElement(material.Avatar, { "aria-label": 'Index' }, index + 1)),
-        React__default["default"].createElement(material.ListItemText, { primary: childLabel }),
-        React__default["default"].createElement(material.ListItemSecondaryAction, null,
-            React__default["default"].createElement(material.IconButton, { "aria-label": 'Delete', onClick: removeItem(path, index), size: 'large' },
-                React__default["default"].createElement(DeleteIcon__default["default"], null)))));
+        React__default["default"].createElement(react.JsonFormsDispatch, { visible: visible, enabled: enabled, schema: schema, uischema: detailUiSchema, path: path, renderers: renderers, cells: cells })));
 };
-var ListWithDetailMasterItem$1 = react.withJsonFormsMasterListItemProps(ListWithDetailMasterItem);
+var materialObjectControlTester = core.rankWith(2, core.isObjectControl);
+var MaterialObjectRenderer$1 = react.withJsonFormsDetailProps(MaterialObjectRenderer);
 
-var MaterialListWithDetailRenderer = function (_a) {
-    var uischemas = _a.uischemas, schema = _a.schema, uischema = _a.uischema, path = _a.path, errors = _a.errors, visible = _a.visible, label = _a.label, required = _a.required, removeItems = _a.removeItems, addItem = _a.addItem, data = _a.data, renderers = _a.renderers, cells = _a.cells, config = _a.config, rootSchema = _a.rootSchema;
-    var _b = React.useState(undefined), selectedIndex = _b[0], setSelectedIndex = _b[1];
-    var handleRemoveItem = React.useCallback(function (p, value) { return function () {
-        removeItems(p, [value])();
+var MaterialOneOfRenderer = function (_a) {
+    var handleChange = _a.handleChange, schema = _a.schema, path = _a.path, renderers = _a.renderers, cells = _a.cells, rootSchema = _a.rootSchema, id = _a.id, visible = _a.visible, indexOfFittingSchema = _a.indexOfFittingSchema, uischema = _a.uischema, uischemas = _a.uischemas, data = _a.data;
+    var _b = React.useState(false), open = _b[0], setOpen = _b[1];
+    var _c = React.useState(indexOfFittingSchema || 0), selectedIndex = _c[0], setSelectedIndex = _c[1];
+    var _d = React.useState(0), newSelectedIndex = _d[0], setNewSelectedIndex = _d[1];
+    var handleClose = React.useCallback(function () { return setOpen(false); }, [setOpen]);
+    var cancel = React.useCallback(function () {
+        setOpen(false);
+    }, [setOpen]);
+    var oneOfRenderInfos = core.createCombinatorRenderInfos(schema.oneOf, rootSchema, 'oneOf', uischema, path, uischemas);
+    var openNewTab = function (newIndex) {
+        handleChange(path, core.createDefaultValue(oneOfRenderInfos[newIndex].schema));
+        setSelectedIndex(newIndex);
+    };
+    var confirm = React.useCallback(function () {
+        openNewTab(newSelectedIndex);
+        setOpen(false);
+    }, [handleChange, core.createDefaultValue, newSelectedIndex]);
+    var handleTabChange = React.useCallback(function (_event, newOneOfIndex) {
+        setNewSelectedIndex(newOneOfIndex);
+        if (isEmpty__default["default"](data)) {
+            openNewTab(newOneOfIndex);
+        }
+        else {
+            setOpen(true);
+        }
+    }, [setOpen, setSelectedIndex, data]);
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+        React__default["default"].createElement(CombinatorProperties, { schema: schema, combinatorKeyword: 'oneOf', path: path }),
+        React__default["default"].createElement(material.Tabs, { value: selectedIndex, onChange: handleTabChange }, oneOfRenderInfos.map(function (oneOfRenderInfo) { return (React__default["default"].createElement(material.Tab, { key: oneOfRenderInfo.label, label: oneOfRenderInfo.label })); })),
+        oneOfRenderInfos.map(function (oneOfRenderInfo, oneOfIndex) {
+            return selectedIndex === oneOfIndex && (React__default["default"].createElement(react.JsonFormsDispatch, { key: oneOfIndex, schema: oneOfRenderInfo.schema, uischema: oneOfRenderInfo.uischema, path: path, renderers: renderers, cells: cells }));
+        }),
+        React__default["default"].createElement(material.Dialog, { open: open, onClose: handleClose, "aria-labelledby": 'alert-dialog-title', "aria-describedby": 'alert-dialog-description' },
+            React__default["default"].createElement(material.DialogTitle, { id: 'alert-dialog-title' }, 'Clear form?'),
+            React__default["default"].createElement(material.DialogContent, null,
+                React__default["default"].createElement(material.DialogContentText, { id: 'alert-dialog-description' }, "Your data will be cleared if you navigate away from this tab. Do you want to proceed?")),
+            React__default["default"].createElement(material.DialogActions, null,
+                React__default["default"].createElement(material.Button, { onClick: cancel, color: 'primary' }, "No"),
+                React__default["default"].createElement(material.Button, { onClick: confirm, color: 'primary', autoFocus: true, id: "oneOf-" + id + "-confirm-yes" }, "Yes")))));
+};
+var materialOneOfControlTester = core.rankWith(3, core.isOneOfControl);
+var MaterialOneOfRenderer$1 = react.withJsonFormsOneOfProps(MaterialOneOfRenderer);
+
+var materialLabelRendererTester = core.rankWith(1, core.uiTypeIs('Label'));
+var MaterialLabelRenderer = function (_a) {
+    var text = _a.text, visible = _a.visible;
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+        React__default["default"].createElement(material.Typography, { variant: 'h6' }, text)));
+};
+var MaterialLabelRenderer$1 = react.withJsonFormsLabelProps(MaterialLabelRenderer);
+
+var ArrayLayoutToolbar = React__default["default"].memo(function ArrayLayoutToolbar(_a) {
+    var label = _a.label, errors = _a.errors, addItem = _a.addItem, path = _a.path, createDefault = _a.createDefault, translations = _a.translations;
+    return (React__default["default"].createElement(material.Toolbar, { disableGutters: true },
+        React__default["default"].createElement(material.Grid, { container: true, alignItems: 'center', justifyContent: 'space-between' },
+            React__default["default"].createElement(material.Grid, { item: true },
+                React__default["default"].createElement(material.Typography, { variant: 'h6' }, label)),
+            errors.length !== 0 && (React__default["default"].createElement(material.Grid, { item: true },
+                React__default["default"].createElement(ValidationIcon, { id: 'tooltip-validation', errorMessages: errors }))),
+            React__default["default"].createElement(material.Grid, { item: true },
+                React__default["default"].createElement(material.Grid, { container: true },
+                    React__default["default"].createElement(material.Grid, { item: true },
+                        React__default["default"].createElement(material.Tooltip, { id: 'tooltip-add', title: translations.addTooltip, placement: 'bottom' },
+                            React__default["default"].createElement(material.IconButton, { "aria-label": translations.addAriaLabel, onClick: addItem(path, createDefault()), size: 'large' },
+                                React__default["default"].createElement(AddIcon__default["default"], null)))))))));
+});
+
+var ListWithDetailMasterItem = function (_a) {
+    var index = _a.index, childLabel = _a.childLabel, selected = _a.selected, handleSelect = _a.handleSelect, removeItem = _a.removeItem, path = _a.path, translations = _a.translations;
+    return (React__default["default"].createElement(material.ListItem, { button: true, selected: selected, onClick: handleSelect(index) },
+        React__default["default"].createElement(material.ListItemAvatar, null,
+            React__default["default"].createElement(material.Avatar, { "aria-label": 'Index' }, index + 1)),
+        React__default["default"].createElement(material.ListItemText, { primary: childLabel }),
+        React__default["default"].createElement(material.ListItemSecondaryAction, null,
+            React__default["default"].createElement(material.IconButton, { "aria-label": translations.removeAriaLabel, onClick: removeItem(path, index), size: 'large' },
+                React__default["default"].createElement(DeleteIcon__default["default"], null)))));
+};
+var ListWithDetailMasterItem$1 = react.withJsonFormsMasterListItemProps(ListWithDetailMasterItem);
+
+var MaterialListWithDetailRenderer = function (_a) {
+    var uischemas = _a.uischemas, schema = _a.schema, uischema = _a.uischema, path = _a.path, errors = _a.errors, visible = _a.visible, label = _a.label, required = _a.required, removeItems = _a.removeItems, addItem = _a.addItem, data = _a.data, renderers = _a.renderers, cells = _a.cells, config = _a.config, rootSchema = _a.rootSchema, translations = _a.translations;
+    var _b = React.useState(undefined), selectedIndex = _b[0], setSelectedIndex = _b[1];
+    var handleRemoveItem = React.useCallback(function (p, value) { return function () {
+        removeItems(p, [value])();
         if (selectedIndex === value) {
             setSelectedIndex(undefined);
         }
@@ -725,24 +783,94 @@ var MaterialListWithDetailRenderer = function (_a) {
         setSelectedIndex(undefined);
     }, [schema]);
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(ArrayLayoutToolbar, { label: core.computeLabel(label, required, appliedUiSchemaOptions.hideRequiredAsterisk), errors: errors, path: path, addItem: addItem, createDefault: handleCreateDefaultValue }),
+        React__default["default"].createElement(ArrayLayoutToolbar, { translations: translations, label: core.computeLabel(label, required, appliedUiSchemaOptions.hideRequiredAsterisk), errors: errors, path: path, addItem: addItem, createDefault: handleCreateDefaultValue }),
         React__default["default"].createElement(material.Grid, { container: true, direction: 'row', spacing: 2 },
             React__default["default"].createElement(material.Grid, { item: true, xs: 3 },
-                React__default["default"].createElement(material.List, null, data > 0 ? (map__default["default"](range__default["default"](data), function (index) { return (React__default["default"].createElement(ListWithDetailMasterItem$1, { index: index, path: path, schema: schema, handleSelect: handleListItemClick, removeItem: handleRemoveItem, selected: selectedIndex === index, key: index })); })) : (React__default["default"].createElement("p", null, "No data")))),
-            React__default["default"].createElement(material.Grid, { item: true, xs: true }, selectedIndex !== undefined ? (React__default["default"].createElement(react.JsonFormsDispatch, { renderers: renderers, cells: cells, visible: visible, schema: schema, uischema: foundUISchema, path: core.composePaths(path, "" + selectedIndex) })) : (React__default["default"].createElement(material.Typography, { variant: 'h6' }, "No Selection"))))));
+                React__default["default"].createElement(material.List, null, data > 0 ? (map__default["default"](range__default["default"](data), function (index) { return (React__default["default"].createElement(ListWithDetailMasterItem$1, { index: index, path: path, schema: schema, handleSelect: handleListItemClick, removeItem: handleRemoveItem, selected: selectedIndex === index, key: index, translations: translations })); })) : (React__default["default"].createElement("p", null, "No data")))),
+            React__default["default"].createElement(material.Grid, { item: true, xs: true }, selectedIndex !== undefined ? (React__default["default"].createElement(react.JsonFormsDispatch, { renderers: renderers, cells: cells, visible: visible, schema: schema, uischema: foundUISchema, path: core.composePaths(path, "" + selectedIndex) })) : (React__default["default"].createElement(material.Typography, { variant: 'h6' }, translations.noSelection))))));
 };
 var materialListWithDetailTester = core.rankWith(4, core.and(core.uiTypeIs('ListWithDetail'), core.isObjectArray));
 var MaterialListWithDetailRenderer$1 = react.withJsonFormsArrayLayoutProps(MaterialListWithDetailRenderer);
 
+var MaterialInputControl = function (props) {
+    var _a = useFocus(), focused = _a[0], onFocus = _a[1], onBlur = _a[2];
+    var id = props.id, description = props.description, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, required = props.required, config = props.config, input = props.input;
+    var isValid = errors.length === 0;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
+    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
+    var firstFormHelperText = showDescription
+        ? description
+        : !isValid
+            ? errors
+            : null;
+    var secondFormHelperText = showDescription && !isValid ? errors : null;
+    var InnerComponent = input;
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+        React__default["default"].createElement(material.FormControl, { fullWidth: !appliedUiSchemaOptions.trim, onFocus: onFocus, onBlur: onBlur, id: id, variant: 'standard' },
+            React__default["default"].createElement(material.InputLabel, { htmlFor: id + '-input', error: !isValid, required: core.showAsRequired(required, appliedUiSchemaOptions.hideRequiredAsterisk) }, label),
+            React__default["default"].createElement(InnerComponent, __assign({}, props, { id: id + '-input', isValid: isValid, visible: visible })),
+            React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
+            React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText))));
+};
+
+var findEnumSchema = function (schemas) {
+    return schemas.find(function (s) { return s.enum !== undefined && (s.type === 'string' || s.type === undefined); });
+};
+var findTextSchema = function (schemas) {
+    return schemas.find(function (s) { return s.type === 'string' && s.enum === undefined; });
+};
+var MuiAutocompleteInputText = function (props) {
+    var data = props.data, config = props.config, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, isValid = props.isValid, path = props.path, handleChange = props.handleChange, schema = props.schema;
+    var enumSchema = findEnumSchema(schema.anyOf);
+    var stringSchema = findTextSchema(schema.anyOf);
+    var maxLength = stringSchema.maxLength;
+    var appliedUiSchemaOptions = React.useMemo(function () { return merge__default["default"]({}, config, uischema.options); }, [config, uischema.options]);
+    var inputProps = React.useMemo(function () {
+        var propMemo = {};
+        if (appliedUiSchemaOptions.restrict) {
+            propMemo = { maxLength: maxLength };
+        }
+        if (appliedUiSchemaOptions.trim && maxLength !== undefined) {
+            propMemo.size = maxLength;
+        }
+        propMemo.list = props.id + 'datalist';
+        return propMemo;
+    }, [appliedUiSchemaOptions, props.id]);
+    var _a = useDebouncedChange(handleChange, '', data, path), inputText = _a[0], onChange = _a[1];
+    var dataList = (React__default["default"].createElement("datalist", { id: props.id + 'datalist' }, enumSchema.enum.map(function (optionValue) { return (React__default["default"].createElement("option", { value: optionValue, key: optionValue })); })));
+    return (React__default["default"].createElement(material.Input, { type: 'text', value: inputText, onChange: onChange, className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, fullWidth: !appliedUiSchemaOptions.trim || maxLength === undefined, inputProps: inputProps, error: !isValid, endAdornment: dataList }));
+};
+var MaterialAnyOfStringOrEnumControl =  (function (_super) {
+    __extends(MaterialAnyOfStringOrEnumControl, _super);
+    function MaterialAnyOfStringOrEnumControl() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    MaterialAnyOfStringOrEnumControl.prototype.render = function () {
+        return (React__default["default"].createElement(MaterialInputControl, __assign({}, this.props, { input: MuiAutocompleteInputText })));
+    };
+    return MaterialAnyOfStringOrEnumControl;
+}(react.Control));
+var hasEnumAndText = function (schemas) {
+    var enumSchema = findEnumSchema(schemas);
+    var stringSchema = findTextSchema(schemas);
+    var remainingSchemas = schemas.filter(function (s) { return s !== enumSchema || s !== stringSchema; });
+    var wrongType = remainingSchemas.find(function (s) { return s.type && s.type !== 'string'; });
+    return enumSchema && stringSchema && !wrongType;
+};
+var simpleAnyOf = core.and(core.uiTypeIs('Control'), core.schemaMatches(function (schema) { return schema.hasOwnProperty('anyOf') && hasEnumAndText(schema.anyOf); }));
+var materialAnyOfStringOrEnumControlTester = core.rankWith(5, simpleAnyOf);
+var MaterialAnyOfStringOrEnumControl$1 = react.withJsonFormsControlProps(MaterialAnyOfStringOrEnumControl);
+
 var MaterialBooleanControl = function (_a) {
     var data = _a.data, visible = _a.visible, label = _a.label, id = _a.id, enabled = _a.enabled, uischema = _a.uischema, schema = _a.schema, rootSchema = _a.rootSchema, handleChange = _a.handleChange, errors = _a.errors, path = _a.path, config = _a.config, description = _a.description;
     var isValid = errors.length === 0;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var showDescription = !core.isDescriptionHidden(visible, description,
     false, appliedUiSchemaOptions.showUnfocusedDescription);
-    var showTooltip = !showDescription && !core.isDescriptionHidden(visible, description,
-    true,
-    true);
+    var showTooltip = !showDescription &&
+        !core.isDescriptionHidden(visible, description,
+        true,
+        true);
     var firstFormHelperText = showDescription
         ? description
         : !isValid
@@ -764,9 +892,9 @@ var MaterialBooleanControl = function (_a) {
     }
     var ariaDescribedBy = descriptionIds.join(' ');
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.Tooltip, { id: tooltipId, title: (showTooltip) ? description : '' },
+        React__default["default"].createElement(material.Tooltip, { id: tooltipId, title: showTooltip ? description : '' },
             React__default["default"].createElement(material.FormControlLabel, { label: label, id: id, control: React__default["default"].createElement(MuiCheckbox, { id: id + "-input", isValid: isEmpty__default["default"](errors), data: data, enabled: enabled, visible: visible, path: path, uischema: uischema, schema: schema, rootSchema: rootSchema, handleChange: handleChange, errors: errors, config: config, inputProps: {
-                        'aria-describedby': ariaDescribedBy
+                        'aria-describedby': ariaDescribedBy,
                     } }) })),
         React__default["default"].createElement(material.FormHelperText, { id: helpId1, error: !isValid && !showDescription }, firstFormHelperText),
         React__default["default"].createElement(material.FormHelperText, { id: helpId2, error: !isValid }, secondFormHelperText)));
@@ -774,25 +902,16 @@ var MaterialBooleanControl = function (_a) {
 var materialBooleanControlTester = core.rankWith(2, core.isBooleanControl);
 var MaterialBooleanControl$1 = react.withJsonFormsControlProps(MaterialBooleanControl);
 
-var MuiToggle = React__default["default"].memo(function (props) {
-    var data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, config = props.config, inputProps = props.inputProps;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
-    var inputPropsMerged = merge__default["default"]({}, inputProps, {
-        autoFocus: !!appliedUiSchemaOptions.focus
-    });
-    var checked = !!data;
-    return (React__default["default"].createElement(material.Switch, { checked: checked, onChange: function (_ev, isChecked) { return handleChange(path, isChecked); }, className: className, id: id, disabled: !enabled, inputProps: inputPropsMerged }));
-});
-
 var MaterialBooleanToggleControl = function (_a) {
     var data = _a.data, visible = _a.visible, label = _a.label, id = _a.id, enabled = _a.enabled, uischema = _a.uischema, schema = _a.schema, rootSchema = _a.rootSchema, handleChange = _a.handleChange, errors = _a.errors, path = _a.path, config = _a.config, description = _a.description;
     var isValid = errors.length === 0;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var showDescription = !core.isDescriptionHidden(visible, description,
     false, appliedUiSchemaOptions.showUnfocusedDescription);
-    var showTooltip = !showDescription && !core.isDescriptionHidden(visible, description,
-    true,
-    true);
+    var showTooltip = !showDescription &&
+        !core.isDescriptionHidden(visible, description,
+        true,
+        true);
     var firstFormHelperText = showDescription
         ? description
         : !isValid
@@ -814,9 +933,9 @@ var MaterialBooleanToggleControl = function (_a) {
     }
     var ariaDescribedBy = descriptionIds.join(' ');
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.Tooltip, { id: tooltipId, title: (showTooltip) ? description : '' },
+        React__default["default"].createElement(material.Tooltip, { id: tooltipId, title: showTooltip ? description : '' },
             React__default["default"].createElement(material.FormControlLabel, { label: label, id: id, control: React__default["default"].createElement(MuiToggle, { id: id + "-input", isValid: isEmpty__default["default"](errors), data: data, enabled: enabled, visible: visible, path: path, uischema: uischema, schema: schema, rootSchema: rootSchema, handleChange: handleChange, errors: errors, config: config, inputProps: {
-                        'aria-describedby': ariaDescribedBy
+                        'aria-describedby': ariaDescribedBy,
                     } }) })),
         React__default["default"].createElement(material.FormHelperText, { id: helpId1, error: !isValid && !showDescription }, firstFormHelperText),
         React__default["default"].createElement(material.FormHelperText, { id: helpId2, error: !isValid }, secondFormHelperText)));
@@ -824,79 +943,6 @@ var MaterialBooleanToggleControl = function (_a) {
 var materialBooleanToggleControlTester = core.rankWith(3, core.and(core.isBooleanControl, core.optionIs('toggle', true)));
 var MaterialBooleanToggleControl$1 = react.withJsonFormsControlProps(MaterialBooleanToggleControl);
 
-var MaterialInputControl = function (props) {
-    var _a = useFocus(), focused = _a[0], onFocus = _a[1], onBlur = _a[2];
-    var id = props.id, description = props.description, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, required = props.required, config = props.config, input = props.input;
-    var isValid = errors.length === 0;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
-    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
-    var firstFormHelperText = showDescription
-        ? description
-        : !isValid
-            ? errors
-            : null;
-    var secondFormHelperText = showDescription && !isValid ? errors : null;
-    var InnerComponent = input;
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.FormControl, { fullWidth: !appliedUiSchemaOptions.trim, onFocus: onFocus, onBlur: onBlur, id: id, variant: 'standard' },
-            React__default["default"].createElement(material.InputLabel, { htmlFor: id + '-input', error: !isValid, required: core.showAsRequired(required, appliedUiSchemaOptions.hideRequiredAsterisk) }, label),
-            React__default["default"].createElement(InnerComponent, __assign({}, props, { id: id + '-input', isValid: isValid, visible: visible })),
-            React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
-            React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText))));
-};
-
-var MuiAutocomplete = function (props) {
-    var _a;
-    var description = props.description, errors = props.errors, visible = props.visible, required = props.required, label = props.label, data = props.data, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, path = props.path, handleChange = props.handleChange, options = props.options, config = props.config, getOptionLabel = props.getOptionLabel, renderOption = props.renderOption, filterOptions = props.filterOptions, isValid = props.isValid;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
-    var _b = React__default["default"].useState(data !== null && data !== void 0 ? data : ''), inputValue = _b[0], setInputValue = _b[1];
-    var _c = useFocus(), focused = _c[0], onFocus = _c[1], onBlur = _c[2];
-    var findOption = (_a = options.find(function (o) { return o.value === data; })) !== null && _a !== void 0 ? _a : null;
-    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
-    var firstFormHelperText = showDescription
-        ? description
-        : !isValid
-            ? errors
-            : null;
-    var secondFormHelperText = showDescription && !isValid ? errors : null;
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.Autocomplete, { className: className, id: id, disabled: !enabled, value: findOption, onChange: function (_event, newValue) {
-                handleChange(path, newValue === null || newValue === void 0 ? void 0 : newValue.value);
-            }, inputValue: inputValue, onInputChange: function (_event, newInputValue) {
-                setInputValue(newInputValue);
-            }, autoHighlight: true, autoSelect: true, autoComplete: true, fullWidth: true, options: options, getOptionLabel: getOptionLabel || (function (option) { return option === null || option === void 0 ? void 0 : option.label; }), freeSolo: false, renderInput: function (params) {
-                return (React__default["default"].createElement(material.TextField, __assign({ label: label, variant: 'standard', type: 'text', inputProps: params.inputProps, inputRef: params.InputProps.ref, autoFocus: appliedUiSchemaOptions.focus, disabled: !enabled }, params, { id: id + '-input', required: required && !appliedUiSchemaOptions.hideRequiredAsterisk, error: !isValid, fullWidth: !appliedUiSchemaOptions.trim, InputLabelProps: data ? { shrink: true } : undefined, onFocus: onFocus, onBlur: onBlur, focused: focused })));
-            }, renderOption: renderOption, filterOptions: filterOptions }),
-        React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
-        React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText)));
-};
-
-var MaterialEnumControl = function (props) {
-    var config = props.config, uischema = props.uischema, errors = props.errors;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
-    var isValid = errors.length === 0;
-    return (appliedUiSchemaOptions.autocomplete === false ?
-        React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiSelect })) :
-        React__default["default"].createElement(MuiAutocomplete, __assign({}, props, { isValid: isValid })));
-};
-var materialEnumControlTester = core.rankWith(2, core.isEnumControl);
-var MaterialEnumControl$1 = react.withJsonFormsEnumProps(react.withTranslateProps(React__default["default"].memo(MaterialEnumControl)), false);
-
-var MaterialNativeControl = function (props) {
-    var _a;
-    var _b = useFocus(), focused = _b[0], onFocus = _b[1], onBlur = _b[2];
-    var id = props.id, errors = props.errors, label = props.label, schema = props.schema, description = props.description, enabled = props.enabled, visible = props.visible, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
-    var isValid = errors.length === 0;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, props.uischema.options);
-    var _c = useDebouncedChange(handleChange, '', data, path), inputValue = _c[0], onChange = _c[1];
-    var fieldType = (_a = appliedUiSchemaOptions.format) !== null && _a !== void 0 ? _a : schema.format;
-    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.TextField, { required: core.showAsRequired(required, appliedUiSchemaOptions.hideRequiredAsterisk), id: id + '-input', label: label, type: fieldType, error: !isValid, disabled: !enabled, fullWidth: !appliedUiSchemaOptions.trim, onFocus: onFocus, onBlur: onBlur, helperText: !isValid ? errors : showDescription ? description : null, InputLabelProps: { shrink: true }, value: inputValue, onChange: onChange })));
-};
-var materialNativeControlTester = core.rankWith(2, core.or(core.isDateControl, core.isTimeControl));
-var MaterialNativeControl$1 = react.withJsonFormsControlProps(MaterialNativeControl);
-
 var MaterialDateControl = function (props) {
     var _a, _b, _c;
     var _d = useFocus(), focused = _d[0], onFocus = _d[1], onBlur = _d[2];
@@ -920,8 +966,10 @@ var MaterialDateControl = function (props) {
         React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
             React__default["default"].createElement(xDatePickers.DatePicker, { label: label, value: value, onChange: onChange, inputFormat: format, disableMaskedInput: true, views: views, disabled: !enabled, componentsProps: {
                     actionBar: {
-                        actions: function (variant) { return (variant === 'desktop' ? [] : ['clear', 'cancel', 'accept']); }
-                    }
+                        actions: function (variant) {
+                            return variant === 'desktop' ? [] : ['clear', 'cancel', 'accept'];
+                        },
+                    },
                 }, renderInput: function (params) { return (React__default["default"].createElement(ResettableTextField, __assign({}, params, { rawValue: data, dayjsValueIsValid: value !== null, valueInInputFormat: valueInInputFormat, focused: focused, id: id + '-input', required: required && !appliedUiSchemaOptions.hideRequiredAsterisk, autoFocus: appliedUiSchemaOptions.focus, error: !isValid, fullWidth: !appliedUiSchemaOptions.trim, inputProps: __assign(__assign({}, params.inputProps), { type: 'text' }), InputLabelProps: data ? { shrink: true } : undefined, onFocus: onFocus, onBlur: onBlur, variant: 'standard' }))); } }),
             React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
             React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText))));
@@ -938,7 +986,12 @@ var MaterialDateTimeControl = function (props) {
     var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
     var format = (_a = appliedUiSchemaOptions.dateTimeFormat) !== null && _a !== void 0 ? _a : 'YYYY-MM-DD HH:mm';
     var saveFormat = (_b = appliedUiSchemaOptions.dateTimeSaveFormat) !== null && _b !== void 0 ? _b : undefined;
-    var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : ['year', 'day', 'hours', 'minutes'];
+    var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : [
+        'year',
+        'day',
+        'hours',
+        'minutes',
+    ];
     var firstFormHelperText = showDescription
         ? description
         : !isValid
@@ -952,8 +1005,10 @@ var MaterialDateTimeControl = function (props) {
         React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
             React__default["default"].createElement(xDatePickers.DateTimePicker, { label: label, value: value, onChange: onChange, inputFormat: format, disableMaskedInput: true, ampm: !!appliedUiSchemaOptions.ampm, views: views, disabled: !enabled, componentsProps: {
                     actionBar: {
-                        actions: function (variant) { return (variant === 'desktop' ? [] : ['clear', 'cancel', 'accept']); }
-                    }
+                        actions: function (variant) {
+                            return variant === 'desktop' ? [] : ['clear', 'cancel', 'accept'];
+                        },
+                    },
                 }, renderInput: function (params) { return (React__default["default"].createElement(ResettableTextField, __assign({}, params, { rawValue: data, dayjsValueIsValid: value !== null, valueInInputFormat: valueInInputFormat, focused: focused, id: id + '-input', required: required && !appliedUiSchemaOptions.hideRequiredAsterisk, autoFocus: appliedUiSchemaOptions.focus, error: !isValid, fullWidth: !appliedUiSchemaOptions.trim, inputProps: __assign(__assign({}, params.inputProps), { type: 'text' }), InputLabelProps: data ? { shrink: true } : undefined, onFocus: onFocus, onBlur: onBlur, variant: 'standard' }))); } }),
             React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
             React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText))));
@@ -961,37 +1016,73 @@ var MaterialDateTimeControl = function (props) {
 var materialDateTimeControlTester = core.rankWith(2, core.isDateTimeControl);
 var MaterialDateTimeControl$1 = react.withJsonFormsControlProps(MaterialDateTimeControl);
 
-var MaterialTimeControl = function (props) {
-    var _a, _b, _c;
-    var _d = useFocus(), focused = _d[0], onFocus = _d[1], onBlur = _d[2];
-    var id = props.id, description = props.description, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, enabled = props.enabled, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
+var MaterialEnumControl = function (props) {
+    var config = props.config, uischema = props.uischema, errors = props.errors;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var isValid = errors.length === 0;
+    return appliedUiSchemaOptions.autocomplete === false ? (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiSelect }))) : (React__default["default"].createElement(MuiAutocomplete, __assign({}, props, { isValid: isValid })));
+};
+var materialEnumControlTester = core.rankWith(2, core.isEnumControl);
+var MaterialEnumControl$1 = react.withJsonFormsEnumProps(react.withTranslateProps(React__default["default"].memo(MaterialEnumControl)), false);
+
+var MaterialIntegerControl = function (props) { return (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiInputInteger }))); };
+var materialIntegerControlTester = core.rankWith(2, core.isIntegerControl);
+var MaterialIntegerControl$1 = react.withJsonFormsControlProps(MaterialIntegerControl);
+
+var MaterialNativeControl = function (props) {
+    var _a;
+    var _b = useFocus(), focused = _b[0], onFocus = _b[1], onBlur = _b[2];
+    var id = props.id, errors = props.errors, label = props.label, schema = props.schema, description = props.description, enabled = props.enabled, visible = props.visible, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
+    var isValid = errors.length === 0;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, props.uischema.options);
+    var _c = useDebouncedChange(handleChange, '', data, path), inputValue = _c[0], onChange = _c[1];
+    var fieldType = (_a = appliedUiSchemaOptions.format) !== null && _a !== void 0 ? _a : schema.format;
     var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
-    var format = (_a = appliedUiSchemaOptions.timeFormat) !== null && _a !== void 0 ? _a : 'HH:mm';
-    var saveFormat = (_b = appliedUiSchemaOptions.timeSaveFormat) !== null && _b !== void 0 ? _b : 'HH:mm:ss';
-    var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : ['hours', 'minutes'];
-    var firstFormHelperText = showDescription
-        ? description
-        : !isValid
-            ? errors
-            : null;
-    var secondFormHelperText = showDescription && !isValid ? errors : null;
-    var onChange = React.useMemo(function () { return createOnChangeHandler(path, handleChange, saveFormat); }, [path, handleChange, saveFormat]);
-    var value = getData(data, saveFormat);
-    var valueInInputFormat = value ? value.format(format) : '';
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
-            React__default["default"].createElement(xDatePickers.TimePicker, { label: label, value: value, onChange: onChange, inputFormat: format, disableMaskedInput: true, ampm: !!appliedUiSchemaOptions.ampm, views: views, disabled: !enabled, componentsProps: {
-                    actionBar: {
-                        actions: function (variant) { return (variant === 'desktop' ? [] : ['clear', 'cancel', 'accept']); }
-                    }
-                }, renderInput: function (params) { return (React__default["default"].createElement(ResettableTextField, __assign({}, params, { rawValue: data, dayjsValueIsValid: value !== null, valueInInputFormat: valueInInputFormat, focused: focused, id: id + '-input', required: required && !appliedUiSchemaOptions.hideRequiredAsterisk, autoFocus: appliedUiSchemaOptions.focus, error: !isValid, fullWidth: !appliedUiSchemaOptions.trim, inputProps: __assign(__assign({}, params.inputProps), { type: 'text' }), InputLabelProps: data ? { shrink: true } : undefined, onFocus: onFocus, onBlur: onBlur, variant: 'standard' }))); } }),
-            React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
-            React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText))));
+        React__default["default"].createElement(material.TextField, { required: core.showAsRequired(required, appliedUiSchemaOptions.hideRequiredAsterisk), id: id + '-input', label: label, type: fieldType, error: !isValid, disabled: !enabled, fullWidth: !appliedUiSchemaOptions.trim, onFocus: onFocus, onBlur: onBlur, helperText: !isValid ? errors : showDescription ? description : null, InputLabelProps: { shrink: true }, value: inputValue, onChange: onChange })));
+};
+var materialNativeControlTester = core.rankWith(2, core.or(core.isDateControl, core.isTimeControl));
+var MaterialNativeControl$1 = react.withJsonFormsControlProps(MaterialNativeControl);
+
+var MaterialNumberControl = function (props) { return (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiInputNumber }))); };
+var materialNumberControlTester = core.rankWith(2, core.isNumberControl);
+var MaterialNumberControl$1 = react.withJsonFormsControlProps(MaterialNumberControl);
+
+var MaterialOneOfEnumControl = function (props) {
+    var config = props.config, uischema = props.uischema, errors = props.errors;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
+    var isValid = errors.length === 0;
+    return appliedUiSchemaOptions.autocomplete === false ? (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiSelect }))) : (React__default["default"].createElement(MuiAutocomplete, __assign({}, props, { isValid: isValid })));
+};
+var materialOneOfEnumControlTester = core.rankWith(5, core.isOneOfEnumControl);
+var MaterialOneOfEnumControl$1 = react.withJsonFormsOneOfEnumProps(react.withTranslateProps(React__default["default"].memo(MaterialOneOfEnumControl)), false);
+
+var MaterialRadioGroup = function (props) {
+    var _a;
+    var _b = useFocus(), focused = _b[0], onFocus = _b[1], onBlur = _b[2];
+    var config = props.config, id = props.id, label = props.label, required = props.required, description = props.description, errors = props.errors, data = props.data, visible = props.visible, options = props.options, handleChange = props.handleChange, path = props.path, enabled = props.enabled;
+    var isValid = errors.length === 0;
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, props.uischema.options);
+    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
+    var onChange = function (_ev, value) { return handleChange(path, value); };
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+        React__default["default"].createElement(material.FormControl, { component: 'fieldset', fullWidth: !appliedUiSchemaOptions.trim, onFocus: onFocus, onBlur: onBlur },
+            React__default["default"].createElement(material.FormLabel, { htmlFor: id, error: !isValid, component: 'legend', required: core.showAsRequired(required, appliedUiSchemaOptions.hideRequiredAsterisk) }, label),
+            React__default["default"].createElement(material.RadioGroup, { value: (_a = props.data) !== null && _a !== void 0 ? _a : '', onChange: onChange, row: true }, options.map(function (option) { return (React__default["default"].createElement(material.FormControlLabel, { value: option.value, key: option.label, control: React__default["default"].createElement(material.Radio, { checked: data === option.value }), label: option.label, disabled: !enabled })); })),
+            React__default["default"].createElement(material.FormHelperText, { error: !isValid }, !isValid ? errors : showDescription ? description : null))));
+};
+
+var MaterialOneOfRadioGroupControl = function (props) {
+    return React__default["default"].createElement(MaterialRadioGroup, __assign({}, props));
+};
+var materialOneOfRadioGroupControlTester = core.rankWith(20, core.and(core.isOneOfEnumControl, core.optionIs('format', 'radio')));
+var MaterialOneOfRadioGroupControl$1 = react.withJsonFormsOneOfEnumProps(MaterialOneOfRadioGroupControl);
+
+var MaterialRadioGroupControl = function (props) {
+    return React__default["default"].createElement(MaterialRadioGroup, __assign({}, props));
 };
-var materialTimeControlTester = core.rankWith(4, core.isTimeControl);
-var MaterialTimeControl$1 = react.withJsonFormsControlProps(MaterialTimeControl);
+var materialRadioGroupControlTester = core.rankWith(20, core.and(core.isEnumControl, core.optionIs('format', 'radio')));
+var MaterialRadioGroupControl$1 = react.withJsonFormsEnumProps(MaterialRadioGroupControl);
 
 var MaterialSliderControl = function (props) {
     var _a = useFocus(), focused = _a[0], onFocus = _a[1], onBlur = _a[2];
@@ -1002,16 +1093,16 @@ var MaterialSliderControl = function (props) {
         whiteSpace: 'nowrap',
         overflow: 'hidden',
         textOverflow: 'ellipsis',
-        width: '100%'
+        width: '100%',
     };
     var rangeContainerStyle = {
-        display: 'flex'
+        display: 'flex',
     };
     var rangeItemStyle = {
-        flexGrow: '1'
+        flexGrow: '1',
     };
     var sliderStyle = {
-        marginTop: '7px'
+        marginTop: '7px',
     };
     var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
     var onChange = React.useCallback(function (_ev, value) { return handleChange(path, Number(value)); }, [path, handleChange]);
@@ -1028,130 +1119,144 @@ var MaterialSliderControl = function (props) {
 var materialSliderControlTester = core.rankWith(4, core.isRangeControl);
 var MaterialSliderControl$1 = react.withJsonFormsControlProps(MaterialSliderControl);
 
-var MaterialRadioGroup = function (props) {
-    var _a;
-    var _b = useFocus(), focused = _b[0], onFocus = _b[1], onBlur = _b[2];
-    var config = props.config, id = props.id, label = props.label, required = props.required, description = props.description, errors = props.errors, data = props.data, visible = props.visible, options = props.options, handleChange = props.handleChange, path = props.path, enabled = props.enabled;
-    var isValid = errors.length === 0;
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, props.uischema.options);
-    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
-    var onChange = function (_ev, value) { return handleChange(path, value); };
-    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
-        React__default["default"].createElement(material.FormControl, { component: 'fieldset', fullWidth: !appliedUiSchemaOptions.trim, onFocus: onFocus, onBlur: onBlur },
-            React__default["default"].createElement(material.FormLabel, { htmlFor: id, error: !isValid, component: 'legend', required: core.showAsRequired(required, appliedUiSchemaOptions.hideRequiredAsterisk) }, label),
-            React__default["default"].createElement(material.RadioGroup, { value: (_a = props.data) !== null && _a !== void 0 ? _a : '', onChange: onChange, row: true }, options.map(function (option) { return (React__default["default"].createElement(material.FormControlLabel, { value: option.value, key: option.label, control: React__default["default"].createElement(material.Radio, { checked: data === option.value }), label: option.label, disabled: !enabled })); })),
-            React__default["default"].createElement(material.FormHelperText, { error: !isValid }, !isValid ? errors : showDescription ? description : null))));
-};
-
-var MaterialRadioGroupControl = function (props) {
-    return React__default["default"].createElement(MaterialRadioGroup, __assign({}, props));
-};
-var materialRadioGroupControlTester = core.rankWith(20, core.and(core.isEnumControl, core.optionIs('format', 'radio')));
-var MaterialRadioGroupControl$1 = react.withJsonFormsEnumProps(MaterialRadioGroupControl);
-
-var MaterialIntegerControl = function (props) { return (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiInputInteger }))); };
-var materialIntegerControlTester = core.rankWith(2, core.isIntegerControl);
-var MaterialIntegerControl$1 = react.withJsonFormsControlProps(MaterialIntegerControl);
-
-var MaterialNumberControl = function (props) { return (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiInputNumber }))); };
-var materialNumberControlTester = core.rankWith(2, core.isNumberControl);
-var MaterialNumberControl$1 = react.withJsonFormsControlProps(MaterialNumberControl);
-
 var MaterialTextControl = function (props) { return (React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiInputText }))); };
 var materialTextControlTester = core.rankWith(1, core.isStringControl);
 var MaterialTextControl$1 = react.withJsonFormsControlProps(MaterialTextControl);
 
-var findEnumSchema = function (schemas) {
-    return schemas.find(function (s) { return s.enum !== undefined && (s.type === 'string' || s.type === undefined); });
-};
-var findTextSchema = function (schemas) {
-    return schemas.find(function (s) { return s.type === 'string' && s.enum === undefined; });
-};
-var MuiAutocompleteInputText = function (props) {
-    var data = props.data, config = props.config, className = props.className, id = props.id, enabled = props.enabled, uischema = props.uischema, isValid = props.isValid, path = props.path, handleChange = props.handleChange, schema = props.schema;
-    var enumSchema = findEnumSchema(schema.anyOf);
-    var stringSchema = findTextSchema(schema.anyOf);
-    var maxLength = stringSchema.maxLength;
-    var appliedUiSchemaOptions = React.useMemo(function () { return merge__default["default"]({}, config, uischema.options); }, [config, uischema.options]);
-    var inputProps = React.useMemo(function () {
-        var propMemo = {};
-        if (appliedUiSchemaOptions.restrict) {
-            propMemo = { maxLength: maxLength };
-        }
-        if (appliedUiSchemaOptions.trim && maxLength !== undefined) {
-            propMemo.size = maxLength;
-        }
-        propMemo.list = props.id + 'datalist';
-        return propMemo;
-    }, [appliedUiSchemaOptions, props.id]);
-    var _a = useDebouncedChange(handleChange, '', data, path), inputText = _a[0], onChange = _a[1];
-    var dataList = (React__default["default"].createElement("datalist", { id: props.id + 'datalist' }, enumSchema.enum.map(function (optionValue) { return (React__default["default"].createElement("option", { value: optionValue, key: optionValue })); })));
-    return (React__default["default"].createElement(material.Input, { type: 'text', value: inputText, onChange: onChange, className: className, id: id, disabled: !enabled, autoFocus: appliedUiSchemaOptions.focus, fullWidth: !appliedUiSchemaOptions.trim || maxLength === undefined, inputProps: inputProps, error: !isValid, endAdornment: dataList }));
-};
-var MaterialAnyOfStringOrEnumControl =  (function (_super) {
-    __extends(MaterialAnyOfStringOrEnumControl, _super);
-    function MaterialAnyOfStringOrEnumControl() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    MaterialAnyOfStringOrEnumControl.prototype.render = function () {
-        return (React__default["default"].createElement(MaterialInputControl, __assign({}, this.props, { input: MuiAutocompleteInputText })));
-    };
-    return MaterialAnyOfStringOrEnumControl;
-}(react.Control));
-var hasEnumAndText = function (schemas) {
-    var enumSchema = findEnumSchema(schemas);
-    var stringSchema = findTextSchema(schemas);
-    var remainingSchemas = schemas.filter(function (s) { return s !== enumSchema || s !== stringSchema; });
-    var wrongType = remainingSchemas.find(function (s) { return s.type && s.type !== 'string'; });
-    return enumSchema && stringSchema && !wrongType;
-};
-var simpleAnyOf = core.and(core.uiTypeIs('Control'), core.schemaMatches(function (schema) { return schema.hasOwnProperty('anyOf') && hasEnumAndText(schema.anyOf); }));
-var materialAnyOfStringOrEnumControlTester = core.rankWith(5, simpleAnyOf);
-var MaterialAnyOfStringOrEnumControl$1 = react.withJsonFormsControlProps(MaterialAnyOfStringOrEnumControl);
-
-var MaterialOneOfEnumControl = function (props) {
-    var config = props.config, uischema = props.uischema, errors = props.errors;
+var MaterialTimeControl = function (props) {
+    var _a, _b, _c;
+    var _d = useFocus(), focused = _d[0], onFocus = _d[1], onBlur = _d[2];
+    var id = props.id, description = props.description, errors = props.errors, label = props.label, uischema = props.uischema, visible = props.visible, enabled = props.enabled, required = props.required, path = props.path, handleChange = props.handleChange, data = props.data, config = props.config;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
     var isValid = errors.length === 0;
-    return (appliedUiSchemaOptions.autocomplete === false ?
-        React__default["default"].createElement(MaterialInputControl, __assign({}, props, { input: MuiSelect })) :
-        React__default["default"].createElement(MuiAutocomplete, __assign({}, props, { isValid: isValid })));
+    var showDescription = !core.isDescriptionHidden(visible, description, focused, appliedUiSchemaOptions.showUnfocusedDescription);
+    var format = (_a = appliedUiSchemaOptions.timeFormat) !== null && _a !== void 0 ? _a : 'HH:mm';
+    var saveFormat = (_b = appliedUiSchemaOptions.timeSaveFormat) !== null && _b !== void 0 ? _b : 'HH:mm:ss';
+    var views = (_c = appliedUiSchemaOptions.views) !== null && _c !== void 0 ? _c : ['hours', 'minutes'];
+    var firstFormHelperText = showDescription
+        ? description
+        : !isValid
+            ? errors
+            : null;
+    var secondFormHelperText = showDescription && !isValid ? errors : null;
+    var onChange = React.useMemo(function () { return createOnChangeHandler(path, handleChange, saveFormat); }, [path, handleChange, saveFormat]);
+    var value = getData(data, saveFormat);
+    var valueInInputFormat = value ? value.format(format) : '';
+    return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
+        React__default["default"].createElement(xDatePickers.LocalizationProvider, { dateAdapter: AdapterDayjs.AdapterDayjs },
+            React__default["default"].createElement(xDatePickers.TimePicker, { label: label, value: value, onChange: onChange, inputFormat: format, disableMaskedInput: true, ampm: !!appliedUiSchemaOptions.ampm, views: views, disabled: !enabled, componentsProps: {
+                    actionBar: {
+                        actions: function (variant) {
+                            return variant === 'desktop' ? [] : ['clear', 'cancel', 'accept'];
+                        },
+                    },
+                }, renderInput: function (params) { return (React__default["default"].createElement(ResettableTextField, __assign({}, params, { rawValue: data, dayjsValueIsValid: value !== null, valueInInputFormat: valueInInputFormat, focused: focused, id: id + '-input', required: required && !appliedUiSchemaOptions.hideRequiredAsterisk, autoFocus: appliedUiSchemaOptions.focus, error: !isValid, fullWidth: !appliedUiSchemaOptions.trim, inputProps: __assign(__assign({}, params.inputProps), { type: 'text' }), InputLabelProps: data ? { shrink: true } : undefined, onFocus: onFocus, onBlur: onBlur, variant: 'standard' }))); } }),
+            React__default["default"].createElement(material.FormHelperText, { error: !isValid && !showDescription }, firstFormHelperText),
+            React__default["default"].createElement(material.FormHelperText, { error: !isValid }, secondFormHelperText))));
 };
-var materialOneOfEnumControlTester = core.rankWith(5, core.isOneOfEnumControl);
-var MaterialOneOfEnumControl$1 = react.withJsonFormsOneOfEnumProps(react.withTranslateProps(React__default["default"].memo(MaterialOneOfEnumControl)), false);
+var materialTimeControlTester = core.rankWith(4, core.isTimeControl);
+var MaterialTimeControl$1 = react.withJsonFormsControlProps(MaterialTimeControl);
 
-var MaterialOneOfRadioGroupControl = function (props) {
-    return React__default["default"].createElement(MaterialRadioGroup, __assign({}, props));
+var iconStyle = { float: 'right' };
+var ExpandPanelRendererComponent = function (props) {
+    var labelHtmlId = React.useState(core.createId('expand-panel'))[0];
+    React.useEffect(function () {
+        return function () {
+            core.removeId(labelHtmlId);
+        };
+    }, [labelHtmlId]);
+    var enabled = props.enabled, childLabel = props.childLabel, childPath = props.childPath, index = props.index, expanded = props.expanded, moveDown = props.moveDown, moveUp = props.moveUp, enableMoveDown = props.enableMoveDown, enableMoveUp = props.enableMoveUp, handleExpansion = props.handleExpansion, removeItems = props.removeItems, path = props.path, rootSchema = props.rootSchema, schema = props.schema, uischema = props.uischema, uischemas = props.uischemas, renderers = props.renderers, cells = props.cells, config = props.config, translations = props.translations;
+    var foundUISchema = React.useMemo(function () {
+        return core.findUISchema(uischemas, schema, uischema.scope, path, undefined, uischema, rootSchema);
+    }, [uischemas, schema, uischema.scope, path, uischema, rootSchema]);
+    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
+    var showSortButtons = appliedUiSchemaOptions.showSortButtons ||
+        appliedUiSchemaOptions.showArrayLayoutSortButtons;
+    return (React__default["default"].createElement(material.Accordion, { "aria-labelledby": labelHtmlId, expanded: expanded, onChange: handleExpansion(childPath) },
+        React__default["default"].createElement(material.AccordionSummary, { expandIcon: React__default["default"].createElement(ExpandMoreIcon__default["default"], null) },
+            React__default["default"].createElement(material.Grid, { container: true, alignItems: 'center' },
+                React__default["default"].createElement(material.Grid, { item: true, xs: 7, md: 9 },
+                    React__default["default"].createElement(material.Grid, { container: true, alignItems: 'center' },
+                        React__default["default"].createElement(material.Grid, { item: true, xs: 2, md: 1 },
+                            React__default["default"].createElement(material.Avatar, { "aria-label": 'Index' }, index + 1)),
+                        React__default["default"].createElement(material.Grid, { item: true, xs: 10, md: 11 },
+                            React__default["default"].createElement("span", { id: labelHtmlId }, childLabel)))),
+                React__default["default"].createElement(material.Grid, { item: true, xs: 5, md: 3 },
+                    React__default["default"].createElement(material.Grid, { container: true, justifyContent: 'flex-end' },
+                        React__default["default"].createElement(material.Grid, { item: true },
+                            React__default["default"].createElement(material.Grid, { container: true, direction: 'row', justifyContent: 'center', alignItems: 'center' },
+                                showSortButtons ? (React__default["default"].createElement(React.Fragment, null,
+                                    React__default["default"].createElement(material.Grid, { item: true },
+                                        React__default["default"].createElement(material.IconButton, { onClick: moveUp(path, index), style: iconStyle, disabled: !enableMoveUp, "aria-label": translations.upAriaLabel, size: 'large' },
+                                            React__default["default"].createElement(ArrowUpward__default["default"], null))),
+                                    React__default["default"].createElement(material.Grid, { item: true },
+                                        React__default["default"].createElement(material.IconButton, { onClick: moveDown(path, index), style: iconStyle, disabled: !enableMoveDown, "aria-label": translations.downAriaLabel, size: 'large' },
+                                            React__default["default"].createElement(ArrowDownward__default["default"], null))))) : (''),
+                                React__default["default"].createElement(material.Grid, { item: true },
+                                    React__default["default"].createElement(material.IconButton, { onClick: removeItems(path, [index]), style: iconStyle, "aria-label": translations.removeAriaLabel, size: 'large' },
+                                        React__default["default"].createElement(DeleteIcon__default["default"], null))))))))),
+        React__default["default"].createElement(material.AccordionDetails, null,
+            React__default["default"].createElement(react.JsonFormsDispatch, { enabled: enabled, schema: schema, uischema: foundUISchema, path: childPath, key: childPath, renderers: renderers, cells: cells }))));
 };
-var materialOneOfRadioGroupControlTester = core.rankWith(20, core.and(core.isOneOfEnumControl, core.optionIs('format', 'radio')));
-var MaterialOneOfRadioGroupControl$1 = react.withJsonFormsOneOfEnumProps(MaterialOneOfRadioGroupControl);
-
-var Unwrapped = {
-    MaterialBooleanControl: MaterialBooleanControl,
-    MaterialBooleanToggleControl: MaterialBooleanToggleControl,
-    MaterialEnumControl: MaterialEnumControl,
-    MaterialNativeControl: MaterialNativeControl,
-    MaterialDateControl: MaterialDateControl,
-    MaterialDateTimeControl: MaterialDateTimeControl,
-    MaterialTimeControl: MaterialTimeControl,
-    MaterialSliderControl: MaterialSliderControl,
-    MaterialRadioGroupControl: MaterialRadioGroupControl,
-    MaterialIntegerControl: MaterialIntegerControl,
-    MaterialNumberControl: MaterialNumberControl,
-    MaterialTextControl: MaterialTextControl,
-    MaterialAnyOfStringOrEnumControl: MaterialAnyOfStringOrEnumControl,
-    MaterialOneOfEnumControl: MaterialOneOfEnumControl,
-    MaterialOneOfRadioGroupControl: MaterialOneOfRadioGroupControl
+var ExpandPanelRenderer = React__default["default"].memo(ExpandPanelRendererComponent);
+var ctxDispatchToExpandPanelProps = function (dispatch) { return ({
+    removeItems: React.useCallback(function (path, toDelete) {
+        return function (event) {
+            event.stopPropagation();
+            dispatch(core.update(path, function (array) {
+                toDelete
+                    .sort()
+                    .reverse()
+                    .forEach(function (s) { return array.splice(s, 1); });
+                return array;
+            }));
+        };
+    }, [dispatch]),
+    moveUp: React.useCallback(function (path, toMove) {
+        return function (event) {
+            event.stopPropagation();
+            dispatch(core.update(path, function (array) {
+                core.moveUp(array, toMove);
+                return array;
+            }));
+        };
+    }, [dispatch]),
+    moveDown: React.useCallback(function (path, toMove) {
+        return function (event) {
+            event.stopPropagation();
+            dispatch(core.update(path, function (array) {
+                core.moveDown(array, toMove);
+                return array;
+            }));
+        };
+    }, [dispatch]),
+}); };
+var withContextToExpandPanelProps = function (Component) {
+    return function WithContextToExpandPanelProps(_a) {
+        var ctx = _a.ctx, props = _a.props;
+        var dispatchProps = ctxDispatchToExpandPanelProps(ctx.dispatch);
+        var childLabelProp = props.childLabelProp, schema = props.schema, path = props.path, index = props.index, uischemas = props.uischemas;
+        var childPath = core.composePaths(path, "" + index);
+        var childData = core.Resolve.data(ctx.core.data, childPath);
+        var childLabel = childLabelProp
+            ? get__default["default"](childData, childLabelProp, '')
+            : get__default["default"](childData, core.getFirstPrimitiveProp(schema), '');
+        return (React__default["default"].createElement(Component, __assign({}, props, dispatchProps, { childLabel: childLabel, childPath: childPath, uischemas: uischemas })));
+    };
+};
+var withJsonFormsExpandPanelProps = function (Component) {
+    return react.withJsonFormsContext(withContextToExpandPanelProps(Component));
 };
+var ExpandPanelRenderer$1 = withJsonFormsExpandPanelProps(ExpandPanelRenderer);
 
 var groupTester = core.rankWith(1, core.uiTypeIs('Group'));
 var style = { marginBottom: '10px' };
-var GroupComponent = React__default["default"].memo(function (_a) {
+var GroupComponent = React__default["default"].memo(function GroupComponent(_a) {
     var visible = _a.visible, enabled = _a.enabled, uischema = _a.uischema, label = _a.label, props = __rest(_a, ["visible", "enabled", "uischema", "label"]);
     var groupLayout = uischema;
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
         React__default["default"].createElement(material.Card, { style: style },
-            !isEmpty__default["default"](label) && (React__default["default"].createElement(material.CardHeader, { title: label })),
+            !isEmpty__default["default"](label) && React__default["default"].createElement(material.CardHeader, { title: label }),
             React__default["default"].createElement(material.CardContent, null,
                 React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, props, { visible: visible, enabled: enabled, elements: groupLayout.elements }))))));
 });
@@ -1173,9 +1278,9 @@ var MaterialHorizontalLayoutRenderer = function (_a) {
         path: path,
         enabled: enabled,
         direction: 'row',
-        visible: visible
+        visible: visible,
     };
-    return React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps, { renderers: renderers, cells: cells }));
+    return (React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps, { renderers: renderers, cells: cells })));
 };
 var MaterialHorizontalLayout = react.withJsonFormsLayoutProps(MaterialHorizontalLayoutRenderer);
 
@@ -1189,9 +1294,9 @@ var MaterialVerticalLayoutRenderer = function (_a) {
         path: path,
         enabled: enabled,
         direction: 'column',
-        visible: visible
+        visible: visible,
     };
-    return React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps, { renderers: renderers, cells: cells }));
+    return (React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps, { renderers: renderers, cells: cells })));
 };
 var MaterialVerticalLayout = react.withJsonFormsLayoutProps(MaterialVerticalLayoutRenderer);
 
@@ -1204,122 +1309,45 @@ var materialCategorizationTester = core.rankWith(1, isSingleLevelCategorization)
 var MaterialCategorizationLayoutRenderer = function (props) {
     var data = props.data, path = props.path, renderers = props.renderers, cells = props.cells, schema = props.schema, uischema = props.uischema, visible = props.visible, enabled = props.enabled, selected = props.selected, onChange = props.onChange, ajv = props.ajv, t = props.t;
     var categorization = uischema;
-    var _a = React.useState(selected !== null && selected !== void 0 ? selected : 0), activeCategory = _a[0], setActiveCategory = _a[1];
-    var categories = React.useMemo(function () { return categorization.elements.filter(function (category) {
-        return core.isVisible(category, data, undefined, ajv);
-    }); }, [categorization, data, ajv]);
+    var _a = React.useState(uischema), previousCategorization = _a[0], setPreviousCategorization = _a[1];
+    var _b = React.useState(selected !== null && selected !== void 0 ? selected : 0), activeCategory = _b[0], setActiveCategory = _b[1];
+    var categories = React.useMemo(function () {
+        return categorization.elements.filter(function (category) {
+            return core.isVisible(category, data, undefined, ajv);
+        });
+    }, [categorization, data, ajv]);
+    if (categorization !== previousCategorization) {
+        setActiveCategory(0);
+        setPreviousCategorization(categorization);
+    }
+    var safeCategory = activeCategory >= categorization.elements.length ? 0 : activeCategory;
     var childProps = {
-        elements: categories[activeCategory].elements,
+        elements: categories[safeCategory] ? categories[safeCategory].elements : [],
         schema: schema,
         path: path,
         direction: 'column',
         enabled: enabled,
         visible: visible,
         renderers: renderers,
-        cells: cells
+        cells: cells,
     };
     var onTabChange = function (_event, value) {
         if (onChange) {
-            onChange(value, activeCategory);
+            onChange(value, safeCategory);
         }
         setActiveCategory(value);
     };
     var tabLabels = React.useMemo(function () {
-        return categories.map(function (e) {
-            return core.deriveLabelForUISchemaElement(e, t);
-        });
+        return categories.map(function (e) { return core.deriveLabelForUISchemaElement(e, t); });
     }, [categories, t]);
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
         React__default["default"].createElement(material.AppBar, { position: 'static' },
-            React__default["default"].createElement(material.Tabs, { value: activeCategory, onChange: onTabChange, textColor: 'inherit', indicatorColor: 'secondary', variant: 'scrollable' }, categories.map(function (_, idx) { return (React__default["default"].createElement(material.Tab, { key: idx, label: tabLabels[idx] })); }))),
+            React__default["default"].createElement(material.Tabs, { value: safeCategory, onChange: onTabChange, textColor: 'inherit', indicatorColor: 'secondary', variant: 'scrollable' }, categories.map(function (_, idx) { return (React__default["default"].createElement(material.Tab, { key: idx, label: tabLabels[idx] })); }))),
         React__default["default"].createElement("div", { style: { marginTop: '0.5em' } },
-            React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps)))));
+            React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps, { key: safeCategory })))));
 };
 var MaterialCategorizationLayout = withAjvProps(react.withTranslateProps(react.withJsonFormsLayoutProps(MaterialCategorizationLayoutRenderer)));
 
-var iconStyle = { float: 'right' };
-var ExpandPanelRendererComponent = function (props) {
-    var labelHtmlId = React.useState(core.createId('expand-panel'))[0];
-    React.useEffect(function () {
-        return function () {
-            core.removeId(labelHtmlId);
-        };
-    }, [labelHtmlId]);
-    var enabled = props.enabled, childLabel = props.childLabel, childPath = props.childPath, index = props.index, expanded = props.expanded, moveDown = props.moveDown, moveUp = props.moveUp, enableMoveDown = props.enableMoveDown, enableMoveUp = props.enableMoveUp, handleExpansion = props.handleExpansion, removeItems = props.removeItems, path = props.path, rootSchema = props.rootSchema, schema = props.schema, uischema = props.uischema, uischemas = props.uischemas, renderers = props.renderers, cells = props.cells, config = props.config;
-    var foundUISchema = React.useMemo(function () {
-        return core.findUISchema(uischemas, schema, uischema.scope, path, undefined, uischema, rootSchema);
-    }, [uischemas, schema, uischema.scope, path, uischema, rootSchema]);
-    var appliedUiSchemaOptions = merge__default["default"]({}, config, uischema.options);
-    var showSortButtons = appliedUiSchemaOptions.showSortButtons || appliedUiSchemaOptions.showArrayLayoutSortButtons;
-    return (React__default["default"].createElement(material.Accordion, { "aria-labelledby": labelHtmlId, expanded: expanded, onChange: handleExpansion(childPath) },
-        React__default["default"].createElement(material.AccordionSummary, { expandIcon: React__default["default"].createElement(ExpandMoreIcon__default["default"], null) },
-            React__default["default"].createElement(material.Grid, { container: true, alignItems: 'center' },
-                React__default["default"].createElement(material.Grid, { item: true, xs: 7, md: 9 },
-                    React__default["default"].createElement(material.Grid, { container: true, alignItems: 'center' },
-                        React__default["default"].createElement(material.Grid, { item: true, xs: 2, md: 1 },
-                            React__default["default"].createElement(material.Avatar, { "aria-label": 'Index' }, index + 1)),
-                        React__default["default"].createElement(material.Grid, { item: true, xs: 10, md: 11 },
-                            React__default["default"].createElement("span", { id: labelHtmlId }, childLabel)))),
-                React__default["default"].createElement(material.Grid, { item: true, xs: 5, md: 3 },
-                    React__default["default"].createElement(material.Grid, { container: true, justifyContent: 'flex-end' },
-                        React__default["default"].createElement(material.Grid, { item: true },
-                            React__default["default"].createElement(material.Grid, { container: true, direction: 'row', justifyContent: 'center', alignItems: 'center' },
-                                showSortButtons ? (React__default["default"].createElement(React.Fragment, null,
-                                    React__default["default"].createElement(material.Grid, { item: true },
-                                        React__default["default"].createElement(material.IconButton, { onClick: moveUp(path, index), style: iconStyle, disabled: !enableMoveUp, "aria-label": "Move up", size: 'large' },
-                                            React__default["default"].createElement(ArrowUpward__default["default"], null))),
-                                    React__default["default"].createElement(material.Grid, { item: true },
-                                        React__default["default"].createElement(material.IconButton, { onClick: moveDown(path, index), style: iconStyle, disabled: !enableMoveDown, "aria-label": "Move down", size: 'large' },
-                                            React__default["default"].createElement(ArrowDownward__default["default"], null))))) : (''),
-                                React__default["default"].createElement(material.Grid, { item: true },
-                                    React__default["default"].createElement(material.IconButton, { onClick: removeItems(path, [index]), style: iconStyle, "aria-label": "Delete", size: 'large' },
-                                        React__default["default"].createElement(DeleteIcon__default["default"], null))))))))),
-        React__default["default"].createElement(material.AccordionDetails, null,
-            React__default["default"].createElement(react.JsonFormsDispatch, { enabled: enabled, schema: schema, uischema: foundUISchema, path: childPath, key: childPath, renderers: renderers, cells: cells }))));
-};
-var ExpandPanelRenderer = React__default["default"].memo(ExpandPanelRendererComponent);
-var ctxDispatchToExpandPanelProps = function (dispatch) { return ({
-    removeItems: React.useCallback(function (path, toDelete) { return function (event) {
-        event.stopPropagation();
-        dispatch(core.update(path, function (array) {
-            toDelete
-                .sort()
-                .reverse()
-                .forEach(function (s) { return array.splice(s, 1); });
-            return array;
-        }));
-    }; }, [dispatch]),
-    moveUp: React.useCallback(function (path, toMove) { return function (event) {
-        event.stopPropagation();
-        dispatch(core.update(path, function (array) {
-            core.moveUp(array, toMove);
-            return array;
-        }));
-    }; }, [dispatch]),
-    moveDown: React.useCallback(function (path, toMove) { return function (event) {
-        event.stopPropagation();
-        dispatch(core.update(path, function (array) {
-            core.moveDown(array, toMove);
-            return array;
-        }));
-    }; }, [dispatch])
-}); };
-var withContextToExpandPanelProps = function (Component) { return function (_a) {
-    var ctx = _a.ctx, props = _a.props;
-    var dispatchProps = ctxDispatchToExpandPanelProps(ctx.dispatch);
-    var childLabelProp = props.childLabelProp, schema = props.schema, path = props.path, index = props.index, uischemas = props.uischemas;
-    var childPath = core.composePaths(path, "" + index);
-    var childData = core.Resolve.data(ctx.core.data, childPath);
-    var childLabel = childLabelProp
-        ? get__default["default"](childData, childLabelProp, '')
-        : get__default["default"](childData, core.getFirstPrimitiveProp(schema), '');
-    return (React__default["default"].createElement(Component, __assign({}, props, dispatchProps, { childLabel: childLabel, childPath: childPath, uischemas: uischemas })));
-}; };
-var withJsonFormsExpandPanelProps = function (Component) {
-    return react.withJsonFormsContext(withContextToExpandPanelProps(Component));
-};
-var ExpandPanelRenderer$1 = withJsonFormsExpandPanelProps(ExpandPanelRenderer);
-
 var MaterialArrayLayoutComponent = function (props) {
     var _a = React.useState(false), expanded = _a[0], setExpanded = _a[1];
     var innerCreateDefaultValue = React.useCallback(function () { return core.createDefaultValue(props.schema); }, [props.schema]);
@@ -1329,21 +1357,19 @@ var MaterialArrayLayoutComponent = function (props) {
     var isExpanded = function (index) {
         return expanded === core.composePaths(props.path, "" + index);
     };
-    var enabled = props.enabled, data = props.data, path = props.path, schema = props.schema, uischema = props.uischema, errors = props.errors, addItem = props.addItem, renderers = props.renderers, cells = props.cells, label = props.label, required = props.required, rootSchema = props.rootSchema, config = props.config, uischemas = props.uischemas;
+    var enabled = props.enabled, data = props.data, path = props.path, schema = props.schema, uischema = props.uischema, errors = props.errors, addItem = props.addItem, renderers = props.renderers, cells = props.cells, label = props.label, required = props.required, rootSchema = props.rootSchema, config = props.config, uischemas = props.uischemas, translations = props.translations;
     var appliedUiSchemaOptions = merge__default["default"]({}, config, props.uischema.options);
     return (React__default["default"].createElement("div", null,
-        React__default["default"].createElement(ArrayLayoutToolbar, { label: core.computeLabel(label, required, appliedUiSchemaOptions.hideRequiredAsterisk), errors: errors, path: path, addItem: addItem, createDefault: innerCreateDefaultValue }),
+        React__default["default"].createElement(ArrayLayoutToolbar, { translations: translations, label: core.computeLabel(label, required, appliedUiSchemaOptions.hideRequiredAsterisk), errors: errors, path: path, addItem: addItem, createDefault: innerCreateDefaultValue }),
         React__default["default"].createElement("div", null, data > 0 ? (map__default["default"](range__default["default"](data), function (index) {
-            return (React__default["default"].createElement(ExpandPanelRenderer$1, { enabled: enabled, index: index, expanded: isExpanded(index), schema: schema, path: path, handleExpansion: handleChange, uischema: uischema, renderers: renderers, cells: cells, key: index, rootSchema: rootSchema, enableMoveUp: index != 0, enableMoveDown: index < data - 1, config: config, childLabelProp: appliedUiSchemaOptions.elementLabelProp, uischemas: uischemas }));
+            return (React__default["default"].createElement(ExpandPanelRenderer$1, { enabled: enabled, index: index, expanded: isExpanded(index), schema: schema, path: path, handleExpansion: handleChange, uischema: uischema, renderers: renderers, cells: cells, key: index, rootSchema: rootSchema, enableMoveUp: index != 0, enableMoveDown: index < data - 1, config: config, childLabelProp: appliedUiSchemaOptions.elementLabelProp, uischemas: uischemas, translations: translations }));
         })) : (React__default["default"].createElement("p", null, "No data")))));
 };
 var MaterialArrayLayout$1 = React__default["default"].memo(MaterialArrayLayoutComponent);
 
 var MaterialArrayLayoutRenderer = function (_a) {
     var visible = _a.visible, addItem = _a.addItem, props = __rest(_a, ["visible", "addItem"]);
-    var addItemCb = React.useCallback(function (p, value) { return addItem(p, value); }, [
-        addItem
-    ]);
+    var addItemCb = React.useCallback(function (p, value) { return addItem(p, value); }, [addItem]);
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
         React__default["default"].createElement(MaterialArrayLayout$1, __assign({ visible: visible, addItem: addItemCb }, props))));
 };
@@ -1370,7 +1396,7 @@ var MaterialDateCell = function (props) {
 var materialDateCellTester = core.rankWith(2, core.isDateControl);
 var MaterialDateCell$1 = react.withJsonFormsCellProps(MaterialDateCell);
 
-var MaterialEnumCell = function (props) { return (React__default["default"].createElement(MuiSelect, __assign({}, props))); };
+var MaterialEnumCell = function (props) { return React__default["default"].createElement(MuiSelect, __assign({}, props)); };
 var materialEnumCellTester = core.rankWith(2, core.isEnumControl);
 var MaterialEnumCell$1 = react.withJsonFormsEnumCellProps(react.withTranslateProps(React__default["default"].memo(MaterialEnumCell)), false);
 
@@ -1386,7 +1412,7 @@ var MaterialNumberFormatCell = function (props) { return React__default["default
 var materialNumberFormatCellTester = core.rankWith(4, core.isNumberFormatControl);
 var MaterialNumberFormatCell$1 = react.withJsonFormsCellProps(MaterialNumberFormatCell);
 
-var MaterialOneOfEnumCell = function (props) { return (React__default["default"].createElement(MuiSelect, __assign({}, props))); };
+var MaterialOneOfEnumCell = function (props) { return React__default["default"].createElement(MuiSelect, __assign({}, props)); };
 var materialOneOfEnumCellTester = core.rankWith(2, core.isOneOfEnumControl);
 var MaterialOneOfEnumCell$1 = react.withJsonFormsOneOfEnumCellProps(react.withTranslateProps(React__default["default"].memo(MaterialOneOfEnumCell)), false);
 
@@ -1423,17 +1449,19 @@ var MaterialCategorizationStepperLayoutRenderer = function (props) {
     var buttonWrapperStyle = {
         textAlign: 'right',
         width: '100%',
-        margin: '1em auto'
+        margin: '1em auto',
     };
     var buttonNextStyle = {
-        float: 'right'
+        float: 'right',
     };
     var buttonStyle = {
-        marginRight: '1em'
+        marginRight: '1em',
     };
-    var categories = React.useMemo(function () { return categorization.elements.filter(function (category) {
-        return core.isVisible(category, data, undefined, ajv);
-    }); }, [categorization, data, ajv]);
+    var categories = React.useMemo(function () {
+        return categorization.elements.filter(function (category) {
+            return core.isVisible(category, data, undefined, ajv);
+        });
+    }, [categorization, data, ajv]);
     var childProps = {
         elements: categories[activeCategory].elements,
         schema: schema,
@@ -1441,31 +1469,73 @@ var MaterialCategorizationStepperLayoutRenderer = function (props) {
         direction: 'column',
         visible: visible,
         renderers: renderers,
-        cells: cells
+        cells: cells,
     };
     var tabLabels = React.useMemo(function () {
-        return categories.map(function (e) {
-            return core.deriveLabelForUISchemaElement(e, t);
-        });
+        return categories.map(function (e) { return core.deriveLabelForUISchemaElement(e, t); });
     }, [categories, t]);
     return (React__default["default"].createElement(material.Hidden, { xsUp: !visible },
         React__default["default"].createElement(material.Stepper, { activeStep: activeCategory, nonLinear: true }, categories.map(function (_, idx) { return (React__default["default"].createElement(material.Step, { key: tabLabels[idx] },
             React__default["default"].createElement(material.StepButton, { onClick: function () { return handleStep(idx); } }, tabLabels[idx]))); })),
         React__default["default"].createElement("div", null,
             React__default["default"].createElement(MaterialLayoutRenderer, __assign({}, childProps))),
-        !!appliedUiSchemaOptions.showNavButtons ? (React__default["default"].createElement("div", { style: buttonWrapperStyle },
-            React__default["default"].createElement(material.Button, { style: buttonNextStyle, variant: "contained", color: "primary", disabled: activeCategory >= categories.length - 1, onClick: function () { return handleStep(activeCategory + 1); } }, "Next"),
-            React__default["default"].createElement(material.Button, { style: buttonStyle, color: "secondary", variant: "contained", disabled: activeCategory <= 0, onClick: function () { return handleStep(activeCategory - 1); } }, "Previous"))) : (React__default["default"].createElement(React__default["default"].Fragment, null))));
+        appliedUiSchemaOptions.showNavButtons ? (React__default["default"].createElement("div", { style: buttonWrapperStyle },
+            React__default["default"].createElement(material.Button, { style: buttonNextStyle, variant: 'contained', color: 'primary', disabled: activeCategory >= categories.length - 1, onClick: function () { return handleStep(activeCategory + 1); } }, "Next"),
+            React__default["default"].createElement(material.Button, { style: buttonStyle, color: 'secondary', variant: 'contained', disabled: activeCategory <= 0, onClick: function () { return handleStep(activeCategory - 1); } }, "Previous"))) : (React__default["default"].createElement(React__default["default"].Fragment, null))));
 };
 var MaterialCategorizationStepperLayout = withAjvProps(react.withTranslateProps(react.withJsonFormsLayoutProps(MaterialCategorizationStepperLayoutRenderer)));
 
+var UnwrappedAdditional = {
+    MaterialLabelRenderer: MaterialLabelRenderer,
+    MaterialListWithDetailRenderer: MaterialListWithDetailRenderer,
+};
+
+var UnwrappedComplex = {
+    MaterialAllOfRenderer: MaterialAllOfRenderer,
+    MaterialAnyOfRenderer: MaterialAnyOfRenderer,
+    MaterialArrayControlRenderer: MaterialArrayControlRenderer,
+    MaterialEnumArrayRenderer: MaterialEnumArrayRenderer,
+    MaterialObjectRenderer: MaterialObjectRenderer,
+    MaterialOneOfRenderer: MaterialOneOfRenderer,
+};
+
+var UnwrappedControls = {
+    MaterialAnyOfStringOrEnumControl: MaterialAnyOfStringOrEnumControl,
+    MaterialBooleanControl: MaterialBooleanControl,
+    MaterialBooleanToggleControl: MaterialBooleanToggleControl,
+    MaterialDateControl: MaterialDateControl,
+    MaterialDateTimeControl: MaterialDateTimeControl,
+    MaterialEnumControl: MaterialEnumControl,
+    MaterialIntegerControl: MaterialIntegerControl,
+    MaterialNativeControl: MaterialNativeControl,
+    MaterialNumberControl: MaterialNumberControl,
+    MaterialOneOfEnumControl: MaterialOneOfEnumControl,
+    MaterialOneOfRadioGroupControl: MaterialOneOfRadioGroupControl,
+    MaterialSliderControl: MaterialSliderControl,
+    MaterialRadioGroupControl: MaterialRadioGroupControl,
+    MaterialTextControl: MaterialTextControl,
+    MaterialTimeControl: MaterialTimeControl,
+};
+
+var UnwrappedLayouts = {
+    ExpandPanelRenderer: ExpandPanelRenderer,
+    MaterialArrayLayout: MaterialArrayLayoutRenderer,
+    MaterialCategorizationLayout: MaterialCategorizationLayoutRenderer,
+    MaterialGroupLayout: MaterializedGroupLayoutRenderer,
+    MaterialHorizontalLayout: MaterialHorizontalLayoutRenderer,
+    MaterialVerticalLayout: MaterialVerticalLayoutRenderer,
+};
+
 var materialRenderers = [
     {
         tester: materialArrayControlTester,
-        renderer: MaterialArrayControlRenderer$1
+        renderer: MaterialArrayControlRenderer$1,
     },
     { tester: materialBooleanControlTester, renderer: MaterialBooleanControl$1 },
-    { tester: materialBooleanToggleControlTester, renderer: MaterialBooleanToggleControl$1 },
+    {
+        tester: materialBooleanToggleControlTester,
+        renderer: MaterialBooleanToggleControl$1,
+    },
     { tester: materialNativeControlTester, renderer: MaterialNativeControl$1 },
     { tester: materialEnumControlTester, renderer: MaterialEnumControl$1 },
     { tester: materialIntegerControlTester, renderer: MaterialIntegerControl$1 },
@@ -1481,41 +1551,44 @@ var materialRenderers = [
     { tester: materialOneOfControlTester, renderer: MaterialOneOfRenderer$1 },
     {
         tester: materialRadioGroupControlTester,
-        renderer: MaterialRadioGroupControl$1
+        renderer: MaterialRadioGroupControl$1,
     },
     {
         tester: materialOneOfRadioGroupControlTester,
-        renderer: MaterialOneOfRadioGroupControl$1
+        renderer: MaterialOneOfRadioGroupControl$1,
+    },
+    {
+        tester: materialOneOfEnumControlTester,
+        renderer: MaterialOneOfEnumControl$1,
     },
-    { tester: materialOneOfEnumControlTester, renderer: MaterialOneOfEnumControl$1 },
     { tester: materialGroupTester, renderer: MaterialGroupLayout },
     {
         tester: materialHorizontalLayoutTester,
-        renderer: MaterialHorizontalLayout
+        renderer: MaterialHorizontalLayout,
     },
     { tester: materialVerticalLayoutTester, renderer: MaterialVerticalLayout },
     {
         tester: materialCategorizationTester,
-        renderer: MaterialCategorizationLayout
+        renderer: MaterialCategorizationLayout,
     },
     {
         tester: materialCategorizationStepperTester,
-        renderer: MaterialCategorizationStepperLayout
+        renderer: MaterialCategorizationStepperLayout,
     },
     { tester: materialArrayLayoutTester, renderer: MaterialArrayLayout },
     { tester: materialLabelRendererTester, renderer: MaterialLabelRenderer$1 },
     {
         tester: materialListWithDetailTester,
-        renderer: MaterialListWithDetailRenderer$1
+        renderer: MaterialListWithDetailRenderer$1,
     },
     {
         tester: materialAnyOfStringOrEnumControlTester,
-        renderer: MaterialAnyOfStringOrEnumControl$1
+        renderer: MaterialAnyOfStringOrEnumControl$1,
     },
     {
         tester: materialEnumArrayRendererTester,
-        renderer: MaterialEnumArrayRenderer$1
-    }
+        renderer: MaterialEnumArrayRenderer$1,
+    },
 ];
 var materialCells = [
     { tester: materialBooleanCellTester, cell: MaterialBooleanCell$1 },
@@ -1527,10 +1600,16 @@ var materialCells = [
     { tester: materialNumberFormatCellTester, cell: MaterialNumberFormatCell$1 },
     { tester: materialOneOfEnumCellTester, cell: MaterialOneOfEnumCell$1 },
     { tester: materialTextCellTester, cell: MaterialTextCell$1 },
-    { tester: materialTimeCellTester, cell: MaterialTimeCell$1 }
+    { tester: materialTimeCellTester, cell: MaterialTimeCell$1 },
 ];
+var Unwrapped = __assign(__assign(__assign(__assign({}, UnwrappedAdditional), UnwrappedComplex), UnwrappedControls), UnwrappedLayouts);
 
+exports.ArrayLayoutToolbar = ArrayLayoutToolbar;
+exports.CombinatorProperties = CombinatorProperties;
 exports.Customizable = CustomizableCells;
+exports.DeleteDialog = DeleteDialog;
+exports.ExpandPanelRenderer = ExpandPanelRenderer$1;
+exports.ListWithDetailMasterItem = ListWithDetailMasterItem;
 exports.MaterialAllOfRenderer = MaterialAllOfRenderer$1;
 exports.MaterialAnyOfRenderer = MaterialAnyOfRenderer$1;
 exports.MaterialAnyOfStringOrEnumControl = MaterialAnyOfStringOrEnumControl$1;
@@ -1552,7 +1631,9 @@ exports.MaterialHorizontalLayout = MaterialHorizontalLayout;
 exports.MaterialInputControl = MaterialInputControl;
 exports.MaterialIntegerCell = MaterialIntegerCell$1;
 exports.MaterialIntegerControl = MaterialIntegerControl$1;
+exports.MaterialLabelRenderer = MaterialLabelRenderer$1;
 exports.MaterialLayoutRenderer = MaterialLayoutRenderer;
+exports.MaterialListWithDetailRenderer = MaterialListWithDetailRenderer$1;
 exports.MaterialNativeControl = MaterialNativeControl$1;
 exports.MaterialNumberCell = MaterialNumberCell$1;
 exports.MaterialNumberControl = MaterialNumberControl$1;
@@ -1564,11 +1645,13 @@ exports.MaterialOneOfRadioGroupControl = MaterialOneOfRadioGroupControl$1;
 exports.MaterialOneOfRenderer = MaterialOneOfRenderer$1;
 exports.MaterialRadioGroupControl = MaterialRadioGroupControl$1;
 exports.MaterialSliderControl = MaterialSliderControl$1;
+exports.MaterialTableControl = MaterialTableControl;
 exports.MaterialTextCell = MaterialTextCell$1;
 exports.MaterialTextControl = MaterialTextControl$1;
 exports.MaterialTimeCell = MaterialTimeCell$1;
 exports.MaterialTimeControl = MaterialTimeControl$1;
 exports.MaterialVerticalLayout = MaterialVerticalLayout;
+exports.MuiAutocomplete = MuiAutocomplete;
 exports.MuiCheckbox = MuiCheckbox;
 exports.MuiInputInteger = MuiInputInteger;
 exports.MuiInputNumber = MuiInputNumber;
@@ -1576,9 +1659,13 @@ exports.MuiInputNumberFormat = MuiInputNumberFormat;
 exports.MuiInputText = MuiInputText;
 exports.MuiInputTime = MuiInputTime;
 exports.MuiSelect = MuiSelect;
+exports.MuiToggle = MuiToggle;
+exports.NoBorderTableCell = NoBorderTableCell;
+exports.NonEmptyRow = NonEmptyRow;
 exports.ResettableTextField = ResettableTextField;
 exports.Unwrapped = Unwrapped;
 exports.createOnChangeHandler = createOnChangeHandler;
+exports.ctxDispatchToExpandPanelProps = ctxDispatchToExpandPanelProps;
 exports.getData = getData;
 exports.i18nDefaults = i18nDefaults;
 exports.materialAllOfControlTester = materialAllOfControlTester;
@@ -1602,6 +1689,8 @@ exports.materialGroupTester = materialGroupTester;
 exports.materialHorizontalLayoutTester = materialHorizontalLayoutTester;
 exports.materialIntegerCellTester = materialIntegerCellTester;
 exports.materialIntegerControlTester = materialIntegerControlTester;
+exports.materialLabelRendererTester = materialLabelRendererTester;
+exports.materialListWithDetailTester = materialListWithDetailTester;
 exports.materialNativeControlTester = materialNativeControlTester;
 exports.materialNumberCellTester = materialNumberCellTester;
 exports.materialNumberControlTester = materialNumberControlTester;
@@ -1623,4 +1712,6 @@ exports.renderLayoutElements = renderLayoutElements;
 exports.useDebouncedChange = useDebouncedChange;
 exports.useFocus = useFocus;
 exports.withAjvProps = withAjvProps;
+exports.withContextToExpandPanelProps = withContextToExpandPanelProps;
+exports.withJsonFormsExpandPanelProps = withJsonFormsExpandPanelProps;
 //# sourceMappingURL=jsonforms-react-material.cjs.js.map