imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Expand the list when the overflow element is clicked

Browse source 
Negative truncateAt values means "do not truncate".
This commit is contained in:
Kegan Dougal 2016-01-21 15:57:59 +00:00
parent eed83f982e
commit d72ab641d0
3 changed files with 24 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/components/views/elements/TruncatedList.js
View file

@ -19,7 +19,7 @@ module.exports = React.createClass({
displayName: 'TruncatedList',
propTypes: {
// The number of elements to show before truncating
// The number of elements to show before truncating. If negative, no truncation is done.
truncateAt: React.PropTypes.number,
// The className to apply to the wrapping div
className: React.PropTypes.string,
@ -43,16 +43,19 @@ module.exports = React.createClass({
var childsJsx = this.props.children;
var overflowJsx;
var childCount = React.Children.count(this.props.children);
var overflowCount = childCount - this.props.truncateAt;
if (overflowCount > 0) {
overflowJsx = this.props.createOverflowElement(
overflowCount, childCount
);
var childArray = React.Children.toArray(this.props.children);
// cut out the overflow elements
childArray.splice(childCount - overflowCount, overflowCount);
childsJsx = childArray; // use what is left
if (this.props.truncateAt >= 0) {
var overflowCount = childCount - this.props.truncateAt;
if (overflowCount > 0) {
overflowJsx = this.props.createOverflowElement(
overflowCount, childCount
);
var childArray = React.Children.toArray(this.props.children);
// cut out the overflow elements
childArray.splice(childCount - overflowCount, overflowCount);
childsJsx = childArray; // use what is left
}
}
return (