All files / Select/partials SelectOption.js

100% Statements 9/9
100% Branches 4/4
100% Functions 2/2
100% Lines 7/7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 341x 1x   1x   10x         2x                             20x 20x              
import styled from 'styled-components'
import { autoCssGenerator } from '../cssHelpers';
 
const g = autoCssGenerator('select-option');
 
const isFocused = () => (`
  ${g('color', 'focused')}
  ${g('background-color', 'focused')}
`)
 
const isSelected = () => (`
  ${g('color', 'selected')}
  ${g('background-color', 'selected')}
`)
 
export default styled.div`
  box-sizing: border-box;
  ${g('font-family')}
  ${g('background-color')}
 
  color: #666666;
  cursor: pointer;
  display: block;
  padding: 8px 10px;
 
  ${props => props.isFocused && isFocused()}
  ${props => props.isSelected && isSelected()}
 
  &:last-child {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
  }
`