mirror of
https://github.com/marktext/marktext.git
synced 2025-05-02 15:09:10 +08:00
c0f333d9a2
* fix: code highlight error when open file contains code block * some typo error * some style change
126 lines
3.2 KiB
JavaScript
126 lines
3.2 KiB
JavaScript
import { h } from '../snabbdom'
|
|
import { CLASS_OR_ID } from '../../../config'
|
|
import paragraphIcon from '../../../assets/icons/paragraph.svg'
|
|
import htmlIcon from '../../../assets/icons/html.svg'
|
|
import hrIcon from '../../../assets/icons/horizontal_line.svg'
|
|
import frontMatterIcon from '../../../assets/icons/front_matter.svg'
|
|
import header1Icon from '../../../assets/icons/header_1.svg'
|
|
import header2Icon from '../../../assets/icons/header_2.svg'
|
|
import header3Icon from '../../../assets/icons/header_3.svg'
|
|
import header4Icon from '../../../assets/icons/header_4.svg'
|
|
import header5Icon from '../../../assets/icons/header_5.svg'
|
|
import header6Icon from '../../../assets/icons/header_6.svg'
|
|
import newTableIcon from '../../../assets/icons/new_table.svg'
|
|
import bulletListIcon from '../../../assets/icons/bullet_list.svg'
|
|
import codeIcon from '../../../assets/icons/code.svg'
|
|
import quoteIcon from '../../../assets/icons/quote.svg'
|
|
import todoListIcon from '../../../assets/icons/todolist.svg'
|
|
import mathblockIcon from '../../../assets/icons/math.svg'
|
|
import orderListIcon from '../../../assets/icons/order_list.svg'
|
|
// import flowchartIcon from '../../../assets/icons/flowchart.svg'
|
|
// import sequenceIcon from '../../../assets/icons/sequence.svg'
|
|
// import mermaidIcon from '../../../assets/icons/mermaid.svg'
|
|
// import vegaIcon from '../../../assets/icons/chart.svg'
|
|
|
|
export default function renderIcon (block) {
|
|
if (block.parent) {
|
|
console.error('Only top most block can render front icon button.')
|
|
}
|
|
const { type, functionType, listType } = block
|
|
const selector = `a.${CLASS_OR_ID['AG_FRONT_ICON']}`
|
|
let icon = null
|
|
|
|
switch (type) {
|
|
case 'p': {
|
|
icon = paragraphIcon
|
|
break
|
|
}
|
|
case 'figure': {
|
|
if (functionType === 'table') {
|
|
icon = newTableIcon
|
|
} else if (functionType === 'html') {
|
|
icon = htmlIcon
|
|
} else if (functionType === 'multiplemath') {
|
|
icon = mathblockIcon
|
|
}
|
|
break
|
|
}
|
|
case 'pre': {
|
|
if (functionType === 'fencecode' || functionType === 'indentcode') {
|
|
icon = codeIcon
|
|
} else if (functionType === 'frontmatter') {
|
|
icon = frontMatterIcon
|
|
}
|
|
break
|
|
}
|
|
case 'ul': {
|
|
if (listType === 'task') {
|
|
icon = todoListIcon
|
|
} else {
|
|
icon = bulletListIcon
|
|
}
|
|
break
|
|
}
|
|
case 'ol': {
|
|
icon = orderListIcon
|
|
break
|
|
}
|
|
case 'blockquote': {
|
|
icon = quoteIcon
|
|
break
|
|
}
|
|
case 'h1': {
|
|
icon = header1Icon
|
|
break
|
|
}
|
|
case 'h2': {
|
|
icon = header2Icon
|
|
break
|
|
}
|
|
case 'h3': {
|
|
icon = header3Icon
|
|
break
|
|
}
|
|
case 'h4': {
|
|
icon = header4Icon
|
|
break
|
|
}
|
|
case 'h5': {
|
|
icon = header5Icon
|
|
break
|
|
}
|
|
case 'h6': {
|
|
icon = header6Icon
|
|
break
|
|
}
|
|
case 'hr': {
|
|
icon = hrIcon
|
|
break
|
|
}
|
|
default:
|
|
icon = paragraphIcon
|
|
break
|
|
}
|
|
|
|
const children = [
|
|
h('use', {
|
|
attrs: {
|
|
'xlink:href': `${icon.url}`
|
|
}
|
|
})
|
|
]
|
|
|
|
const svg = h('svg', {
|
|
attrs: {
|
|
'viewBox': icon.viewBox,
|
|
'aria-hidden': 'true'
|
|
}
|
|
}, children)
|
|
|
|
return h(selector, {
|
|
attrs: {
|
|
contenteditable: 'false'
|
|
}
|
|
}, svg)
|
|
}
|