mirror of
https://github.com/quine-global/hyper.git
synced 2026-01-16 21:58:39 -09:00
Add middle click to close tab functionality (#286)
This commit is contained in:
parent
b06f28ae10
commit
2e9ac60b2b
1 changed files with 13 additions and 1 deletions
|
|
@ -6,6 +6,7 @@ export default class Tab extends Component {
|
||||||
super();
|
super();
|
||||||
this.hover = this.hover.bind(this);
|
this.hover = this.hover.bind(this);
|
||||||
this.blur = this.blur.bind(this);
|
this.blur = this.blur.bind(this);
|
||||||
|
this.handleClick = this.handleClick.bind(this);
|
||||||
this.state = {
|
this.state = {
|
||||||
hovered: false
|
hovered: false
|
||||||
};
|
};
|
||||||
|
|
@ -19,6 +20,17 @@ export default class Tab extends Component {
|
||||||
this.setState({ hovered: false });
|
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) {
|
template (css) {
|
||||||
const { isActive, isFirst, isLast, borderColor, hasActivity } = this.props;
|
const { isActive, isFirst, isLast, borderColor, hasActivity } = this.props;
|
||||||
const { hovered } = this.state;
|
const { hovered } = this.state;
|
||||||
|
|
@ -41,7 +53,7 @@ export default class Tab extends Component {
|
||||||
isLast && 'textLast',
|
isLast && 'textLast',
|
||||||
isActive && 'textActive'
|
isActive && 'textActive'
|
||||||
) }
|
) }
|
||||||
onClick={ this.props.isActive ? null : this.props.onSelect }>
|
onClick={ this.handleClick }>
|
||||||
<span className={ css('textInner') }>
|
<span className={ css('textInner') }>
|
||||||
{ this.props.text }
|
{ this.props.text }
|
||||||
</span>
|
</span>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue