import isEmpty from 'lodash/isEmpty' ; import { findUISchema , GroupLayout , isObjectControl , RankedTester , rankWith , StatePropsOfControlWithDetail } from '@jsonforms/core' ; import { JsonFormsDispatch , withJsonFormsDetailProps } from '@jsonforms/react' ; import { Hidden } from '@mui/material' ; import React , { useMemo } from 'react' ; export const MaterialObjectRenderer = ( { renderers , cells , uischemas , schema , label , path , visible , enabled , uischema , rootSchema } ) => { const detailUiSchema = useMemo ( ( ) => findUISchema ( uischemas , schema , uischema . scope , path , 'Group' , uischema , rootSchema ) , [ uischemas , schema , uischema . scope , path , uischema , rootSchema ] ) ; if ( isEmpty ( path ) ) { detailUiSchema . type = 'VerticalLayout' ; } else { ( detailUiSchema as GroupLayout ) . label = label ; } return ( < Hidden xsUp = { ! visible } > < JsonFormsDispatch visible = { visible } enabled = { enabled } schema = { schema } uischema = { detailUiSchema } path = { path } renderers = { renderers } cells = { cells } / > < /Hidden>); } ; export const materialObjectControlTester = rankWith ( 2 , isObjectControl ) ; export default withJsonFormsDetailProps ( MaterialObjectRenderer ) ;