* update article content to markdown ui component * decouple lunr indexing from class name * remove summary outline none rule, apply utility class instead * improve typing * scope more styles down to markdown-body/extended-markdown * move all markdown-body style overrides to MarkdownContent component * fix class targeting within css module * clean up MarkdownContent header style * rename data-lunr to data-search * fix: inline code color issue * fix: update article markdown to work with MarkdownContent
27 lines
588 B
TypeScript
27 lines
588 B
TypeScript
import { ReactNode } from 'react'
|
|
import cx from 'classnames'
|
|
|
|
import styles from './MarkdownContent.module.scss'
|
|
|
|
type Props = {
|
|
children: string | ReactNode
|
|
className?: string
|
|
as?: keyof JSX.IntrinsicElements
|
|
}
|
|
export const MarkdownContent = ({
|
|
children,
|
|
as: Component = 'div',
|
|
className,
|
|
...restProps
|
|
}: Props) => {
|
|
return (
|
|
<Component
|
|
{...restProps}
|
|
className={cx(styles.markdownBody, 'markdown-body', className)}
|
|
{...(typeof children === 'string'
|
|
? { dangerouslySetInnerHTML: { __html: children } }
|
|
: { children })}
|
|
/>
|
|
)
|
|
}
|