Skip to content

Instantly share code, notes, and snippets.

@Heydon
Created April 21, 2018 09:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Heydon/d21779de69e8f84def86da98d1cfbc8e to your computer and use it in GitHub Desktop.
Save Heydon/d21779de69e8f84def86da98d1cfbc8e to your computer and use it in GitHub Desktop.
<Heading aria-level={props.level ? props.level : null}>Heading text</Heading>
@erikvorhes
Copy link

Fun thing with the latest couple versions of Styled Components: you can use the as prop to have it use a different underlying HTML element; something like this might work:

<Heading as={props.level ? `h${props.level}` : 'h2'}>Heading text</Heading>

(I'm speculating about how much flexibility one has with defining as; at some point soonish I'll test this out and report back.)

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