mirror of
https://github.com/ueberdosis/tiptap.git
synced 2024-11-28 15:49:23 +08:00
refactoring
This commit is contained in:
parent
eed82a57b6
commit
389937c32f
@ -9,7 +9,7 @@
|
||||
<button @click="editor.chain().focus().textAlign('right').run()">
|
||||
right
|
||||
</button>
|
||||
<button @click="editor.chain().focus().setDefaultNodeAttributes(['textAlign']).run()">
|
||||
<button @click="editor.chain().focus().resetNodeAttributes(['textAlign']).run()">
|
||||
set default
|
||||
</button>
|
||||
<editor-content :editor="editor" />
|
||||
|
@ -5,7 +5,7 @@ import { createExtension } from '../Extension'
|
||||
export const ClearNodes = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
clearNodes: (): Command => ({ state, tr }) => {
|
||||
clearNodes: (): Command => ({ state, tr, dispatch }) => {
|
||||
const { selection } = tr
|
||||
const { from, to } = selection
|
||||
|
||||
@ -18,11 +18,11 @@ export const ClearNodes = createExtension({
|
||||
if (nodeRange) {
|
||||
const targetLiftDepth = liftTarget(nodeRange)
|
||||
|
||||
if (node.type.isTextblock) {
|
||||
if (node.type.isTextblock && dispatch) {
|
||||
tr.setNodeMarkup(nodeRange.start, state.schema.nodes.paragraph)
|
||||
}
|
||||
|
||||
if (targetLiftDepth || targetLiftDepth === 0) {
|
||||
if ((targetLiftDepth || targetLiftDepth === 0) && dispatch) {
|
||||
tr.lift(nodeRange, targetLiftDepth)
|
||||
}
|
||||
}
|
||||
|
@ -40,7 +40,9 @@ function resolveSelection(editor: Editor, position: Position = null): ResolvedSe
|
||||
export const Focus = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
focus: (position: Position = null): Command => ({ editor, view, tr }) => {
|
||||
focus: (position: Position = null): Command => ({
|
||||
editor, view, tr, dispatch,
|
||||
}) => {
|
||||
if ((view.hasFocus() && position === null) || position === false) {
|
||||
return true
|
||||
}
|
||||
@ -51,7 +53,10 @@ export const Focus = createExtension({
|
||||
const resolvedEnd = minMax(to, 0, doc.content.size)
|
||||
const selection = TextSelection.create(doc, resolvedFrom, resolvedEnd)
|
||||
|
||||
if (dispatch) {
|
||||
tr.setSelection(selection)
|
||||
}
|
||||
|
||||
view.focus()
|
||||
|
||||
return true
|
||||
|
@ -11,7 +11,7 @@ export { RemoveMarks } from './removeMarks'
|
||||
export { ScrollIntoView } from './scrollIntoView'
|
||||
export { SelectAll } from './selectAll'
|
||||
export { SelectParentNode } from './selectParentNode'
|
||||
export { SetDefaultNodeAttributes } from './setDefaultNodeAttributes'
|
||||
export { ResetNodeAttributes } from './resetNodeAttributes'
|
||||
export { SetNodeAttributes } from './setNodeAttributes'
|
||||
export { SetBlockType } from './setBlockType'
|
||||
export { SetContent } from './setContent'
|
||||
|
@ -21,13 +21,15 @@ function selectionToInsertionEnd(tr: Transaction, startLen: number, bias: number
|
||||
export const InsertHTML = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
insertHTML: (value: string): Command => ({ tr, state }) => {
|
||||
insertHTML: (value: string): Command => ({ tr, state, dispatch }) => {
|
||||
const { selection } = tr
|
||||
const element = elementFromString(value)
|
||||
const slice = DOMParser.fromSchema(state.schema).parseSlice(element)
|
||||
|
||||
if (dispatch) {
|
||||
tr.insert(selection.anchor, slice.content)
|
||||
selectionToInsertionEnd(tr, tr.steps.length - 1, -1)
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
@ -4,8 +4,10 @@ import { createExtension } from '../Extension'
|
||||
export const InsertText = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
insertText: (value: string): Command => ({ tr }) => {
|
||||
insertText: (value: string): Command => ({ tr, dispatch }) => {
|
||||
if (dispatch) {
|
||||
tr.insertText(value)
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
@ -7,7 +7,7 @@ import getMarkRange from '../utils/getMarkRange'
|
||||
export const RemoveMark = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
removeMark: (typeOrName: string | MarkType): Command => ({ tr, state }) => {
|
||||
removeMark: (typeOrName: string | MarkType): Command => ({ tr, state, dispatch }) => {
|
||||
const { selection } = tr
|
||||
const type = getMarkType(typeOrName, state.schema)
|
||||
let { from, to } = selection
|
||||
@ -22,7 +22,9 @@ export const RemoveMark = createExtension({
|
||||
}
|
||||
}
|
||||
|
||||
if (dispatch) {
|
||||
tr.removeMark(from, to, type)
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
@ -4,7 +4,7 @@ import { createExtension } from '../Extension'
|
||||
export const RemoveMarks = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
removeMarks: (): Command => ({ tr, state }) => {
|
||||
removeMarks: (): Command => ({ tr, state, dispatch }) => {
|
||||
const { selection } = tr
|
||||
const { from, to, empty } = selection
|
||||
|
||||
@ -12,11 +12,13 @@ export const RemoveMarks = createExtension({
|
||||
return true
|
||||
}
|
||||
|
||||
if (dispatch) {
|
||||
Object
|
||||
.entries(state.schema.marks)
|
||||
.forEach(([, mark]) => {
|
||||
tr.removeMark(from, to, mark as any)
|
||||
})
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
@ -1,10 +1,10 @@
|
||||
import { Command } from '../Editor'
|
||||
import { createExtension } from '../Extension'
|
||||
|
||||
export const SetDefaultNodeAttributes = createExtension({
|
||||
export const ResetNodeAttributes = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
setDefaultNodeAttributes: (attributeNames: string[] = []): Command => ({ tr, state }) => {
|
||||
resetNodeAttributes: (attributeNames: string[] = []): Command => ({ tr, state, dispatch }) => {
|
||||
const { selection } = tr
|
||||
const { from, to } = selection
|
||||
|
||||
@ -14,7 +14,7 @@ export const SetDefaultNodeAttributes = createExtension({
|
||||
const attribute = node.type.spec.attrs?.[name]
|
||||
const defaultValue = attribute?.default
|
||||
|
||||
if (attribute && defaultValue !== undefined) {
|
||||
if (attribute && defaultValue !== undefined && dispatch) {
|
||||
tr.setNodeMarkup(pos, undefined, {
|
||||
[name]: defaultValue,
|
||||
})
|
||||
@ -31,6 +31,6 @@ export const SetDefaultNodeAttributes = createExtension({
|
||||
|
||||
declare module '../Editor' {
|
||||
interface AllExtensions {
|
||||
SetDefaultNodeAttributes: typeof SetDefaultNodeAttributes,
|
||||
ResetNodeAttributes: typeof ResetNodeAttributes,
|
||||
}
|
||||
}
|
@ -4,8 +4,10 @@ import { createExtension } from '../Extension'
|
||||
export const ScrollIntoView = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
scrollIntoView: (): Command => ({ tr }) => {
|
||||
scrollIntoView: (): Command => ({ tr, dispatch }) => {
|
||||
if (dispatch) {
|
||||
tr.scrollIntoView()
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
@ -5,15 +5,17 @@ import { createExtension } from '../Extension'
|
||||
export const SetContent = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
setContent: (content: string, emitUpdate: Boolean = false, parseOptions = {}): Command => ({ tr, editor }) => {
|
||||
setContent: (content: string, emitUpdate: Boolean = false, parseOptions = {}): Command => ({ tr, editor, dispatch }) => {
|
||||
const { createDocument } = editor
|
||||
const { doc } = tr
|
||||
const document = createDocument(content, parseOptions)
|
||||
const selection = TextSelection.create(doc, 0, doc.content.size)
|
||||
|
||||
if (dispatch) {
|
||||
tr.setSelection(selection)
|
||||
.replaceSelectionWith(document, false)
|
||||
.setMeta('preventUpdate', !emitUpdate)
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
@ -4,12 +4,12 @@ import { createExtension } from '../Extension'
|
||||
export const SetNodeAttributes = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
setNodeAttributes: (attributes: {}): Command => ({ tr, state }) => {
|
||||
setNodeAttributes: (attributes: {}): Command => ({ tr, state, dispatch }) => {
|
||||
const { selection } = tr
|
||||
const { from, to } = selection
|
||||
|
||||
state.doc.nodesBetween(from, to, (node, pos) => {
|
||||
if (!node.type.isText) {
|
||||
if (!node.type.isText && dispatch) {
|
||||
tr.setNodeMarkup(pos, undefined, attributes)
|
||||
}
|
||||
})
|
||||
|
@ -77,7 +77,7 @@ export const SplitBlock = createExtension({
|
||||
}
|
||||
}
|
||||
|
||||
dispatch(tr.scrollIntoView())
|
||||
tr.scrollIntoView()
|
||||
}
|
||||
|
||||
return true
|
||||
|
@ -31,10 +31,12 @@ export const ToggleList = createExtension({
|
||||
}
|
||||
|
||||
// change list type
|
||||
if (isList(parentList.node.type.name, extensions) && listType.validContent(parentList.node.content)) {
|
||||
if (dispatch) {
|
||||
if (
|
||||
isList(parentList.node.type.name, extensions)
|
||||
&& listType.validContent(parentList.node.content)
|
||||
&& dispatch
|
||||
) {
|
||||
tr.setNodeMarkup(parentList.pos, listType)
|
||||
}
|
||||
|
||||
return true
|
||||
}
|
||||
|
@ -7,7 +7,7 @@ import getMarkRange from '../utils/getMarkRange'
|
||||
export const UpdateMark = createExtension({
|
||||
addCommands() {
|
||||
return {
|
||||
updateMark: (typeOrName: string | MarkType, attrs: {}): Command => ({ tr, state }) => {
|
||||
updateMark: (typeOrName: string | MarkType, attrs: {}): Command => ({ tr, state, dispatch }) => {
|
||||
const { selection, doc } = tr
|
||||
let { from, to } = selection
|
||||
const { $from, empty } = selection
|
||||
@ -24,11 +24,13 @@ export const UpdateMark = createExtension({
|
||||
|
||||
const hasMark = doc.rangeHasMark(from, to, type)
|
||||
|
||||
if (hasMark) {
|
||||
if (hasMark && dispatch) {
|
||||
tr.removeMark(from, to, type)
|
||||
}
|
||||
|
||||
if (dispatch) {
|
||||
tr.addMark(from, to, type.create(attrs))
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user