Как сделать так, чтобы это предупреждение исчезло при использовании стилевых компонентов?- className prop не передается ребенку

Question

У меня есть styled-component, и когда он отображается на странице, я получаю предупреждение, что хотел бы понять, как исправить.Вот мой компонент:

const TitleBar = styled.nav`
    background-color: #2f323b;
    display: flex;
    height: 60px;
`;

const Link = styled.a`
    display: flex;
    align-items: center;
    font-size: 18px;
    line-height: 20px;
`;

const Wrapper = styled.div`
    margin-left: 15px;
`;

export default () => 
    <TitleBar>
        <Link>
            <Wrapper>
                <BrandInverse />
            </Wrapper>
        </Link>
    </TitleBar>    

Это единственное место в приложении, где я использую элемент nav.Вот предупреждение, которое я получаю:

It looks like you've wrapped styled() around your React component (nav), but the className prop is not being passed down to a child. No styles will be rendered unless className is composed within your React component.

Почему это происходит?Как это исправить?Как правильно сделать это в будущем?