| 1 |
import { arrayToClassName } from '../../utils/utils'; |
| 2 |
|
| 3 |
export default function Heading( props ) { |
| 4 |
const baseClassName = 'eps', |
| 5 |
classes = [ |
| 6 |
props.className, |
| 7 |
]; |
| 8 |
|
| 9 |
if ( props.variant ) { |
| 10 |
classes.push( baseClassName + '-' + props.variant ); |
| 11 |
} |
| 12 |
|
| 13 |
const Element = () => React.createElement( props.tag, { |
| 14 |
className: arrayToClassName( classes ), |
| 15 |
}, props.children ); |
| 16 |
|
| 17 |
return <Element />; |
| 18 |
} |
| 19 |
|
| 20 |
Heading.propTypes = { |
| 21 |
className: PropTypes.string, |
| 22 |
children: PropTypes.oneOfType( [ |
| 23 |
PropTypes.string, |
| 24 |
PropTypes.object, |
| 25 |
PropTypes.arrayOf( PropTypes.object ), |
| 26 |
] ).isRequired, |
| 27 |
tag: PropTypes.oneOf( [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ] ), |
| 28 |
variant: PropTypes.oneOf( [ 'display-1', 'display-2', 'display-3', 'display-4', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ] ).isRequired, |
| 29 |
}; |
| 30 |
|
| 31 |
Heading.defaultProps = { |
| 32 |
className: '', |
| 33 |
tag: 'h1', |
| 34 |
}; |
| 35 |
|
