mirror of
https://github.com/ueberdosis/tiptap.git
synced 2024-11-29 16:48:54 +08:00
refactoring
This commit is contained in:
parent
704e01de6a
commit
143e0204a3
@ -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: {},
|
||||
},
|
||||
|
||||
|
@ -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)
|
||||
|
Loading…
Reference in New Issue
Block a user