@jsonforms/material-renderers 3.1.0-beta.0 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/additional/ListWithDetailMasterItem.d.ts +1 -1
- package/lib/additional/MaterialListWithDetailRenderer.d.ts +1 -1
- package/lib/additional/unwrapped.d.ts +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/jsonforms-react-material.cjs.js +19 -17
- package/lib/jsonforms-react-material.cjs.js.map +1 -1
- package/lib/jsonforms-react-material.esm.js +19 -17
- package/lib/jsonforms-react-material.esm.js.map +1 -1
- package/lib/layouts/ArrayToolbar.d.ts +1 -0
- package/package.json +6 -6
- package/src/additional/ListWithDetailMasterItem.tsx +12 -9
- package/src/additional/MaterialListWithDetailRenderer.tsx +3 -0
- package/src/layouts/ArrayToolbar.tsx +39 -21
- package/src/layouts/ExpandPanelRenderer.tsx +13 -11
- package/src/layouts/MaterialArrayLayout.tsx +1 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jsonforms/material-renderers",
|
|
3
|
-
"version": "3.1.0
|
|
3
|
+
"version": "3.1.0",
|
|
4
4
|
"description": "Material Renderer Set for JSON Forms",
|
|
5
5
|
"repository": "https://github.com/eclipsesource/jsonforms",
|
|
6
6
|
"bugs": "https://github.com/eclipsesource/jsonforms/issues",
|
|
@@ -82,8 +82,8 @@
|
|
|
82
82
|
"peerDependencies": {
|
|
83
83
|
"@emotion/react": "^11.4.1",
|
|
84
84
|
"@emotion/styled": "^11.3.0",
|
|
85
|
-
"@jsonforms/core": "3.1.0
|
|
86
|
-
"@jsonforms/react": "3.1.0
|
|
85
|
+
"@jsonforms/core": "3.1.0",
|
|
86
|
+
"@jsonforms/react": "3.1.0",
|
|
87
87
|
"@mui/icons-material": "~5.11.16",
|
|
88
88
|
"@mui/material": "~5.13.0",
|
|
89
89
|
"@mui/x-date-pickers": "^6.0.0"
|
|
@@ -91,8 +91,8 @@
|
|
|
91
91
|
"devDependencies": {
|
|
92
92
|
"@emotion/react": "^11.5.0",
|
|
93
93
|
"@emotion/styled": "^11.3.0",
|
|
94
|
-
"@jsonforms/core": "^3.1.0
|
|
95
|
-
"@jsonforms/react": "^3.1.0
|
|
94
|
+
"@jsonforms/core": "^3.1.0",
|
|
95
|
+
"@jsonforms/react": "^3.1.0",
|
|
96
96
|
"@mui/icons-material": "~5.11.16",
|
|
97
97
|
"@mui/material": "~5.13.0",
|
|
98
98
|
"@mui/x-date-pickers": "^6.5.0",
|
|
@@ -132,5 +132,5 @@
|
|
|
132
132
|
"webpack-cli": "^3.2.1",
|
|
133
133
|
"webpack-dev-server": "^3.9.0"
|
|
134
134
|
},
|
|
135
|
-
"gitHead": "
|
|
135
|
+
"gitHead": "7e0115feeced7711b0768d325566aaa6b054c32b"
|
|
136
136
|
}
|
|
@@ -39,6 +39,7 @@ export const ListWithDetailMasterItem = ({
|
|
|
39
39
|
index,
|
|
40
40
|
childLabel,
|
|
41
41
|
selected,
|
|
42
|
+
enabled,
|
|
42
43
|
handleSelect,
|
|
43
44
|
removeItem,
|
|
44
45
|
path,
|
|
@@ -50,15 +51,17 @@ export const ListWithDetailMasterItem = ({
|
|
|
50
51
|
<Avatar aria-label='Index'>{index + 1}</Avatar>
|
|
51
52
|
</ListItemAvatar>
|
|
52
53
|
<ListItemText primary={childLabel} />
|
|
53
|
-
|
|
54
|
-
<
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
54
|
+
{enabled && (
|
|
55
|
+
<ListItemSecondaryAction>
|
|
56
|
+
<IconButton
|
|
57
|
+
aria-label={translations.removeAriaLabel}
|
|
58
|
+
onClick={removeItem(path, index)}
|
|
59
|
+
size='large'
|
|
60
|
+
>
|
|
61
|
+
<DeleteIcon />
|
|
62
|
+
</IconButton>
|
|
63
|
+
</ListItemSecondaryAction>
|
|
64
|
+
)}
|
|
62
65
|
</ListItem>
|
|
63
66
|
);
|
|
64
67
|
};
|
|
@@ -51,6 +51,7 @@ export const MaterialListWithDetailRenderer = ({
|
|
|
51
51
|
schema,
|
|
52
52
|
uischema,
|
|
53
53
|
path,
|
|
54
|
+
enabled,
|
|
54
55
|
errors,
|
|
55
56
|
visible,
|
|
56
57
|
label,
|
|
@@ -114,6 +115,7 @@ export const MaterialListWithDetailRenderer = ({
|
|
|
114
115
|
)}
|
|
115
116
|
errors={errors}
|
|
116
117
|
path={path}
|
|
118
|
+
enabled={enabled}
|
|
117
119
|
addItem={addItem}
|
|
118
120
|
createDefault={handleCreateDefaultValue}
|
|
119
121
|
/>
|
|
@@ -126,6 +128,7 @@ export const MaterialListWithDetailRenderer = ({
|
|
|
126
128
|
index={index}
|
|
127
129
|
path={path}
|
|
128
130
|
schema={schema}
|
|
131
|
+
enabled={enabled}
|
|
129
132
|
handleSelect={handleListItemClick}
|
|
130
133
|
removeItem={handleRemoveItem}
|
|
131
134
|
selected={selectedIndex === index}
|
|
@@ -7,6 +7,7 @@ export interface ArrayLayoutToolbarProps {
|
|
|
7
7
|
label: string;
|
|
8
8
|
errors: string;
|
|
9
9
|
path: string;
|
|
10
|
+
enabled: boolean;
|
|
10
11
|
addItem(path: string, data: any): () => void;
|
|
11
12
|
createDefault(): any;
|
|
12
13
|
translations: ArrayTranslations;
|
|
@@ -16,6 +17,7 @@ export const ArrayLayoutToolbar = React.memo(function ArrayLayoutToolbar({
|
|
|
16
17
|
errors,
|
|
17
18
|
addItem,
|
|
18
19
|
path,
|
|
20
|
+
enabled,
|
|
19
21
|
createDefault,
|
|
20
22
|
translations,
|
|
21
23
|
}: ArrayLayoutToolbarProps) {
|
|
@@ -23,32 +25,48 @@ export const ArrayLayoutToolbar = React.memo(function ArrayLayoutToolbar({
|
|
|
23
25
|
<Toolbar disableGutters={true}>
|
|
24
26
|
<Grid container alignItems='center' justifyContent='space-between'>
|
|
25
27
|
<Grid item>
|
|
26
|
-
<
|
|
28
|
+
<Grid
|
|
29
|
+
container
|
|
30
|
+
justifyContent={'flex-start'}
|
|
31
|
+
alignItems={'center'}
|
|
32
|
+
spacing={2}
|
|
33
|
+
>
|
|
34
|
+
<Grid item>
|
|
35
|
+
<Typography variant={'h6'}>{label}</Typography>
|
|
36
|
+
</Grid>
|
|
37
|
+
<Grid item>
|
|
38
|
+
{errors.length !== 0 && (
|
|
39
|
+
<Grid item>
|
|
40
|
+
<ValidationIcon
|
|
41
|
+
id='tooltip-validation'
|
|
42
|
+
errorMessages={errors}
|
|
43
|
+
/>
|
|
44
|
+
</Grid>
|
|
45
|
+
)}
|
|
46
|
+
</Grid>
|
|
47
|
+
</Grid>
|
|
27
48
|
</Grid>
|
|
28
|
-
{
|
|
49
|
+
{enabled && (
|
|
29
50
|
<Grid item>
|
|
30
|
-
<
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
<Tooltip
|
|
37
|
-
id='tooltip-add'
|
|
38
|
-
title={translations.addTooltip}
|
|
39
|
-
placement='bottom'
|
|
40
|
-
>
|
|
41
|
-
<IconButton
|
|
42
|
-
aria-label={translations.addAriaLabel}
|
|
43
|
-
onClick={addItem(path, createDefault())}
|
|
44
|
-
size='large'
|
|
51
|
+
<Grid container>
|
|
52
|
+
<Grid item>
|
|
53
|
+
<Tooltip
|
|
54
|
+
id='tooltip-add'
|
|
55
|
+
title={translations.addTooltip}
|
|
56
|
+
placement='bottom'
|
|
45
57
|
>
|
|
46
|
-
<
|
|
47
|
-
|
|
48
|
-
|
|
58
|
+
<IconButton
|
|
59
|
+
aria-label={translations.addTooltip}
|
|
60
|
+
onClick={addItem(path, createDefault())}
|
|
61
|
+
size='large'
|
|
62
|
+
>
|
|
63
|
+
<AddIcon />
|
|
64
|
+
</IconButton>
|
|
65
|
+
</Tooltip>
|
|
66
|
+
</Grid>
|
|
49
67
|
</Grid>
|
|
50
68
|
</Grid>
|
|
51
|
-
|
|
69
|
+
)}
|
|
52
70
|
</Grid>
|
|
53
71
|
</Toolbar>
|
|
54
72
|
);
|
|
@@ -164,7 +164,7 @@ const ExpandPanelRendererComponent = (props: ExpandPanelProps) => {
|
|
|
164
164
|
justifyContent='center'
|
|
165
165
|
alignItems='center'
|
|
166
166
|
>
|
|
167
|
-
{showSortButtons ? (
|
|
167
|
+
{showSortButtons && enabled ? (
|
|
168
168
|
<Fragment>
|
|
169
169
|
<Grid item>
|
|
170
170
|
<IconButton
|
|
@@ -192,16 +192,18 @@ const ExpandPanelRendererComponent = (props: ExpandPanelProps) => {
|
|
|
192
192
|
) : (
|
|
193
193
|
''
|
|
194
194
|
)}
|
|
195
|
-
|
|
196
|
-
<
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
195
|
+
{enabled && (
|
|
196
|
+
<Grid item>
|
|
197
|
+
<IconButton
|
|
198
|
+
onClick={removeItems(path, [index])}
|
|
199
|
+
style={iconStyle}
|
|
200
|
+
aria-label={translations.removeAriaLabel}
|
|
201
|
+
size='large'
|
|
202
|
+
>
|
|
203
|
+
<DeleteIcon />
|
|
204
|
+
</IconButton>
|
|
205
|
+
</Grid>
|
|
206
|
+
)}
|
|
205
207
|
</Grid>
|
|
206
208
|
</Grid>
|
|
207
209
|
</Grid>
|