45 lines
1.0 KiB
TypeScript
45 lines
1.0 KiB
TypeScript
import { v4 } from "uuid"
|
|
|
|
type ElementType<Key extends keyof JSX.IntrinsicElements> = React.FC<JSX.IntrinsicElements[Key]>
|
|
type FormattedTags = {
|
|
[Key in keyof JSX.IntrinsicElements]: ElementType<Key>
|
|
}
|
|
|
|
const H1TAG: ElementType<"h1"> = ({ children }) => { return (
|
|
<h1 key={v4()} className="text-4xl text-red-500">{children}</h1>
|
|
)}
|
|
|
|
const H2Tag: ElementType<"h2"> = ({ children }) => (
|
|
<h2 key={v4()}>{children}</h2>
|
|
)
|
|
|
|
const H3Tag: ElementType<"h3"> = ({ children }) => (
|
|
<h3 key={v4()}>{children}</h3>
|
|
)
|
|
|
|
const H4Tag: ElementType<"h4"> = ({ children }) => (
|
|
<h4 key={v4()}>{children}</h4>
|
|
)
|
|
|
|
const PTag: ElementType<"p"> = ({ children }) => (
|
|
<p key={v4()}>{children}</p>
|
|
)
|
|
|
|
const LiTag: ElementType<"li"> = ({ children }) => (
|
|
<li key={v4()}>{children}</li>
|
|
)
|
|
|
|
const BrTag: ElementType<"br"> = () => (
|
|
<br key={v4()} />
|
|
)
|
|
|
|
export default {
|
|
"h1": H1TAG,
|
|
"h2": H2Tag,
|
|
"h3": H3Tag,
|
|
"h4": H4Tag,
|
|
"p": PTag,
|
|
"li": LiTag,
|
|
"br": BrTag
|
|
} satisfies Partial<FormattedTags>
|