summaryrefslogtreecommitdiffstats
path: root/src/components/atoms/headings/heading.tsx
blob: 153514085c23add1874b6aeff4d0481e0169f122 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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;