mirror/tiptap
1
0
Fork 0
mirror of https://github.com/ueberdosis/tiptap.git synced 2025-01-18 06:03:22 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Merge branch 'main' of github.com:ueberdosis/tiptap-next into main

Browse Source
This commit is contained in:
Hans Pagel 2021-02-11 23:18:06 +01:00
commit c0a4092205
2 changed files with 31 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
docs/src/demos/Experiments/Annotation/extension/AnnotationPlugin.ts
View File

@ -14,8 +14,11 @@ export interface AnnotationPluginOptions {
export const AnnotationPlugin = (options: AnnotationPluginOptions) => new Plugin({
key: AnnotationPluginKey,
state: {
init(_, state) {
return AnnotationState.init(_, state)
init() {
return new AnnotationState({
HTMLAttributes: options.HTMLAttributes,
map: options.map,
})
},
apply(transaction, pluginState, oldState, newState) {
return pluginState.apply(transaction, newState)

47
docs/src/demos/Experiments/Annotation/extension/AnnotationState.ts
View File

@ -1,15 +1,23 @@
// @ts-nocheck
import * as Y from 'yjs'
import { EditorState } from 'prosemirror-state'
import { Decoration, DecorationSet } from 'prosemirror-view'
import { ySyncPluginKey, relativePositionToAbsolutePosition, absolutePositionToRelativePosition } from 'y-prosemirror'
import { AnnotationPluginKey } from './AnnotationPlugin'
export class AnnotationState {
private decorations: any
export interface AnnotationStateOptions {
HTMLAttributes: {
[key: string]: any
},
map: any,
}
constructor(decorations: any) {
this.decorations = decorations
export class AnnotationState {
options: AnnotationStateOptions
decorations = DecorationSet.empty
constructor(options: AnnotationStateOptions) {
this.options = options
}
findAnnotation(id: number) {
@ -23,18 +31,18 @@ export class AnnotationState {
}
annotationsAt(position: number) {
return this.decorations.find(position, position)
return this.decorations?.find(position, position)
}
apply(transaction: any, state: EditorState) {
const ystate = ySyncPluginKey.getState(state)
const decs = ystate.doc.getMap('annotations')
const decs = this.options.map
const action = transaction.getMeta(AnnotationPluginKey)
const actionType = action && action.type
if (action) {
let { decorations } = this
const { decorations } = this
if (actionType === 'addAnnotation') {
decs.set(action.data.id, {
@ -51,18 +59,18 @@ export class AnnotationState {
data: action.data,
})
decorations = decorations.add(transaction.doc, [
Decoration.inline(action.from, action.to, { class: 'annotation' }, { data: action.data }),
this.decorations = decorations.add(transaction.doc, [
Decoration.inline(action.from, action.to, this.options.HTMLAttributes, { data: action.data }),
])
} else if (actionType === 'deleteAnnotation') {
decs.delete(action.id)
decorations = decorations.remove([
this.decorations = decorations.remove([
this.findAnnotation(action.id),
])
}
return new AnnotationState(decorations)
return this
}
if (ystate && ystate.isChangeOrigin) {
@ -84,22 +92,19 @@ export class AnnotationState {
dec.to,
ystate.binding.mapping,
),
{ class: 'annotation' },
this.options.HTMLAttributes,
{ data: dec.data },
))
})
return new AnnotationState(DecorationSet.create(state.doc, decorations))
this.decorations = DecorationSet.create(state.doc, decorations)
return this
}
// Apply ProseMirror mapping
const decorations = this.decorations.map(transaction.mapping, transaction.doc)
return new AnnotationState(decorations)
}
this.decorations = this.decorations.map(transaction.mapping, transaction.doc)
static init(config: any, state: EditorState) {
const decorations = DecorationSet.create(state.doc, [])
return new AnnotationState(decorations)
return this
}
}