Add middle click to close tab functionality (#286)

This commit is contained in:
William 2016-07-22 01:33:10 +01:00 committed by Guillermo Rauch
parent b06f28ae10
commit 2e9ac60b2b

View file

@ -6,6 +6,7 @@ export default class Tab extends Component {
super();
this.hover = this.hover.bind(this);
this.blur = this.blur.bind(this);
this.handleClick = this.handleClick.bind(this);
this.state = {
hovered: false
};
@ -19,6 +20,17 @@ export default class Tab extends Component {
this.setState({ hovered: false });
}
handleClick (event) {
const isLeftClick = event.nativeEvent.which === 1;
const isMiddleClick = event.nativeEvent.which === 2;
if (isLeftClick) {
this.props.isActive ? null : this.props.onSelect();
} else if (isMiddleClick) {
this.props.onClose();
}
}
template (css) {
const { isActive, isFirst, isLast, borderColor, hasActivity } = this.props;
const { hovered } = this.state;
@ -41,7 +53,7 @@ export default class Tab extends Component {
isLast && 'textLast',
isActive && 'textActive'
) }
onClick={ this.props.isActive ? null : this.props.onSelect }>
onClick={ this.handleClick }>
<span className={ css('textInner') }>
{ this.props.text }
</span>