refactoring
This commit is contained in:
@@ -3,17 +3,11 @@ import { EditorView } from 'prosemirror-view'
|
|||||||
import { Schema, DOMParser, DOMSerializer } from 'prosemirror-model'
|
import { Schema, DOMParser, DOMSerializer } from 'prosemirror-model'
|
||||||
import { gapCursor } from 'prosemirror-gapcursor'
|
import { gapCursor } from 'prosemirror-gapcursor'
|
||||||
import { keymap } from 'prosemirror-keymap'
|
import { keymap } from 'prosemirror-keymap'
|
||||||
import { baseKeymap } from 'prosemirror-commands'
|
import { baseKeymap, selectParentNode } from 'prosemirror-commands'
|
||||||
import { inputRules } from 'prosemirror-inputrules'
|
import { inputRules, undoInputRule } from 'prosemirror-inputrules'
|
||||||
import { markIsActive, nodeIsActive, getMarkAttrs } from 'tiptap-utils'
|
import { markIsActive, nodeIsActive, getMarkAttrs } from 'tiptap-utils'
|
||||||
|
import { ExtensionManager, ComponentView } from './Utils'
|
||||||
import {
|
import builtInNodes from './Nodes'
|
||||||
ExtensionManager,
|
|
||||||
initNodeViews,
|
|
||||||
builtInKeymap,
|
|
||||||
} from '.'
|
|
||||||
|
|
||||||
import builtInNodes from '../Nodes'
|
|
||||||
|
|
||||||
export default class Editor {
|
export default class Editor {
|
||||||
|
|
||||||
@@ -114,7 +108,10 @@ export default class Editor {
|
|||||||
rules: this.inputRules,
|
rules: this.inputRules,
|
||||||
}),
|
}),
|
||||||
...this.keymaps,
|
...this.keymaps,
|
||||||
keymap(builtInKeymap),
|
keymap({
|
||||||
|
Backspace: undoInputRule,
|
||||||
|
Escape: selectParentNode,
|
||||||
|
}),
|
||||||
keymap(baseKeymap),
|
keymap(baseKeymap),
|
||||||
gapCursor(),
|
gapCursor(),
|
||||||
new Plugin({
|
new Plugin({
|
||||||
@@ -145,7 +142,7 @@ export default class Editor {
|
|||||||
const view = new EditorView(this.element, {
|
const view = new EditorView(this.element, {
|
||||||
state: this.state,
|
state: this.state,
|
||||||
dispatchTransaction: this.dispatchTransaction.bind(this),
|
dispatchTransaction: this.dispatchTransaction.bind(this),
|
||||||
nodeViews: initNodeViews({
|
nodeViews: this.initNodeViews({
|
||||||
extensions: [
|
extensions: [
|
||||||
...builtInNodes,
|
...builtInNodes,
|
||||||
...this.options.extensions,
|
...this.options.extensions,
|
||||||
@@ -175,7 +172,7 @@ export default class Editor {
|
|||||||
}
|
}
|
||||||
|
|
||||||
this.view.setProps({
|
this.view.setProps({
|
||||||
nodeViews: initNodeViews({
|
nodeViews: this.initNodeViews({
|
||||||
parent: component,
|
parent: component,
|
||||||
extensions: [
|
extensions: [
|
||||||
...builtInNodes,
|
...builtInNodes,
|
||||||
@@ -186,6 +183,32 @@ export default class Editor {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
initNodeViews({ parent, extensions, editable }) {
|
||||||
|
return extensions
|
||||||
|
.filter(extension => ['node', 'mark'].includes(extension.type))
|
||||||
|
.filter(extension => extension.view)
|
||||||
|
.reduce((nodeViews, extension) => {
|
||||||
|
const nodeView = (node, view, getPos, decorations) => {
|
||||||
|
const component = extension.view
|
||||||
|
|
||||||
|
return new ComponentView(component, {
|
||||||
|
extension,
|
||||||
|
parent,
|
||||||
|
node,
|
||||||
|
view,
|
||||||
|
getPos,
|
||||||
|
decorations,
|
||||||
|
editable,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
...nodeViews,
|
||||||
|
[extension.name]: nodeView,
|
||||||
|
}
|
||||||
|
}, {})
|
||||||
|
}
|
||||||
|
|
||||||
dispatchTransaction(transaction) {
|
dispatchTransaction(transaction) {
|
||||||
this.state = this.state.apply(transaction)
|
this.state = this.state.apply(transaction)
|
||||||
this.view.updateState(this.state)
|
this.view.updateState(this.state)
|
||||||
@@ -1,12 +1,7 @@
|
|||||||
export { default as Editor } from './Utils/Editor'
|
export { default as Editor } from './Editor'
|
||||||
export { default as Extension } from './Utils/Extension'
|
export { Extension, Node, Mark } from './Utils'
|
||||||
export { default as Node } from './Utils/Node'
|
|
||||||
export { default as Mark } from './Utils/Mark'
|
|
||||||
|
|
||||||
export { default as EditorContent } from './Components/EditorContent'
|
export { default as EditorContent } from './Components/EditorContent'
|
||||||
export { default as EditorMenuBar } from './Components/EditorMenuBar'
|
export { default as EditorMenuBar } from './Components/EditorMenuBar'
|
||||||
export { default as EditorMenuBubble } from './Components/EditorMenuBubble'
|
export { default as EditorMenuBubble } from './Components/EditorMenuBubble'
|
||||||
export { default as EditorFloatingMenu } from './Components/EditorFloatingMenu'
|
export { default as EditorFloatingMenu } from './Components/EditorFloatingMenu'
|
||||||
|
export { Plugin, PluginKey } from 'prosemirror-state'
|
||||||
export { Plugin } from 'prosemirror-state'
|
|
||||||
export { PluginKey } from 'prosemirror-state'
|
|
||||||
|
|||||||
@@ -1,9 +0,0 @@
|
|||||||
import { selectParentNode } from 'prosemirror-commands'
|
|
||||||
import { undoInputRule } from 'prosemirror-inputrules'
|
|
||||||
|
|
||||||
const keymap = {
|
|
||||||
Backspace: undoInputRule,
|
|
||||||
Escape: selectParentNode,
|
|
||||||
}
|
|
||||||
|
|
||||||
export default keymap
|
|
||||||
@@ -1,4 +1,5 @@
|
|||||||
export { default as builtInKeymap } from './builtInKeymap'
|
|
||||||
export { default as ComponentView } from './ComponentView'
|
export { default as ComponentView } from './ComponentView'
|
||||||
export { default as initNodeViews } from './initNodeViews'
|
export { default as Extension } from './Extension'
|
||||||
export { default as ExtensionManager } from './ExtensionManager'
|
export { default as ExtensionManager } from './ExtensionManager'
|
||||||
|
export { default as Mark } from './Mark'
|
||||||
|
export { default as Node } from './Node'
|
||||||
|
|||||||
@@ -1,27 +0,0 @@
|
|||||||
import ComponentView from './ComponentView'
|
|
||||||
|
|
||||||
export default function initNodeViews({ parent, extensions, editable }) {
|
|
||||||
return extensions
|
|
||||||
.filter(extension => ['node', 'mark'].includes(extension.type))
|
|
||||||
.filter(extension => extension.view)
|
|
||||||
.reduce((nodeViews, extension) => {
|
|
||||||
const nodeView = (node, view, getPos, decorations) => {
|
|
||||||
const component = extension.view
|
|
||||||
|
|
||||||
return new ComponentView(component, {
|
|
||||||
extension,
|
|
||||||
parent,
|
|
||||||
node,
|
|
||||||
view,
|
|
||||||
getPos,
|
|
||||||
decorations,
|
|
||||||
editable,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
...nodeViews,
|
|
||||||
[extension.name]: nodeView,
|
|
||||||
}
|
|
||||||
}, {})
|
|
||||||
}
|
|
||||||
@@ -1,4 +1,4 @@
|
|||||||
import Editor from '../src/Utils/Editor'
|
import Editor from '../src/Editor'
|
||||||
|
|
||||||
import {
|
import {
|
||||||
Blockquote,
|
Blockquote,
|
||||||
|
|||||||
Reference in New Issue
Block a user