Make Dropdown and NotificationsDropdown components more extensible

This commit is contained in:
Toby Zerner
2015-09-04 12:15:11 +09:30
parent 7269385786
commit 70815b024a
4 changed files with 79 additions and 51 deletions

View File

@ -23,20 +23,18 @@ export default class Dropdown extends Component {
props.className = props.className || '';
props.buttonClassName = props.buttonClassName || '';
props.contentClassName = props.contentClassName || '';
props.menuClassName = props.menuClassName || '';
props.label = props.label || app.trans('core.controls');
props.caretIcon = typeof props.caretIcon !== 'undefined' ? props.caretIcon : 'caret-down';
}
view() {
const items = listItems(this.props.children);
const items = this.props.children ? listItems(this.props.children) : [];
return (
<div className={'ButtonGroup Dropdown dropdown ' + this.props.className + ' itemCount' + items.length}>
{this.getButton()}
<ul className={'Dropdown-menu dropdown-menu ' + this.props.menuClassName}>
{items}
</ul>
{this.getMenu(items)}
</div>
);
}
@ -94,4 +92,12 @@ export default class Dropdown extends Component {
this.props.caretIcon ? icon(this.props.caretIcon, {className: 'Button-caret'}) : ''
];
}
getMenu(items) {
return (
<ul className={'Dropdown-menu dropdown-menu ' + this.props.menuClassName}>
{items}
</ul>
);
}
}