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

package/src/controls/MaterialOneOfRadioGroupControl.tsx

@@ -24,7 +24,7 @@
 */
 import React from 'react';
 import {
-    and,
+  and,
   ControlProps,
   isOneOfEnumControl,
   optionIs,
@@ -35,8 +35,10 @@ import {
 import { withJsonFormsOneOfEnumProps } from '@jsonforms/react';
 import { MaterialRadioGroup } from './MaterialRadioGroup';
 
-export const MaterialOneOfRadioGroupControl = (props: ControlProps & OwnPropsOfEnum) => {
-  return <MaterialRadioGroup {...props}/>;
+export const MaterialOneOfRadioGroupControl = (
+  props: ControlProps & OwnPropsOfEnum
+) => {
+  return <MaterialRadioGroup {...props} />;
 };
 
 export const materialOneOfRadioGroupControlTester: RankedTester = rankWith(

package/src/controls/MaterialRadioGroup.tsx

@@ -28,7 +28,7 @@ import {
   ControlProps,
   showAsRequired,
   isDescriptionHidden,
-  OwnPropsOfEnum
+  OwnPropsOfEnum,
 } from '@jsonforms/core';
 import {
   FormControl,
@@ -37,7 +37,7 @@ import {
   FormLabel,
   Hidden,
   Radio,
-  RadioGroup
+  RadioGroup,
 } from '@mui/material';
 import { useFocus } from '../util';
 
@@ -55,21 +55,17 @@ export const MaterialRadioGroup = (props: ControlProps & OwnPropsOfEnum) => {
     options,
     handleChange,
     path,
-    enabled
+    enabled,
   } = props;
   const isValid = errors.length === 0;
-  const appliedUiSchemaOptions = merge(
-    {},
-    config,
-    props.uischema.options
-  );
+  const appliedUiSchemaOptions = merge({}, config, props.uischema.options);
   const showDescription = !isDescriptionHidden(
     visible,
     description,
     focused,
     appliedUiSchemaOptions.showUnfocusedDescription
   );
-  const onChange = (_ev:any, value:any) => handleChange(path, value);
+  const onChange = (_ev: any, value: any) => handleChange(path, value);
 
   return (
     <Hidden xsUp={!visible}>
@@ -83,18 +79,16 @@ export const MaterialRadioGroup = (props: ControlProps & OwnPropsOfEnum) => {
           htmlFor={id}
           error={!isValid}
           component={'legend' as 'label'}
-          required={showAsRequired(required,
-            appliedUiSchemaOptions.hideRequiredAsterisk)}
+          required={showAsRequired(
+            required,
+            appliedUiSchemaOptions.hideRequiredAsterisk
+          )}
         >
           {label}
         </FormLabel>
 
-        <RadioGroup
-          value={props.data ?? ''}
-          onChange={onChange}
-          row={true}
-        >
-          {options.map(option => (
+        <RadioGroup value={props.data ?? ''} onChange={onChange} row={true}>
+          {options.map((option) => (
             <FormControlLabel
               value={option.value}
               key={option.label}

package/src/controls/MaterialRadioGroupControl.tsx

@@ -27,11 +27,16 @@ import {
   and,
   ControlProps,
   isEnumControl,
-  optionIs, OwnPropsOfEnum, RankedTester, rankWith
+  optionIs,
+  OwnPropsOfEnum,
+  RankedTester,
+  rankWith,
 } from '@jsonforms/core';
-import {  withJsonFormsEnumProps } from '@jsonforms/react';
+import { withJsonFormsEnumProps } from '@jsonforms/react';
 import { MaterialRadioGroup } from './MaterialRadioGroup';
-export const MaterialRadioGroupControl = (props: ControlProps & OwnPropsOfEnum) => {
+export const MaterialRadioGroupControl = (
+  props: ControlProps & OwnPropsOfEnum
+) => {
   return <MaterialRadioGroup {...props} />;
 };
 

package/src/controls/MaterialSliderControl.tsx

@@ -22,14 +22,14 @@
   OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
   THE SOFTWARE.
 */
-import React, {useCallback} from 'react';
+import React, { useCallback } from 'react';
 import {
   ControlProps,
   showAsRequired,
   isDescriptionHidden,
   isRangeControl,
   RankedTester,
-  rankWith
+  rankWith,
 } from '@jsonforms/core';
 import { withJsonFormsControlProps } from '@jsonforms/react';
 
@@ -39,7 +39,7 @@ import {
   FormLabel,
   Hidden,
   Slider,
-  Typography
+  Typography,
 } from '@mui/material';
 import merge from 'lodash/merge';
 import { useFocus } from '../util';
@@ -58,28 +58,24 @@ export const MaterialSliderControl = (props: ControlProps) => {
     visible,
     path,
     required,
-    config
+    config,
   } = props;
   const isValid = errors.length === 0;
-  const appliedUiSchemaOptions = merge(
-    {},
-    config,
-    props.uischema.options
-  );
+  const appliedUiSchemaOptions = merge({}, config, props.uischema.options);
   const labelStyle: { [x: string]: any } = {
     whiteSpace: 'nowrap',
     overflow: 'hidden',
     textOverflow: 'ellipsis',
-    width: '100%'
+    width: '100%',
   };
   const rangeContainerStyle: { [x: string]: any } = {
-    display: 'flex'
+    display: 'flex',
   };
   const rangeItemStyle: { [x: string]: any } = {
-    flexGrow: '1'
+    flexGrow: '1',
   };
   const sliderStyle: { [x: string]: any } = {
-    marginTop: '7px'
+    marginTop: '7px',
   };
 
   const showDescription = !isDescriptionHidden(
@@ -89,7 +85,10 @@ export const MaterialSliderControl = (props: ControlProps) => {
     appliedUiSchemaOptions.showUnfocusedDescription
   );
 
-  const onChange = useCallback((_ev: any, value: any) => handleChange(path, Number(value)), [path, handleChange]);
+  const onChange = useCallback(
+    (_ev: any, value: any) => handleChange(path, Number(value)),
+    [path, handleChange]
+  );
 
   return (
     <Hidden xsUp={!visible}>
@@ -103,8 +102,10 @@ export const MaterialSliderControl = (props: ControlProps) => {
           htmlFor={id}
           error={!isValid}
           component={'legend' as 'label'}
-          required={showAsRequired(required,
-            appliedUiSchemaOptions.hideRequiredAsterisk)}
+          required={showAsRequired(
+            required,
+            appliedUiSchemaOptions.hideRequiredAsterisk
+          )}
         >
           <Typography id={id + '-typo'} style={labelStyle} variant='caption'>
             {label}

package/src/controls/MaterialTextControl.tsx

@@ -27,7 +27,7 @@ import {
   ControlProps,
   isStringControl,
   RankedTester,
-  rankWith
+  rankWith,
 } from '@jsonforms/core';
 import { withJsonFormsControlProps } from '@jsonforms/react';
 import { MuiInputText } from '../mui-controls/MuiInputText';

package/src/controls/MaterialTimeControl.tsx

@@ -29,25 +29,22 @@ import {
   isTimeControl,
   isDescriptionHidden,
   RankedTester,
-  rankWith
+  rankWith,
 } from '@jsonforms/core';
 import { withJsonFormsControlProps } from '@jsonforms/react';
 import { FormHelperText, Hidden } from '@mui/material';
-import {
-  TimePicker,
-  LocalizationProvider 
-} from '@mui/x-date-pickers';
+import { TimePicker, LocalizationProvider } from '@mui/x-date-pickers';
 import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
 import {
   createOnChangeHandler,
   getData,
   ResettableTextField,
-  useFocus
+  useFocus,
 } from '../util';
 
 export const MaterialTimeControl = (props: ControlProps) => {
   const [focused, onFocus, onBlur] = useFocus();
-    const {
+  const {
     id,
     description,
     errors,
@@ -59,7 +56,7 @@ export const MaterialTimeControl = (props: ControlProps) => {
     path,
     handleChange,
     data,
-    config
+    config,
   } = props;
   const appliedUiSchemaOptions = merge({}, config, uischema.options);
   const isValid = errors.length === 0;
@@ -83,11 +80,10 @@ export const MaterialTimeControl = (props: ControlProps) => {
     : null;
   const secondFormHelperText = showDescription && !isValid ? errors : null;
 
-  const onChange = useMemo(() => createOnChangeHandler(
-    path,
-    handleChange,
-    saveFormat
-  ),[path, handleChange, saveFormat]);
+  const onChange = useMemo(
+    () => createOnChangeHandler(path, handleChange, saveFormat),
+    [path, handleChange, saveFormat]
+  );
 
   const value = getData(data, saveFormat);
   const valueInInputFormat = value ? value.format(format) : '';
@@ -106,24 +102,27 @@ export const MaterialTimeControl = (props: ControlProps) => {
           disabled={!enabled}
           componentsProps={{
             actionBar: {
-              actions: (variant) => (variant === 'desktop' ? [] : ['clear', 'cancel', 'accept'])
-            }
+              actions: (variant) =>
+                variant === 'desktop' ? [] : ['clear', 'cancel', 'accept'],
+            },
           }}
-          renderInput={params => (
-            <ResettableTextField 
+          renderInput={(params) => (
+            <ResettableTextField
               {...params}
               rawValue={data}
               dayjsValueIsValid={value !== null}
               valueInInputFormat={valueInInputFormat}
               focused={focused}
               id={id + '-input'}
-              required={required && !appliedUiSchemaOptions.hideRequiredAsterisk}
+              required={
+                required && !appliedUiSchemaOptions.hideRequiredAsterisk
+              }
               autoFocus={appliedUiSchemaOptions.focus}
               error={!isValid}
               fullWidth={!appliedUiSchemaOptions.trim}
               inputProps={{
                 ...params.inputProps,
-                type: 'text'
+                type: 'text',
               }}
               InputLabelProps={data ? { shrink: true } : undefined}
               onFocus={onFocus}
@@ -135,9 +134,7 @@ export const MaterialTimeControl = (props: ControlProps) => {
         <FormHelperText error={!isValid && !showDescription}>
           {firstFormHelperText}
         </FormHelperText>
-        <FormHelperText error={!isValid}>
-          {secondFormHelperText}
-        </FormHelperText>
+        <FormHelperText error={!isValid}>{secondFormHelperText}</FormHelperText>
       </LocalizationProvider>
     </Hidden>
   );

package/src/controls/index.ts

@@ -22,119 +22,83 @@
   OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
   THE SOFTWARE.
 */
+import MaterialAnyOfStringOrEnumControl, {
+  materialAnyOfStringOrEnumControlTester,
+} from './MaterialAnyOfStringOrEnumControl';
 import MaterialBooleanControl, {
   materialBooleanControlTester,
-  MaterialBooleanControl as MaterialBooleanControlUnwrapped
 } from './MaterialBooleanControl';
 import MaterialBooleanToggleControl, {
   materialBooleanToggleControlTester,
-  MaterialBooleanToggleControl as MaterialBooleanToggleControlUnwrapped
 } from './MaterialBooleanToggleControl';
-import MaterialEnumControl, {
-  materialEnumControlTester,
-  MaterialEnumControl as MaterialEnumControlUnwrapped
-} from './MaterialEnumControl';
-import MaterialNativeControl, {
-  materialNativeControlTester,
-  MaterialNativeControl as MaterialNativeControlUnwrapped
-} from './MaterialNativeControl';
 import MaterialDateControl, {
   materialDateControlTester,
-  MaterialDateControl as MaterialDateControlUnwrapped
 } from './MaterialDateControl';
 import MaterialDateTimeControl, {
   materialDateTimeControlTester,
-  MaterialDateTimeControl as MaterialDateTimeControlUnwrapped
 } from './MaterialDateTimeControl';
-import MaterialTimeControl, {
-  materialTimeControlTester,
-  MaterialTimeControl as MaterialTimeControlUnwrapped
-} from './MaterialTimeControl';
-import MaterialSliderControl, {
-  materialSliderControlTester,
-  MaterialSliderControl as MaterialSliderControlUnwrapped
-} from './MaterialSliderControl';
-import MaterialRadioGroupControl, {
-  materialRadioGroupControlTester,
-  MaterialRadioGroupControl as MaterialRadioGroupControlUnwrapped
-} from './MaterialRadioGroupControl';
+import MaterialEnumControl, {
+  materialEnumControlTester,
+} from './MaterialEnumControl';
 import MaterialIntegerControl, {
   materialIntegerControlTester,
-  MaterialIntegerControl as MaterialIntegerControlUnwrapped
 } from './MaterialIntegerControl';
+import MaterialNativeControl, {
+  materialNativeControlTester,
+} from './MaterialNativeControl';
 import MaterialNumberControl, {
   materialNumberControlTester,
-  MaterialNumberControl as MaterialNumberControlUnwrapped
 } from './MaterialNumberControl';
-import MaterialTextControl, {
-  materialTextControlTester,
-  MaterialTextControl as MaterialTextControlUnwrapped
-} from './MaterialTextControl';
-
-import MaterialAnyOfStringOrEnumControl, {
-  materialAnyOfStringOrEnumControlTester,
-  MaterialAnyOfStringOrEnumControl as MaterialAnyOfStringOrEnumControlUnwrapped
-} from './MaterialAnyOfStringOrEnumControl';
-
 import MaterialOneOfEnumControl, {
   materialOneOfEnumControlTester,
-  MaterialOneOfEnumControl as MaterialOneOfEnumControlUnwrapped
 } from './MaterialOneOfEnumControl';
-
 import MaterialOneOfRadioGroupControl, {
   materialOneOfRadioGroupControlTester,
-  MaterialOneOfRadioGroupControl as MaterialOneOfRadioGroupControlUnwrapped
 } from './MaterialOneOfRadioGroupControl';
-
-export const Unwrapped = {
-  MaterialBooleanControl: MaterialBooleanControlUnwrapped,
-  MaterialBooleanToggleControl: MaterialBooleanToggleControlUnwrapped,
-  MaterialEnumControl: MaterialEnumControlUnwrapped,
-  MaterialNativeControl: MaterialNativeControlUnwrapped,
-  MaterialDateControl: MaterialDateControlUnwrapped,
-  MaterialDateTimeControl: MaterialDateTimeControlUnwrapped,
-  MaterialTimeControl: MaterialTimeControlUnwrapped,
-  MaterialSliderControl: MaterialSliderControlUnwrapped,
-  MaterialRadioGroupControl: MaterialRadioGroupControlUnwrapped,
-  MaterialIntegerControl: MaterialIntegerControlUnwrapped,
-  MaterialNumberControl: MaterialNumberControlUnwrapped,
-  MaterialTextControl: MaterialTextControlUnwrapped,
-  MaterialAnyOfStringOrEnumControl: MaterialAnyOfStringOrEnumControlUnwrapped,
-  MaterialOneOfEnumControl: MaterialOneOfEnumControlUnwrapped,
-  MaterialOneOfRadioGroupControl: MaterialOneOfRadioGroupControlUnwrapped
-};
+import MaterialRadioGroupControl, {
+  materialRadioGroupControlTester,
+} from './MaterialRadioGroupControl';
+import MaterialSliderControl, {
+  materialSliderControlTester,
+} from './MaterialSliderControl';
+import MaterialTextControl, {
+  materialTextControlTester,
+} from './MaterialTextControl';
+import MaterialTimeControl, {
+  materialTimeControlTester,
+} from './MaterialTimeControl';
 
 export {
+  MaterialAnyOfStringOrEnumControl,
+  materialAnyOfStringOrEnumControlTester,
   MaterialBooleanControl,
   materialBooleanControlTester,
   MaterialBooleanToggleControl,
   materialBooleanToggleControlTester,
-  MaterialEnumControl,
-  materialEnumControlTester,
-  MaterialNativeControl,
-  materialNativeControlTester,
   MaterialDateControl,
   materialDateControlTester,
   MaterialDateTimeControl,
   materialDateTimeControlTester,
-  MaterialTimeControl,
-  materialTimeControlTester,
-  MaterialSliderControl,
-  materialSliderControlTester,
-  MaterialRadioGroupControl,
-  materialRadioGroupControlTester,
+  MaterialEnumControl,
+  materialEnumControlTester,
   MaterialIntegerControl,
   materialIntegerControlTester,
+  MaterialNativeControl,
+  materialNativeControlTester,
   MaterialNumberControl,
   materialNumberControlTester,
-  MaterialTextControl,
-  materialTextControlTester,
-  MaterialAnyOfStringOrEnumControl,
-  materialAnyOfStringOrEnumControlTester,
   MaterialOneOfEnumControl,
   materialOneOfEnumControlTester,
   MaterialOneOfRadioGroupControl,
-  materialOneOfRadioGroupControlTester
+  materialOneOfRadioGroupControlTester,
+  MaterialRadioGroupControl,
+  materialRadioGroupControlTester,
+  MaterialSliderControl,
+  materialSliderControlTester,
+  MaterialTextControl,
+  materialTextControlTester,
+  MaterialTimeControl,
+  materialTimeControlTester,
 };
 
 export * from './MaterialInputControl';

package/src/controls/unwrapped.ts

@@ -0,0 +1,57 @@
+/*
+  The MIT License
+  
+  Copyright (c) 2017-2019 EclipseSource Munich
+  https://github.com/eclipsesource/jsonforms
+  
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+  
+  The above copyright notice and this permission notice shall be included in
+  all copies or substantial portions of the Software.
+  
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+  THE SOFTWARE.
+*/
+import { MaterialAnyOfStringOrEnumControl } from './MaterialAnyOfStringOrEnumControl';
+import { MaterialBooleanControl } from './MaterialBooleanControl';
+import { MaterialBooleanToggleControl } from './MaterialBooleanToggleControl';
+import { MaterialDateControl } from './MaterialDateControl';
+import { MaterialDateTimeControl } from './MaterialDateTimeControl';
+import { MaterialEnumControl } from './MaterialEnumControl';
+import { MaterialIntegerControl } from './MaterialIntegerControl';
+import { MaterialNativeControl } from './MaterialNativeControl';
+import { MaterialNumberControl } from './MaterialNumberControl';
+import { MaterialOneOfEnumControl } from './MaterialOneOfEnumControl';
+import { MaterialOneOfRadioGroupControl } from './MaterialOneOfRadioGroupControl';
+import { MaterialRadioGroupControl } from './MaterialRadioGroupControl';
+import { MaterialSliderControl } from './MaterialSliderControl';
+import { MaterialTextControl } from './MaterialTextControl';
+import { MaterialTimeControl } from './MaterialTimeControl';
+
+export const UnwrappedControls = {
+  MaterialAnyOfStringOrEnumControl,
+  MaterialBooleanControl,
+  MaterialBooleanToggleControl,
+  MaterialDateControl,
+  MaterialDateTimeControl,
+  MaterialEnumControl,
+  MaterialIntegerControl,
+  MaterialNativeControl,
+  MaterialNumberControl,
+  MaterialOneOfEnumControl,
+  MaterialOneOfRadioGroupControl,
+  MaterialSliderControl,
+  MaterialRadioGroupControl,
+  MaterialTextControl,
+  MaterialTimeControl,
+};

package/src/index.ts

@@ -24,7 +24,7 @@
 */
 import {
   JsonFormsCellRendererRegistryEntry,
-  JsonFormsRendererRegistryEntry
+  JsonFormsRendererRegistryEntry,
 } from '@jsonforms/core';
 import {
   materialAllOfControlTester,
@@ -38,13 +38,13 @@ import {
   materialOneOfControlTester,
   MaterialOneOfRenderer,
   MaterialEnumArrayRenderer,
-  materialEnumArrayRendererTester
+  materialEnumArrayRendererTester,
 } from './complex';
 import {
   MaterialLabelRenderer,
   materialLabelRendererTester,
   MaterialListWithDetailRenderer,
-  materialListWithDetailTester
+  materialListWithDetailTester,
 } from './additional';
 import {
   MaterialAnyOfStringOrEnumControl,
@@ -76,7 +76,7 @@ import {
   MaterialTextControl,
   materialTextControlTester,
   MaterialOneOfRadioGroupControl,
-  materialOneOfRadioGroupControlTester
+  materialOneOfRadioGroupControlTester,
 } from './controls';
 import {
   MaterialArrayLayout,
@@ -88,7 +88,7 @@ import {
   MaterialHorizontalLayout,
   materialHorizontalLayoutTester,
   MaterialVerticalLayout,
-  materialVerticalLayoutTester
+  materialVerticalLayoutTester,
 } from './layouts';
 import {
   MaterialBooleanCell,
@@ -110,16 +110,17 @@ import {
   MaterialTextCell,
   materialTextCellTester,
   MaterialTimeCell,
-  materialTimeCellTester
+  materialTimeCellTester,
 } from './cells';
 import MaterialCategorizationStepperLayout, {
-  materialCategorizationStepperTester
+  materialCategorizationStepperTester,
 } from './layouts/MaterialCategorizationStepperLayout';
 
+export * from './additional';
+export * from './cells';
 export * from './complex';
 export * from './controls';
 export * from './layouts';
-export * from './cells';
 export * from './mui-controls';
 export * from './util';
 
@@ -127,10 +128,13 @@ export const materialRenderers: JsonFormsRendererRegistryEntry[] = [
   // controls
   {
     tester: materialArrayControlTester,
-    renderer: MaterialArrayControlRenderer
+    renderer: MaterialArrayControlRenderer,
   },
   { tester: materialBooleanControlTester, renderer: MaterialBooleanControl },
-  { tester: materialBooleanToggleControlTester, renderer: MaterialBooleanToggleControl },
+  {
+    tester: materialBooleanToggleControlTester,
+    renderer: MaterialBooleanToggleControl,
+  },
   { tester: materialNativeControlTester, renderer: MaterialNativeControl },
   { tester: materialEnumControlTester, renderer: MaterialEnumControl },
   { tester: materialIntegerControlTester, renderer: MaterialIntegerControl },
@@ -138,7 +142,7 @@ export const materialRenderers: JsonFormsRendererRegistryEntry[] = [
   { tester: materialTextControlTester, renderer: MaterialTextControl },
   { tester: materialDateTimeControlTester, renderer: MaterialDateTimeControl },
   { tester: materialDateControlTester, renderer: MaterialDateControl },
-  { tester: materialTimeControlTester, renderer: MaterialTimeControl }, 
+  { tester: materialTimeControlTester, renderer: MaterialTimeControl },
   { tester: materialSliderControlTester, renderer: MaterialSliderControl },
   { tester: materialObjectControlTester, renderer: MaterialObjectRenderer },
   { tester: materialAllOfControlTester, renderer: MaterialAllOfRenderer },
@@ -146,43 +150,46 @@ export const materialRenderers: JsonFormsRendererRegistryEntry[] = [
   { tester: materialOneOfControlTester, renderer: MaterialOneOfRenderer },
   {
     tester: materialRadioGroupControlTester,
-    renderer: MaterialRadioGroupControl
+    renderer: MaterialRadioGroupControl,
   },
   {
     tester: materialOneOfRadioGroupControlTester,
-    renderer: MaterialOneOfRadioGroupControl
+    renderer: MaterialOneOfRadioGroupControl,
+  },
+  {
+    tester: materialOneOfEnumControlTester,
+    renderer: MaterialOneOfEnumControl,
   },
-  { tester: materialOneOfEnumControlTester, renderer: MaterialOneOfEnumControl },
   // layouts
   { 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 },
   // additional
   { tester: materialLabelRendererTester, renderer: MaterialLabelRenderer },
   {
     tester: materialListWithDetailTester,
-    renderer: MaterialListWithDetailRenderer
+    renderer: MaterialListWithDetailRenderer,
   },
   {
     tester: materialAnyOfStringOrEnumControlTester,
-    renderer: MaterialAnyOfStringOrEnumControl
+    renderer: MaterialAnyOfStringOrEnumControl,
   },
   {
     tester: materialEnumArrayRendererTester,
-    renderer: MaterialEnumArrayRenderer
-  }
+    renderer: MaterialEnumArrayRenderer,
+  },
 ];
 
 export const materialCells: JsonFormsCellRendererRegistryEntry[] = [
@@ -195,5 +202,17 @@ export const materialCells: JsonFormsCellRendererRegistryEntry[] = [
   { tester: materialNumberFormatCellTester, cell: MaterialNumberFormatCell },
   { tester: materialOneOfEnumCellTester, cell: MaterialOneOfEnumCell },
   { tester: materialTextCellTester, cell: MaterialTextCell },
-  { tester: materialTimeCellTester, cell: MaterialTimeCell }
+  { tester: materialTimeCellTester, cell: MaterialTimeCell },
 ];
+
+import { UnwrappedAdditional } from './additional/unwrapped';
+import { UnwrappedComplex } from './complex/unwrapped';
+import { UnwrappedControls } from './controls/unwrapped';
+import { UnwrappedLayouts } from './layouts/unwrapped';
+
+export const Unwrapped = {
+  ...UnwrappedAdditional,
+  ...UnwrappedComplex,
+  ...UnwrappedControls,
+  ...UnwrappedLayouts,
+};