So, first of all, I declare my component like this:
import styled from 'styled-components';
import {
space, color, layout, flexbox, border,
} from 'styled-system';
const FlexWrapper = styled.div`
display: flex;
gap: ${({ gap }) => gap || '10px'};
${layout};
${space};
${color};
${flexbox};
${border};
`;
export default FlexWrapper;
Then I just use it:
return (
<FlexWrapper flexDirection='column' width={width}>
<FlexWrapper flexDirection='row' gap='30px'>
{filters}
</FlexWrapper>
</FlexWrapper>
);
Eventually, props work fine but vscode intellisense doesn't see it at all. Are there any solutions to how can I fix it?