Passing props through styled() in Emotion is something I'm familiar with.
For example:
const Container = styled("div")<{ position: string }>`
display: flex;
flex-direction: ${({ position }) => (position === "top" ? "column" : "row")};
margin: ${({ position }) => (position === "top" ? "40px" : "0")};
`;
But how do we achieve the same result using css() in Emotion?
Like this:
const Container = css /* 👉 doesn't work <{ position: string }>*/`
display: flex;
flex-direction: ${({ position }) => (position === "top" ? "column" : "row")};
margin: ${({ position }) => (position === "top" ? "40px" : "0")};
`;