타입스크립트를 이용하여 HTML Element를 표현하는 방법이 궁금합니다..!

interface HeaderProps extends HTMLAttributes<HTMLDivElement>{
    children: ReactNode,
    level: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'
    underline?: boolean,
    color?: CSSProperties['color']
}

const Header = ({children ,level = 'h1', underline, color, ...props} : HeaderProps) => {
    const HeaderTag = level
    const fontStyle = {
        textDecoration: underline ? 'underline' : undefined,
        color
    }
    return <HeaderTag style={{...props.style, ...fontStyle}} {...props}>{children}</HeaderTag>
}