32 lines
911 B
TypeScript
32 lines
911 B
TypeScript
|
import { SignalLike } from '$fresh/src/types.ts'
|
||
|
|
import { render, RenderOptions } from 'gfm'
|
||
|
|
|
||
|
|
export type MarkdownTheme = 'light' | 'dark' | 'auto'
|
||
|
|
export function Markdown(
|
||
|
|
{ children, theme, options }: {
|
||
|
|
children?: SignalLike<string> | string
|
||
|
|
theme?: SignalLike<MarkdownTheme> | MarkdownTheme
|
||
|
|
options?: RenderOptions
|
||
|
|
},
|
||
|
|
) {
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
class='markdown-body'
|
||
|
|
data-color-mode={typeof theme === 'string'
|
||
|
|
? theme
|
||
|
|
: theme?.value ?? 'auto'}
|
||
|
|
data-light-theme='light'
|
||
|
|
data-dark-theme='dark'
|
||
|
|
dangerouslySetInnerHTML={{
|
||
|
|
__html: render(
|
||
|
|
typeof children === 'string'
|
||
|
|
? children
|
||
|
|
: children?.value ?? '',
|
||
|
|
options,
|
||
|
|
),
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|