react-toolbox/components/list/ListItemContent.js

61 lines
1.7 KiB
JavaScript

import React, { Component, PropTypes } from 'react';
import classnames from 'classnames';
import { themr } from 'react-css-themr';
import { LIST } from '../identifiers';
import InjectListItemText from './ListItemText';
const types = ['auto', 'normal', 'large'];
const factory = (ListItemText) => {
class ListItemContent extends Component {
static propTypes = {
caption: PropTypes.oneOfType([
PropTypes.string,
PropTypes.node,
]),
children: PropTypes.node,
legend: PropTypes.string,
theme: PropTypes.shape({
auto: PropTypes.string,
itemContentRoot: PropTypes.string,
large: PropTypes.string,
normal: PropTypes.string,
}),
type: PropTypes.oneOf(types),
};
getType() {
const { type, children, caption, legend } = this.props;
let count = React.Children.count(children);
[caption, legend].forEach((s) => { count += s ? 1 : 0; });
const typeIndex = Math.min(count, types.length);
return type || types[typeIndex];
}
render() {
const { children, caption, legend, theme } = this.props;
const contentType = this.getType();
const className = classnames(theme.itemContentRoot, {
[theme[contentType]]: theme[contentType],
});
return (
<span className={className}>
{caption && <ListItemText theme={theme} primary>{caption}</ListItemText>}
{legend && <ListItemText theme={theme}>{legend}</ListItemText>}
{children}
</span>
);
}
}
return ListItemContent;
};
const ListItemContent = factory(InjectListItemText);
export default themr(LIST)(ListItemContent);
export { factory as listItemContentFactory };
export { ListItemContent };