refactoring

This commit is contained in:
Philipp Kühn 2021-04-04 23:41:44 +02:00
parent 704e01de6a
commit 143e0204a3
2 changed files with 7 additions and 16 deletions

View File

@ -1,12 +1,8 @@
import CodeBlock from '@tiptap/extension-code-block'
import CodeBlock, { CodeBlockOptions } from '@tiptap/extension-code-block'
import low from 'lowlight/lib/core'
import { LowlightPlugin } from './lowlight-plugin'
export interface CodeBlockLowlightOptions {
languageClassPrefix: string,
HTMLAttributes: {
[key: string]: any
},
export interface CodeBlockLowlightOptions extends CodeBlockOptions {
languages: {
[key: string]: Function
},
@ -14,8 +10,7 @@ export interface CodeBlockLowlightOptions {
export const CodeBlockLowlight = CodeBlock.extend<CodeBlockLowlightOptions>({
defaultOptions: {
languageClassPrefix: 'language-',
HTMLAttributes: {},
...CodeBlock.config.defaultOptions,
languages: {},
},

View File

@ -31,7 +31,7 @@ function getDecorations({ doc, name }: { doc: ProsemirrorNode, name: string}) {
findChildren(doc, node => node.type.name === name)
.forEach(block => {
let startPos = block.pos + 1
let from = block.pos + 1
const { language } = block.node.attrs
// TODO: add missing type for `listLanguages`
// @ts-ignore
@ -41,16 +41,14 @@ function getDecorations({ doc, name }: { doc: ProsemirrorNode, name: string}) {
: low.highlightAuto(block.node.textContent).value
parseNodes(nodes).forEach(node => {
const from = startPos
const to = from + node.text.length
startPos = to
const decoration = Decoration.inline(from, to, {
class: node.classes.join(' '),
})
decorations.push(decoration)
from = to
})
})
@ -59,13 +57,11 @@ function getDecorations({ doc, name }: { doc: ProsemirrorNode, name: string}) {
export function LowlightPlugin({ name }: { name: string }) {
return new Plugin({
key: new PluginKey('highlight'),
key: new PluginKey('lowlight'),
state: {
init: (_, { doc }) => getDecorations({ doc, name }),
apply: (transaction, decorationSet, oldState, newState) => {
// TODO: find way to cache decorations
// https://discuss.prosemirror.net/t/how-to-update-multiple-inline-decorations-on-node-change/1493
const oldNodeName = oldState.selection.$head.parent.type.name
const newNodeName = newState.selection.$head.parent.type.name
const oldNodes = findChildren(oldState.doc, node => node.type.name === name)