mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-22 19:25:18 -04:00
markdown-it-configurator (#626)
Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de> Co-authored-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de> Co-authored-by: Erik Michelson <github@erik.michelson.eu>
This commit is contained in:
parent
89968387c2
commit
0670cddb0b
42 changed files with 524 additions and 360 deletions
|
@ -1,10 +1,9 @@
|
|||
import MarkdownIt from 'markdown-it'
|
||||
import markdownItContainer from 'markdown-it-container'
|
||||
import React, { useCallback } from 'react'
|
||||
import React, { useMemo } from 'react'
|
||||
import { Table } from 'react-bootstrap'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { BasicMarkdownRenderer } from '../../../markdown-renderer/basic-markdown-renderer'
|
||||
import { createRenderContainer, validAlertLevels } from '../../../markdown-renderer/markdown-it-plugins/alert-container'
|
||||
import { BasicMarkdownItConfigurator } from '../../../markdown-renderer/markdown-it-configurator/BasicMarkdownItConfigurator'
|
||||
import { alertContainer } from '../../../markdown-renderer/markdown-it-plugins/alert-container'
|
||||
import { HighlightedCode } from '../../../markdown-renderer/replace-components/highlighted-fence/highlighted-code/highlighted-code'
|
||||
import './cheatsheet.scss'
|
||||
|
||||
|
@ -31,10 +30,10 @@ export const Cheatsheet: React.FC = () => {
|
|||
`:::info\n${t('editor.help.cheatsheet.exampleAlert')}\n:::`
|
||||
]
|
||||
|
||||
const markdownItPlugins = useCallback((md: MarkdownIt) => {
|
||||
validAlertLevels.forEach(level => {
|
||||
md.use(markdownItContainer, level, { render: createRenderContainer(level) })
|
||||
})
|
||||
const markdownIt = useMemo(() => {
|
||||
return new BasicMarkdownItConfigurator()
|
||||
.pushConfig(alertContainer)
|
||||
.buildConfiguredMarkdownIt()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
|
@ -53,7 +52,7 @@ export const Cheatsheet: React.FC = () => {
|
|||
<BasicMarkdownRenderer
|
||||
content={code}
|
||||
wide={false}
|
||||
onConfigureMarkdownIt={markdownItPlugins}
|
||||
markdownIt={markdownIt}
|
||||
/>
|
||||
</td>
|
||||
<td className={'markdown-body'}>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue