mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-18 00:54:43 -04:00
Added TOC and anchors for headings (#243)
* Added TOC support and anchors for headings * Moved @types/markdown-it-anchor from devDependencies to dependencies * Add subnode renderer Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de> * Added node-replacer for toc generation ul lists may not be nested inside a p element. Therefore replaces this replacer every p that has a div.table-of-contents inside of it with the div directly. * Add index to replacer function Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de> * Add TOC to example code Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de> * Remove unused import Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de> * Removed unnecessary div wrapper of toc * Fixed toc-renderer Co-authored-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
parent
cb2ea5fa6e
commit
fd378cf89b
12 changed files with 93 additions and 13 deletions
|
@ -14,7 +14,7 @@ interface resizeEvent {
|
|||
id: string
|
||||
}
|
||||
|
||||
const getElementReplacement:ComponentReplacer = (node, counterMap) => {
|
||||
const getElementReplacement:ComponentReplacer = (node, index:number, counterMap) => {
|
||||
const attributes = getAttributesFromCodiMdTag(node, 'gist')
|
||||
if (attributes && attributes.id) {
|
||||
const gistId = attributes.id
|
||||
|
|
|
@ -5,7 +5,7 @@ import { getAttributesFromCodiMdTag } from '../codi-md-tag-utils'
|
|||
import { OneClickEmbedding } from '../one-click-frame/one-click-embedding'
|
||||
import './pdf-frame.scss'
|
||||
|
||||
const getElementReplacement = (node: DomElement, counterMap: Map<string, number>): (ReactElement | undefined) => {
|
||||
const getElementReplacement = (node: DomElement, index:number, counterMap: Map<string, number>): (ReactElement | undefined) => {
|
||||
const attributes = getAttributesFromCodiMdTag(node, 'pdf')
|
||||
if (attributes && attributes.url) {
|
||||
const pdfUrl = attributes.url
|
||||
|
|
|
@ -0,0 +1,17 @@
|
|||
import { DomElement } from 'domhandler'
|
||||
import { ReactElement } from 'react'
|
||||
import { SubNodeConverter } from '../../markdown-renderer'
|
||||
|
||||
const getElementReplacement = (node: DomElement, index: number, counterMap: Map<string, number>, nodeConverter: SubNodeConverter): (ReactElement | undefined) => {
|
||||
if (node.name === 'p' && node.children && node.children.length === 1) {
|
||||
const possibleTocDiv = node.children[0]
|
||||
if (possibleTocDiv.name === 'div' && possibleTocDiv.attribs && possibleTocDiv.attribs.class &&
|
||||
possibleTocDiv.attribs.class === 'table-of-contents' && possibleTocDiv.children && possibleTocDiv.children.length === 1) {
|
||||
const listElement = possibleTocDiv.children[0]
|
||||
listElement.attribs = Object.assign(listElement.attribs || {}, { class: 'table-of-contents' })
|
||||
return nodeConverter(listElement, index)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { getElementReplacement as getTOCReplacement }
|
|
@ -3,7 +3,7 @@ import { ComponentReplacer } from '../../markdown-renderer'
|
|||
import { getAttributesFromCodiMdTag } from '../codi-md-tag-utils'
|
||||
import { OneClickEmbedding } from '../one-click-frame/one-click-embedding'
|
||||
|
||||
const getElementReplacement:ComponentReplacer = (node, counterMap) => {
|
||||
const getElementReplacement:ComponentReplacer = (node, index:number, counterMap) => {
|
||||
const attributes = getAttributesFromCodiMdTag(node, 'vimeo')
|
||||
if (attributes && attributes.id) {
|
||||
const videoId = attributes.id
|
||||
|
|
|
@ -3,7 +3,7 @@ import { ComponentReplacer } from '../../markdown-renderer'
|
|||
import { getAttributesFromCodiMdTag } from '../codi-md-tag-utils'
|
||||
import { OneClickEmbedding } from '../one-click-frame/one-click-embedding'
|
||||
|
||||
const getElementReplacement: ComponentReplacer = (node, counterMap) => {
|
||||
const getElementReplacement: ComponentReplacer = (node, index:number, counterMap) => {
|
||||
const attributes = getAttributesFromCodiMdTag(node, 'youtube')
|
||||
if (attributes && attributes.id) {
|
||||
const videoId = attributes.id
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue