import React,{PropTypes} from 'react';   
import cx from 'classnames';
import s from './SideBar.scss';


class SideBar extends React.Component {
	constructor (props, context) {
	    super(props, context);   
	} 
	static propTypes = {  
    	mainElement: PropTypes.element,
    	sideElement:PropTypes.element,
    	openSide:PropTypes.bool,
    	closeSide:PropTypes.func
	} 
	changeDropdown(value){
		this.props.onChange(value);
	}
	render(){
		const {mainElement,sideElement,openSide,closeSide}=this.props;
		return( 
			<div className={cx(s.side_bar_wrap)}>
				<div className={cx(s.main_wrap,openSide?s.open:'')}>
					{mainElement}
					<div className={cx(s.mask,openSide?s.open:'')} onClick={closeSide}></div>
				</div>
				<div className={cx(s.side_wrap,openSide?s.open:'')}>{sideElement}</div>
			</div>
		)
	}
}
 


export default SideBar;