51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import type { BoxProps } from 'UIKit/grid';
|
|
import { Box } from 'UIKit/grid';
|
|
import elementsRender from '../config/elements-render';
|
|
import type { Elements as ActionElements } from '../config/map/actions';
|
|
import type { Elements as ComputedElements } from '../config/map/computed';
|
|
import type { Elements as ValuesElements } from '../config/map/values';
|
|
|
|
export type FormComponentConfig = {
|
|
rows: Array<
|
|
[elements: (ValuesElements | ComputedElements | ActionElements)[], style?: BoxProps['style']]
|
|
>;
|
|
};
|
|
|
|
function renderFormComponent(config: FormComponentConfig) {
|
|
const rows = config.rows.map(([elements, style], i) => {
|
|
const renderedElements = elements.map((elementName) => {
|
|
const render = elementsRender[elementName]?.render;
|
|
|
|
return render();
|
|
});
|
|
|
|
return (
|
|
<Box
|
|
// eslint-disable-next-line react/no-array-index-key
|
|
key={i.toString()}
|
|
sx={{
|
|
display: 'grid',
|
|
gridTemplateColumns: ['1fr', '1fr', 'repeat(3, 1fr)'],
|
|
gap: '10px',
|
|
...style,
|
|
}}
|
|
>
|
|
{renderedElements}
|
|
</Box>
|
|
);
|
|
});
|
|
|
|
return (
|
|
<Box
|
|
sx={{
|
|
display: 'grid',
|
|
gridAutoRows: 'auto',
|
|
}}
|
|
>
|
|
{rows}
|
|
</Box>
|
|
);
|
|
}
|
|
|
|
export default renderFormComponent;
|