Skip to content

Instantly share code, notes, and snippets.

@LauraBeatris

LauraBeatris/styledComponentWithProps.ts

Last active October 30, 2023 11:47
Show Gist options
  • Save LauraBeatris/294545869fc6c5b240c3d8fcc4c81c9e to your computer and use it in GitHub Desktop.
Save LauraBeatris/294545869fc6c5b240c3d8fcc4c81c9e to your computer and use it in GitHub Desktop.
Download ZIP
Helper TS function to provide props for a Styled Component
Raw
styledComponentWithProps.ts
function styledComponentWithProps<T, U extends HTMLElement = HTMLElement>
(styledFunction: StyledFunction<React.HTMLProps<U>>): StyledFunction<T & React.HTMLProps<U>> {
return styledFunction
}
@LauraBeatris
Copy link
Author 

interface MyAmazingProps {
	isSelected: boolean 
}

const amazingElement = styledComponentWithProps<MyAmazingProps, HTMLButtonElement>(styled.button)`
	background-color: ${({theme}) => theme ? blue : red};
`;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment