joyent-portal/ui/src/components/list/view.js

54 lines
1.0 KiB
JavaScript
Raw Normal View History

2017-01-09 20:58:30 +02:00
const fns = require('../../shared/functions');
2017-01-09 14:13:12 +02:00
const React = require('react');
const Row = require('../row');
const Styled = require('styled-components');
2017-01-10 00:14:10 +02:00
const transferProps = require('./transfer-props');
2017-01-09 14:13:12 +02:00
2017-01-09 20:58:30 +02:00
const {
remcalc
} = fns;
2017-01-09 14:13:12 +02:00
const {
default: styled
} = Styled;
const height = (props) => props.collapsed
? remcalc(48)
: 'auto';
2017-01-09 20:58:30 +02:00
const paddingTop = (props) => props.headed && !props.fromHeader
? remcalc(47)
: remcalc(0);
2017-01-10 00:14:10 +02:00
const StyledView = styled(Row)`
2017-01-09 14:13:12 +02:00
flex: 1;
margin: 0;
height: ${height};
2017-01-09 20:58:30 +02:00
padding-top: ${paddingTop};
2017-01-09 14:13:12 +02:00
`;
const View = (props) => {
const hide = props.headed && !props.fromHeader && props.collapsed;
return hide ? null : (
<StyledView name='list-item-view' {...props}>
{props.children}
</StyledView>
);
};
2017-01-10 00:14:10 +02:00
2017-01-10 00:20:54 +02:00
View.propTypes = {
children: React.PropTypes.node,
collapsed: React.PropTypes.bool,
fromHeader: React.PropTypes.bool,
headed: React.PropTypes.bool
2017-01-10 00:20:54 +02:00
};
2017-01-09 20:58:30 +02:00
module.exports = transferProps([
'collapsed',
'headed',
'fromHeader'
2017-01-10 00:14:10 +02:00
], View);
module.exports.raw = View;