Skip to content

Commit 6333f3e

Browse files
committed
Fix jumping form by setting min-height to error element
1 parent eec699f commit 6333f3e

File tree

1 file changed

+21
-9
lines changed

1 file changed

+21
-9
lines changed

Diff for: src/App.tsx

+21-9
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
} from '@jsonforms/material-renderers';
1414
import RatingControl from './RatingControl';
1515
import ratingControlTester from './ratingControlTester';
16-
import { makeStyles } from '@material-ui/core/styles';
16+
import { createMuiTheme, makeStyles, ThemeProvider } from '@material-ui/core/styles';
1717

1818
const useStyles = makeStyles((_theme) => ({
1919
container: {
@@ -41,6 +41,16 @@ const useStyles = makeStyles((_theme) => ({
4141
},
4242
}));
4343

44+
const theme = createMuiTheme({
45+
overrides: {
46+
MuiFormHelperText: {
47+
root: {
48+
minHeight: '1.6em'
49+
}
50+
}
51+
}
52+
});
53+
4454
const initialData = {
4555
name: 'Send email to Adrian',
4656
description: 'Confirm if you have passed the subject\nHereby ...',
@@ -105,14 +115,16 @@ const App = () => {
105115
Rendered form
106116
</Typography>
107117
<div className={classes.demoform}>
108-
<JsonForms
109-
schema={schema}
110-
uischema={uischema}
111-
data={jsonformsData}
112-
renderers={renderers}
113-
cells={materialCells}
114-
onChange={({ errors, data }) => setJsonformsData(data)}
115-
/>
118+
<ThemeProvider theme={theme}>
119+
<JsonForms
120+
schema={schema}
121+
uischema={uischema}
122+
data={jsonformsData}
123+
renderers={renderers}
124+
cells={materialCells}
125+
onChange={({ errors, data }) => setJsonformsData(data)}
126+
/>
127+
</ThemeProvider>
116128
</div>
117129
</Grid>
118130
</Grid>

0 commit comments

Comments
 (0)