My preferred way of doing style overrides in styled-components

styled-components-override-style.jsx

const Button = styled.button`
  border: 1px solid black;
  ${props => props.primary && primaryStyle};
  ${props => props.danger && dangerStyle};
  ${props => props.warning && warningStyle};
`

const primaryStyle = css`
  color: white;
  background: blue;
`

const dangerStyle = css`
  color: white;
  background: red;
`

const warningStyle = css`
  color: white;
  background: yellow;
`