-
Notifications
You must be signed in to change notification settings - Fork 86
/
layout-components.js
57 lines (44 loc) · 1.89 KB
/
layout-components.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
import React from 'react';
import PropTypes from 'prop-types';
import { layoutComponents } from '@data-driven-forms/react-form-renderer';
import { Button, Form } from 'patternfly-react';
import './layout-components.scss';
const FormWapper = ({ children, ...props }) => <Form { ...props } >{ children }</Form>;
FormWapper.propTypes = {
children: PropTypes.oneOfType([ PropTypes.node, PropTypes.arrayOf(PropTypes.node) ]).isRequired,
};
const FormButton = ({ label, variant, children, ...props }) => <Button bsStyle={ variant } { ...props }>{ label || children }</Button>;
FormButton.propTypes = {
label: PropTypes.oneOfType([ PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node) ]),
variant: PropTypes.string,
children: PropTypes.oneOfType([ PropTypes.node, PropTypes.arrayOf(PropTypes.node) ]),
};
const ButtonGroupWrapper = ({ children, className, ...props }) => (
<div className={ `ddorg__pf3-layout-components__button-group ${className}` } { ...props }
>
{ children }
</div>
);
ButtonGroupWrapper.propTypes = {
children: PropTypes.oneOfType([ PropTypes.node, PropTypes.arrayOf(PropTypes.node) ]).isRequired,
className: PropTypes.string,
};
ButtonGroupWrapper.defaultProps = {
className: '',
};
const TitleWrapper = ({ children }) => <h3>{ children }</h3>;
TitleWrapper.propTypes = {
children: PropTypes.oneOfType([ PropTypes.node, PropTypes.arrayOf(PropTypes.node) ]).isRequired,
};
const DescriptionWrapper = ({ children }) => <p>{ children }</p>;
DescriptionWrapper.propTypes = {
children: PropTypes.oneOfType([ PropTypes.node, PropTypes.arrayOf(PropTypes.node) ]).isRequired,
};
const layoutMapper = {
[layoutComponents.FORM_WRAPPER]: FormWapper,
[layoutComponents.BUTTON]: FormButton,
[layoutComponents.BUTTON_GROUP]: ButtonGroupWrapper,
[layoutComponents.TITLE]: TitleWrapper,
[layoutComponents.DESCRIPTION]: DescriptionWrapper,
};
export default layoutMapper;