Skip to content

Commit 64fba38

Browse files
authored
react-vanilla: Add oneOf enum cell and renderer (#2414)
- Add and export OneOfEnumCell to renderer oneOf enums via an select input in to the React vanilla renderers - Add unit tests for the new cell - New cell supports option `hideEmptyOption` to not show any empty option if set to `true`.
1 parent 903cef7 commit 64fba38

File tree

4 files changed

+516
-0
lines changed

4 files changed

+516
-0
lines changed
Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
/*
2+
The MIT License
3+
4+
Copyright (c) 2017-2019 EclipseSource Munich
5+
https://github.com/eclipsesource/jsonforms
6+
7+
Permission is hereby granted, free of charge, to any person obtaining a copy
8+
of this software and associated documentation files (the "Software"), to deal
9+
in the Software without restriction, including without limitation the rights
10+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11+
copies of the Software, and to permit persons to whom the Software is
12+
furnished to do so, subject to the following conditions:
13+
14+
The above copyright notice and this permission notice shall be included in
15+
all copies or substantial portions of the Software.
16+
17+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
23+
THE SOFTWARE.
24+
*/
25+
import React, { useMemo } from 'react';
26+
import {
27+
EnumCellProps,
28+
isOneOfEnumControl,
29+
RankedTester,
30+
rankWith,
31+
} from '@jsonforms/core';
32+
import {
33+
TranslateProps,
34+
withJsonFormsOneOfEnumCellProps,
35+
withTranslateProps,
36+
} from '@jsonforms/react';
37+
import { i18nDefaults, withVanillaEnumCellProps } from '../util';
38+
import type { VanillaRendererProps } from '../index';
39+
40+
export const OneOfEnumCell = (
41+
props: EnumCellProps & VanillaRendererProps & TranslateProps
42+
) => {
43+
const {
44+
data,
45+
className,
46+
id,
47+
enabled,
48+
schema,
49+
uischema,
50+
path,
51+
handleChange,
52+
options,
53+
t,
54+
} = props;
55+
const noneOptionLabel = useMemo(
56+
() => t('enum.none', i18nDefaults['enum.none'], { schema, uischema, path }),
57+
[t, schema, uischema, path]
58+
);
59+
const noneOption = (
60+
<option value={''} key={'jsonforms.enum.none'}>
61+
{noneOptionLabel}
62+
</option>
63+
);
64+
return (
65+
<select
66+
className={className}
67+
id={id}
68+
disabled={!enabled}
69+
autoFocus={uischema.options && uischema.options.focus}
70+
value={data || ''}
71+
onChange={(ev) =>
72+
handleChange(
73+
path,
74+
ev.target.selectedIndex === 0 ? undefined : ev.target.value
75+
)
76+
}
77+
>
78+
{(uischema.options?.hideEmptyOption === true ? [] : [noneOption]).concat(
79+
options.map((optionValue) => (
80+
<option
81+
value={optionValue.value}
82+
label={optionValue.label}
83+
key={optionValue.value}
84+
/>
85+
))
86+
)}
87+
</select>
88+
);
89+
};
90+
/**
91+
* Default tester for oneOf enum controls.
92+
* @type {RankedTester}
93+
*/
94+
export const oneOfEnumCellTester: RankedTester = rankWith(
95+
2,
96+
isOneOfEnumControl
97+
);
98+
99+
export default withJsonFormsOneOfEnumCellProps(
100+
withTranslateProps(withVanillaEnumCellProps(OneOfEnumCell))
101+
);

packages/vanilla-renderers/src/cells/index.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import EnumCell, { enumCellTester } from './EnumCell';
2929
import IntegerCell, { integerCellTester } from './IntegerCell';
3030
import NumberCell, { numberCellTester } from './NumberCell';
3131
import NumberFormatCell, { numberFormatCellTester } from './NumberFormatCell';
32+
import OneOfEnumCell, { oneOfEnumCellTester } from './OneOfEnumCell';
3233
import SliderCell, { sliderCellTester } from './SliderCell';
3334
import TextCell, { textCellTester } from './TextCell';
3435
import TextAreaCell, { textAreaCellTester } from './TextAreaCell';
@@ -50,6 +51,8 @@ export {
5051
numberCellTester,
5152
NumberFormatCell,
5253
numberFormatCellTester,
54+
OneOfEnumCell,
55+
oneOfEnumCellTester,
5356
SliderCell,
5457
sliderCellTester,
5558
TextCell,

packages/vanilla-renderers/src/renderers.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,8 @@ import {
3838
integerCellTester,
3939
NumberCell,
4040
numberCellTester,
41+
OneOfEnumCell,
42+
oneOfEnumCellTester,
4143
SliderCell,
4244
sliderCellTester,
4345
TextAreaCell,
@@ -97,6 +99,7 @@ export const vanillaCells: { tester: RankedTester; cell: any }[] = [
9799
{ tester: enumCellTester, cell: EnumCell },
98100
{ tester: integerCellTester, cell: IntegerCell },
99101
{ tester: numberCellTester, cell: NumberCell },
102+
{ tester: oneOfEnumCellTester, cell: OneOfEnumCell },
100103
{ tester: sliderCellTester, cell: SliderCell },
101104
{ tester: textAreaCellTester, cell: TextAreaCell },
102105
{ tester: textCellTester, cell: TextCell },

0 commit comments

Comments
 (0)