Т.е. я создаю стилизованные блоки NewsArticle, NewsArticle__Title и т.д, создаю где-то отдельно в более "глобальной" области блоки MixBlock__Title, MixBlockSubtitle и пишу стили по следующему принципу?
В зависимости от того, что надо получить. Таким образом сразу определяется и хтмл тег.
К примеру, в данном примеру это див:
const MixBlock = styled.div`
/* some custom styles */
`;
const NewsArticle__Title = styled(MixBlock)`
/* some custom styles */
`;
И соответственно NewsArticle__Title тоже будет див.
Если же нужны просто стили, то styled-components принимает стили в виде строки, соответственно берёшь, создаёшь строковую константу и прописываешь там стили. Единственное я хз как сделать так, чтобы плагин для раскраски цсса в styled-components распознавал эту строку как цсс строку.
const MixStyles = `
...
`;
const NewsArticle__Title = styled.div`
${MixStyles}
`