2020-08-17 21:07:16 +01:00
|
|
|
import React from 'react'
|
2020-08-17 21:59:29 +01:00
|
|
|
import PropTypes from 'prop-types'
|
2020-05-03 06:22:49 +01:00
|
|
|
import { CX } from '../constants'
|
2020-02-29 15:42:47 +00:00
|
|
|
|
2020-04-23 07:13:29 +01:00
|
|
|
/**
|
|
|
|
* Renders a divider component
|
|
|
|
* @param {bool} [props.isInvisible] - to style the tab bar larger
|
|
|
|
* @param {bool} [props.isSmall] - if item is active
|
|
|
|
*/
|
2020-08-18 01:57:35 +01:00
|
|
|
class Divider extends React.PureComponent {
|
2020-03-05 15:44:17 +00:00
|
|
|
|
2020-02-19 23:57:07 +00:00
|
|
|
render() {
|
2020-04-23 07:13:29 +01:00
|
|
|
const { isSmall, isInvisible } = this.props
|
2020-02-29 15:42:47 +00:00
|
|
|
|
2020-05-03 06:22:49 +01:00
|
|
|
const classes = CX({
|
2020-08-18 21:49:11 +01:00
|
|
|
d: 1,
|
2020-04-23 07:13:29 +01:00
|
|
|
borderBottom1PX: !isInvisible,
|
2020-04-25 18:00:51 +01:00
|
|
|
borderColorSecondary: !isInvisible,
|
2020-08-18 21:43:06 +01:00
|
|
|
w100PC: 1,
|
2020-04-23 07:13:29 +01:00
|
|
|
mb15: !isSmall,
|
|
|
|
my10: isSmall || isInvisible,
|
2020-02-29 15:42:47 +00:00
|
|
|
})
|
|
|
|
|
2020-04-23 07:13:29 +01:00
|
|
|
return <div className={classes} />
|
2020-02-19 23:57:07 +00:00
|
|
|
}
|
2020-04-23 07:13:29 +01:00
|
|
|
|
2020-08-18 01:57:35 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
Divider.propTypes = {
|
|
|
|
isInvisible: PropTypes.bool,
|
|
|
|
isSmall: PropTypes.bool,
|
|
|
|
}
|
|
|
|
|
|
|
|
export default Divider
|