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:
Philip Molares 2020-10-08 22:24:42 +02:00 committed by GitHub
parent 89968387c2
commit 0670cddb0b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
42 changed files with 524 additions and 360 deletions

View file

@ -1,13 +1,4 @@
import MarkdownIt from 'markdown-it'
import abbreviation from 'markdown-it-abbr'
import definitionList from 'markdown-it-deflist'
import emoji from 'markdown-it-emoji'
import footnote from 'markdown-it-footnote'
import imsize from 'markdown-it-imsize'
import inserted from 'markdown-it-ins'
import marked from 'markdown-it-mark'
import subscript from 'markdown-it-sub'
import superscript from 'markdown-it-sup'
import React, { ReactElement, RefObject, useMemo, useRef } from 'react'
import { Alert } from 'react-bootstrap'
import ReactHtmlParser from 'react-html-parser'
@ -15,9 +6,6 @@ import { Trans } from 'react-i18next'
import { useSelector } from 'react-redux'
import { ApplicationState } from '../../redux'
import { ShowIf } from '../common/show-if/show-if'
import { combinedEmojiData } from './markdown-it-plugins/emoji/mapping'
import { linkifyExtra } from './markdown-it-plugins/linkify-extra'
import { MarkdownItParserDebugger } from './markdown-it-plugins/parser-debugger'
import './markdown-renderer.scss'
import { ComponentReplacer } from './replace-components/ComponentReplacer'
import { AdditionalMarkdownRendererProps, LineKeys } from './types'
@ -25,8 +13,8 @@ import { buildTransformer } from './utils/html-react-transformer'
import { calculateNewLineNumberMapping } from './utils/line-number-mapping'
export interface BasicMarkdownRendererProps {
componentReplacers?: ComponentReplacer[],
onConfigureMarkdownIt?: (md: MarkdownIt) => void,
componentReplacers?: () => ComponentReplacer[],
markdownIt: MarkdownIt,
documentReference?: RefObject<HTMLDivElement>
onBeforeRendering?: () => void
}
@ -36,44 +24,12 @@ export const BasicMarkdownRenderer: React.FC<BasicMarkdownRendererProps & Additi
content,
wide,
componentReplacers,
onConfigureMarkdownIt,
markdownIt,
documentReference,
onBeforeRendering
}) => {
const maxLength = useSelector((state: ApplicationState) => state.config.maxDocumentLength)
const markdownIt = useMemo(() => {
const md = new MarkdownIt('default', {
html: true,
breaks: true,
langPrefix: '',
typographer: true
})
md.use(emoji, {
defs: combinedEmojiData
})
md.use(abbreviation)
md.use(definitionList)
md.use(subscript)
md.use(superscript)
md.use(inserted)
md.use(marked)
md.use(footnote)
md.use(imsize)
if (onConfigureMarkdownIt) {
onConfigureMarkdownIt(md)
}
md.use(linkifyExtra)
if (process.env.NODE_ENV !== 'production') {
md.use(MarkdownItParserDebugger)
}
return md
}, [onConfigureMarkdownIt])
const oldMarkdownLineKeys = useRef<LineKeys[]>()
const lastUsedLineId = useRef<number>(0)
@ -87,7 +43,7 @@ export const BasicMarkdownRenderer: React.FC<BasicMarkdownRendererProps & Additi
const { lines: newLines, lastUsedLineId: newLastUsedLineId } = calculateNewLineNumberMapping(contentLines, oldMarkdownLineKeys.current ?? [], lastUsedLineId.current)
oldMarkdownLineKeys.current = newLines
lastUsedLineId.current = newLastUsedLineId
const transformer = componentReplacers ? buildTransformer(newLines, componentReplacers) : undefined
const transformer = componentReplacers ? buildTransformer(newLines, componentReplacers()) : undefined
return ReactHtmlParser(html, { transform: transformer })
}, [onBeforeRendering, content, maxLength, markdownIt, componentReplacers])