import {EditorState, Plugin} from "prosemirror-state"
import {EditorView} from "prosemirror-view"
import {Schema} from "prosemirror-model"
import {schema} from "prosemirror-schema-basic"
import {toggleMark} from "prosemirror-commands"
import "prosemirror-view/style/prosemirror.css"
const boldMark = schema.marks.strong;
const italicMark = schema.marks.em;
const commands = {
toggleBold: toggleMark(boldMark),
toggleItalic: toggleMark(italicMark),
};
export const mySchema = new Schema({
nodes: schema.spec.nodes,
marks: schema.spec.marks,
});
export function setupEditor(element) {
const myEditorPlugins = [
new Plugin({
props: {
attributes: {class: "xygpt-editor-content"}
}
})
]
let myEditorState = EditorState.create({
schema: mySchema,
plugins: myEditorPlugins
})
let myEditorView = new EditorView(element, {
state: myEditorState
})
document.querySelector('#bold').addEventListener('click', function() {
myEditorView.focus()
commands.toggleBold(myEditorView.state, myEditorView.dispatch)
})
document.querySelector('#qx').addEventListener('click', function() {
myEditorView.focus()
commands.toggleItalic(myEditorView.state, myEditorView.dispatch)
})
}
When I use both libraries ‘prosemirror-schema-basic’ and ‘prosemirror-commands’ together and customize the schema, I encounter confusion when calling toggleMark. I believe this is a bug.
i need your help