@muvehealth/fixins/dist/elements/MSItem/index.js.flow

Component library for Muvehealth

// @flow
import styled from 'react-emotion'
import withProps from 'recompose/withProps'
import { themeGet } from 'styled-system'
import T from 'ramda/src/T'
import cond from 'ramda/src/cond'
import Relative from '../Relative'

const MSItem = styled(Relative)(
  {
    cursor: 'pointer',
  },
  ({ isActive, isSelected, ...rest }) => cond([
    [() => isActive, () => ({
      background: 'rgba(0,0,0,.03)',
      color: 'rgba(0,0,0,.95)',
      display: 'block',
    })],
    [() => isSelected, () => ({
      color: themeGet('colors.darkGray', '#4A4A4A')(rest),
      display: 'none',
    })],
    [T, () => ({
      color: themeGet('colors.darkGray', '#4A4A4A')(rest),
      display: 'block',
    })],
  ]),
)

export default withProps({
  fontSize: 2,
  px: 3,
  py: 2,
  textAlign: 'left',
})(MSItem)