react-toolbox/components/tabs/Tab.jsx

51 lines
1.1 KiB
JavaScript

import React from 'react';
import ClassNames from 'classnames';
import style from './style';
class TabHeader extends React.Component {
static propTypes = {
active: React.PropTypes.bool,
className: React.PropTypes.string,
disabled: React.PropTypes.bool,
hidden: React.PropTypes.bool,
label: React.PropTypes.any.isRequired,
onActive: React.PropTypes.func,
onClick: React.PropTypes.func
};
static defaultProps = {
active: false,
className: '',
disabled: false,
hidden: false
};
componentDidUpdate (prevProps) {
if (!prevProps.active && this.props.active && this.props.onActive) {
this.props.onActive();
}
}
handleClick = () => {
if (!this.props.disabled && this.props.onClick) {
this.props.onClick();
}
};
render () {
const className = ClassNames(style.label, {
[style.active]: this.props.active,
[style.hidden]: this.props.hidden,
[style.disabled]: this.props.disabled
}, this.props.className);
return (
<label className={className} onClick={this.handleClick}>
{this.props.label}
</label>
);
}
}
export default TabHeader;