Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

initialize autofocus selection in createView #2212

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion packages/core/src/Editor.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import createDocument from './helpers/createDocument'
import getHTMLFromFragment from './helpers/getHTMLFromFragment'
import getText from './helpers/getText'
import isNodeEmpty from './helpers/isNodeEmpty'
import resolveFocusPosition from './helpers/resolveFocusPosition'
import getTextSeralizersFromSchema from './helpers/getTextSeralizersFromSchema'
import createStyleTag from './utilities/createStyleTag'
import isFunction from './utilities/isFunction'
Expand Down Expand Up @@ -260,11 +261,14 @@ export class Editor extends EventEmitter<EditorEvents> {
* Creates a ProseMirror view.
*/
private createView(): void {
const doc = createDocument(this.options.content, this.schema, this.options.parseOptions)
const selection = resolveFocusPosition(doc, this.options.autofocus)
this.view = new EditorView(this.options.element, {
...this.options.editorProps,
dispatchTransaction: this.dispatchTransaction.bind(this),
state: EditorState.create({
doc: createDocument(this.options.content, this.schema, this.options.parseOptions),
doc,
selection,
}),
})

Expand Down
49 changes: 4 additions & 45 deletions packages/core/src/commands/focus.ts
Original file line number Diff line number Diff line change
@@ -1,42 +1,7 @@
import { EditorState, Selection, TextSelection } from 'prosemirror-state'
import { RawCommands, FocusPosition } from '../types'
import minMax from '../utilities/minMax'
import isTextSelection from '../helpers/isTextSelection'
import isiOS from '../utilities/isiOS'

function resolveSelection(state: EditorState, position: FocusPosition = null) {
if (!position) {
return null
}

if (position === 'start' || position === true) {
return {
from: 0,
to: 0,
}
}

const { size } = state.doc.content

if (position === 'end') {
return {
from: size,
to: size,
}
}

if (position === 'all') {
return {
from: 0,
to: size,
}
}

return {
from: position,
to: position,
}
}
import resolveFocusPosition from '../helpers/resolveFocusPosition'

declare module '@tiptap/core' {
interface Commands<ReturnType> {
Expand Down Expand Up @@ -95,13 +60,7 @@ export const focus: RawCommands['focus'] = (position = null, options) => ({
return true
}

const { from, to } = resolveSelection(editor.state, position) || editor.state.selection
const { doc, storedMarks } = tr
const minPos = Selection.atStart(doc).from
const maxPos = Selection.atEnd(doc).to
const resolvedFrom = minMax(from, minPos, maxPos)
const resolvedEnd = minMax(to, minPos, maxPos)
const selection = TextSelection.create(doc, resolvedFrom, resolvedEnd)
const selection = resolveFocusPosition(editor.state.doc, position) || editor.state.selection
const isSameSelection = editor.state.selection.eq(selection)

if (dispatch) {
Expand All @@ -111,8 +70,8 @@ export const focus: RawCommands['focus'] = (position = null, options) => ({

// `tr.setSelection` resets the stored marks
// so we’ll restore them if the selection is the same as before
if (isSameSelection && storedMarks) {
tr.setStoredMarks(storedMarks)
if (isSameSelection && tr.storedMarks) {
tr.setStoredMarks(tr.storedMarks)
}

delayedFocus()
Expand Down
22 changes: 22 additions & 0 deletions packages/core/src/helpers/resolveFocusPosition.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import { Node as ProseMirrorNode } from 'prosemirror-model'
import { Selection, TextSelection } from 'prosemirror-state'
import { FocusPosition } from '../types'
import minMax from '../utilities/minMax'

export default function resolveFocusPosition(
doc: ProseMirrorNode,
position: FocusPosition = null
): Selection | null {

if (!position) return null
if (position === 'start' || position === true) return Selection.atStart(doc)
if (position === 'end') return Selection.atEnd(doc)
if (position === 'all') return TextSelection.create(doc, 0, doc.content.size)

// Check if `position` is in bounds of the doc if `position` is a number.
const minPos = Selection.atStart(doc).from
const maxPos = Selection.atEnd(doc).to
const resolvedFrom = minMax(position, minPos, maxPos)
const resolvedEnd = minMax(position, minPos, maxPos)
return TextSelection.create(doc, resolvedFrom, resolvedEnd)
}