react-cm-ui
Version:
React UI for Healthy Church
59 lines (51 loc) • 1.32 kB
JSX
import ClassNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import Header from '../../dataDisplay/header';
const propTypes = {
attached: PropTypes.bool,
children: PropTypes.node,
className: PropTypes.string,
color: PropTypes.oneOf(['blue', 'green', 'pink']),
style: PropTypes.shape({}),
title: PropTypes.string,
};
const defaultProps = {
attached: false,
children: null,
className: null,
color: null,
style: null,
title: null,
};
function CardHeader(props) {
const {
attached,
children,
className,
color,
style,
title,
} = props;
const rootClasses = ClassNames('card-header', className, {
'card-header-attached': attached,
'card-header-color-blue': color === 'blue',
'card-header-color-green': color === 'green',
'card-header-color-pink': color === 'pink',
});
return (
<header
className={rootClasses}
style={style}
>
{title ? (
<Header size="large">
{title}
</Header>
) : children}
</header>
);
}
CardHeader.propTypes = propTypes;
CardHeader.defaultProps = defaultProps;
export default CardHeader;