React accordion with rc-collapse and styled-components

Accordion.js

import React from 'react'
import Collapse, { Panel } from 'rc-collapse'
import PropTypes from 'prop-types'
import styled from 'styled-components'
import 'rc-collapse/assets/index.css'

const StyledCollapse = styled(Collapse)`
  &.rc-collapse {
    width: 100%;
    border-radius: 0px;
    border-color: transparent;
    background-color: ${props => props.theme.colors.white};
    border: 0px;
    > .rc-collapse-item {
      border: 0px;
      > .rc-collapse-header {
        flex-direction: row-reverse;
        height: auto;
        line-height: normal;
        text-indent: 0px;
        text-transform: none;
        display: flex;
        align-items: center;
      }
    }
    .rc-collapse-content {
      border-bottom-width: 0px;
      border-color: ${props => props.theme.colors.lighterGrey};
      border-left-width: 3px;
      border-right-width: 0px;
      border-style: solid;
      border-top-width: 0px;
    }
    .rc-collapse-content-box {
      margin-top: 0px;
      margin-bottom: 12px;
    }
  }
`

const Accordion = props => (
  <StyledCollapse {...props}>
    {props.children}
  </StyledCollapse>
)

Accordion.propTypes = {
  children: PropTypes.node.isRequired,
}

Accordion.Panel = Panel

export default Accordion