diff options
Diffstat (limited to 'src/components/atoms/headings/heading.tsx')
| -rw-r--r-- | src/components/atoms/headings/heading.tsx | 21 |
1 files changed, 21 insertions, 0 deletions
diff --git a/src/components/atoms/headings/heading.tsx b/src/components/atoms/headings/heading.tsx new file mode 100644 index 0000000..1535140 --- /dev/null +++ b/src/components/atoms/headings/heading.tsx @@ -0,0 +1,21 @@ +import { FC } from 'react'; + +type HeadingProps = { + /** + * HTML heading level: 'h1', 'h2', 'h3', 'h4', 'h5' or 'h6'. + */ + level: 1 | 2 | 3 | 4 | 5 | 6; +}; + +/** + * Heading component. + * + * Render an HTML heading element. + */ +const Heading: FC<HeadingProps> = ({ children, level }) => { + const TitleTag = `h${level}` as keyof JSX.IntrinsicElements; + + return <TitleTag>{children}</TitleTag>; +}; + +export default Heading; |
