@remirror/extension-yjs 1.0.18 → 1.0.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/declarations/src/yjs-extension.d.ts +5 -4
- package/dist/remirror-extension-yjs.browser.cjs.js +125 -33
- package/dist/remirror-extension-yjs.browser.esm.js +126 -34
- package/dist/remirror-extension-yjs.cjs.dev.js +125 -33
- package/dist/remirror-extension-yjs.cjs.prod.js +125 -33
- package/dist/remirror-extension-yjs.esm.js +126 -34
- package/package.json +4 -4
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Doc } from 'yjs';
|
|
2
|
-
import { AcceptUndefined, EditorState, KeyBindingProps, NonChainableCommandFunction, OnSetOptionsProps, PlainExtension, ProsemirrorPlugin, Selection, Shape } from '@remirror/core';
|
|
2
|
+
import { AcceptUndefined, Dispose, EditorState, KeyBindingProps, NonChainableCommandFunction, OnSetOptionsProps, PlainExtension, ProsemirrorPlugin, Selection, Shape } from '@remirror/core';
|
|
3
3
|
export interface ColorDef {
|
|
4
4
|
light: string;
|
|
5
5
|
dark: string;
|
|
@@ -73,7 +73,10 @@ export declare class YjsExtension extends PlainExtension<YjsOptions> {
|
|
|
73
73
|
* The provider that is being used for the editor.
|
|
74
74
|
*/
|
|
75
75
|
get provider(): YjsRealtimeProvider;
|
|
76
|
-
|
|
76
|
+
getBinding(): {
|
|
77
|
+
mapping: Map<any, any>;
|
|
78
|
+
} | undefined;
|
|
79
|
+
onView(): Dispose | void;
|
|
77
80
|
/**
|
|
78
81
|
* Create the yjs plugins.
|
|
79
82
|
*/
|
|
@@ -110,8 +113,6 @@ export declare class YjsExtension extends PlainExtension<YjsOptions> {
|
|
|
110
113
|
* Handle the redo keybinding for the editor.
|
|
111
114
|
*/
|
|
112
115
|
redoShortcut(props: KeyBindingProps): boolean;
|
|
113
|
-
private absolutePositionToRelativePosition;
|
|
114
|
-
private relativePositionToAbsolutePosition;
|
|
115
116
|
}
|
|
116
117
|
/**
|
|
117
118
|
* The default destroy provider method.
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _applyDecoratedDescriptor = require('@babel/runtime/helpers/applyDecoratedDescriptor');
|
|
6
|
+
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
7
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
6
8
|
var yProsemirror = require('y-prosemirror');
|
|
7
9
|
var yjs = require('yjs');
|
|
8
10
|
var core = require('@remirror/core');
|
|
@@ -10,6 +12,98 @@ var extensionAnnotation = require('@remirror/extension-annotation');
|
|
|
10
12
|
var messages = require('@remirror/messages');
|
|
11
13
|
|
|
12
14
|
var _dec, _dec2, _dec3, _dec4, _dec5, _class, _class2;
|
|
15
|
+
|
|
16
|
+
var _excluded = ["from", "to"],
|
|
17
|
+
_excluded2 = ["from", "to"];
|
|
18
|
+
|
|
19
|
+
class YjsAnnotationStore {
|
|
20
|
+
constructor(doc, pmName, mapName, getMapping) {
|
|
21
|
+
this.doc = doc;
|
|
22
|
+
this.getMapping = getMapping;
|
|
23
|
+
this.type = doc.getXmlFragment(pmName);
|
|
24
|
+
this.map = doc.getMap(mapName);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
addAnnotation(_ref) {
|
|
28
|
+
var from = _ref.from,
|
|
29
|
+
to = _ref.to,
|
|
30
|
+
data = _objectWithoutProperties(_ref, _excluded);
|
|
31
|
+
|
|
32
|
+
// XXX: Why is this cast needed?
|
|
33
|
+
var storedData = _objectSpread(_objectSpread({}, data), {}, {
|
|
34
|
+
from: this.absolutePositionToRelativePosition(from),
|
|
35
|
+
to: this.absolutePositionToRelativePosition(to)
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
this.map.set(data.id, storedData);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
updateAnnotation(id, updateData) {
|
|
42
|
+
var existing = this.map.get(id);
|
|
43
|
+
|
|
44
|
+
if (!existing) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
this.map.set(id, _objectSpread(_objectSpread({}, updateData), {}, {
|
|
49
|
+
from: existing.from,
|
|
50
|
+
to: existing.to
|
|
51
|
+
}));
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
removeAnnotations(ids) {
|
|
55
|
+
yjs.transact(this.doc, () => {
|
|
56
|
+
ids.forEach(id => this.map.delete(id));
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
setAnnotations(annotations) {
|
|
61
|
+
yjs.transact(this.doc, () => {
|
|
62
|
+
this.map.clear();
|
|
63
|
+
annotations.forEach(annotation => this.addAnnotation(annotation));
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
formatAnnotations() {
|
|
68
|
+
var result = [];
|
|
69
|
+
this.map.forEach(_ref2 => {
|
|
70
|
+
var relFrom = _ref2.from,
|
|
71
|
+
relTo = _ref2.to,
|
|
72
|
+
data = _objectWithoutProperties(_ref2, _excluded2);
|
|
73
|
+
|
|
74
|
+
var from = this.relativePositionToAbsolutePosition(relFrom);
|
|
75
|
+
var to = this.relativePositionToAbsolutePosition(relTo);
|
|
76
|
+
|
|
77
|
+
if (!from || !to) {
|
|
78
|
+
return;
|
|
79
|
+
} // XXX: Why is this cast needed?
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
result.push(_objectSpread(_objectSpread({}, data), {}, {
|
|
83
|
+
from,
|
|
84
|
+
to
|
|
85
|
+
}));
|
|
86
|
+
});
|
|
87
|
+
return result;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
absolutePositionToRelativePosition(pos) {
|
|
91
|
+
var mapping = this.getMapping();
|
|
92
|
+
return yProsemirror.absolutePositionToRelativePosition(pos, this.type, mapping);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
relativePositionToAbsolutePosition(relPos) {
|
|
96
|
+
var mapping = this.getMapping();
|
|
97
|
+
return yProsemirror.relativePositionToAbsolutePosition(this.doc, this.type, relPos, mapping);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* The YJS extension is the recommended extension for creating a collaborative
|
|
103
|
+
* editor.
|
|
104
|
+
*/
|
|
105
|
+
|
|
106
|
+
|
|
13
107
|
var YjsExtension = (_dec = core.extension({
|
|
14
108
|
defaultOptions: {
|
|
15
109
|
getProvider: () => {
|
|
@@ -29,23 +123,23 @@ var YjsExtension = (_dec = core.extension({
|
|
|
29
123
|
defaultPriority: core.ExtensionPriority.High
|
|
30
124
|
}), _dec2 = core.command({
|
|
31
125
|
disableChaining: true,
|
|
32
|
-
description:
|
|
33
|
-
var t =
|
|
126
|
+
description: _ref3 => {
|
|
127
|
+
var t = _ref3.t;
|
|
34
128
|
return t(messages.ExtensionHistoryMessages.UNDO_DESCRIPTION);
|
|
35
129
|
},
|
|
36
|
-
label:
|
|
37
|
-
var t =
|
|
130
|
+
label: _ref4 => {
|
|
131
|
+
var t = _ref4.t;
|
|
38
132
|
return t(messages.ExtensionHistoryMessages.UNDO_LABEL);
|
|
39
133
|
},
|
|
40
134
|
icon: 'arrowGoBackFill'
|
|
41
135
|
}), _dec3 = core.command({
|
|
42
136
|
disableChaining: true,
|
|
43
|
-
description:
|
|
44
|
-
var t =
|
|
137
|
+
description: _ref5 => {
|
|
138
|
+
var t = _ref5.t;
|
|
45
139
|
return t(messages.ExtensionHistoryMessages.REDO_DESCRIPTION);
|
|
46
140
|
},
|
|
47
|
-
label:
|
|
48
|
-
var t =
|
|
141
|
+
label: _ref6 => {
|
|
142
|
+
var t = _ref6.t;
|
|
49
143
|
return t(messages.ExtensionHistoryMessages.REDO_LABEL);
|
|
50
144
|
},
|
|
51
145
|
icon: 'arrowGoForwardFill'
|
|
@@ -70,14 +164,27 @@ var YjsExtension = (_dec = core.extension({
|
|
|
70
164
|
return (_this$_provider = this._provider) !== null && _this$_provider !== void 0 ? _this$_provider : this._provider = getLazyValue(getProvider);
|
|
71
165
|
}
|
|
72
166
|
|
|
167
|
+
getBinding() {
|
|
168
|
+
var state = this.store.getState();
|
|
169
|
+
|
|
170
|
+
var _ySyncPluginKey$getSt = yProsemirror.ySyncPluginKey.getState(state),
|
|
171
|
+
binding = _ySyncPluginKey$getSt.binding;
|
|
172
|
+
|
|
173
|
+
return binding;
|
|
174
|
+
}
|
|
175
|
+
|
|
73
176
|
onView() {
|
|
74
177
|
try {
|
|
178
|
+
var annotationStore = new YjsAnnotationStore(this.provider.doc, 'prosemirror', 'annotations', () => {
|
|
179
|
+
var _this$getBinding;
|
|
180
|
+
|
|
181
|
+
return (_this$getBinding = this.getBinding()) === null || _this$getBinding === void 0 ? void 0 : _this$getBinding.mapping;
|
|
182
|
+
});
|
|
75
183
|
this.store.manager.getExtension(extensionAnnotation.AnnotationExtension).setOptions({
|
|
76
|
-
|
|
77
|
-
transformPosition: this.absolutePositionToRelativePosition.bind(this),
|
|
78
|
-
transformPositionBeforeRender: this.relativePositionToAbsolutePosition.bind(this)
|
|
184
|
+
getStore: () => annotationStore
|
|
79
185
|
});
|
|
80
|
-
|
|
186
|
+
|
|
187
|
+
var handler = (_update, _origin, _doc, yjsTr) => {
|
|
81
188
|
var _this$store$commands$, _this$store$commands;
|
|
82
189
|
|
|
83
190
|
// Ignore own changes
|
|
@@ -86,7 +193,12 @@ var YjsExtension = (_dec = core.extension({
|
|
|
86
193
|
}
|
|
87
194
|
|
|
88
195
|
(_this$store$commands$ = (_this$store$commands = this.store.commands).redrawAnnotations) === null || _this$store$commands$ === void 0 ? void 0 : _this$store$commands$.call(_this$store$commands);
|
|
89
|
-
}
|
|
196
|
+
};
|
|
197
|
+
|
|
198
|
+
this.provider.doc.on('update', handler);
|
|
199
|
+
return () => {
|
|
200
|
+
this.provider.doc.off('update', handler);
|
|
201
|
+
};
|
|
90
202
|
} catch (_unused) {// AnnotationExtension isn't present in editor
|
|
91
203
|
}
|
|
92
204
|
}
|
|
@@ -233,26 +345,6 @@ var YjsExtension = (_dec = core.extension({
|
|
|
233
345
|
return this.yRedo()(props);
|
|
234
346
|
}
|
|
235
347
|
|
|
236
|
-
absolutePositionToRelativePosition(pos) {
|
|
237
|
-
var state = this.store.getState();
|
|
238
|
-
|
|
239
|
-
var _ySyncPluginKey$getSt = yProsemirror.ySyncPluginKey.getState(state),
|
|
240
|
-
type = _ySyncPluginKey$getSt.type,
|
|
241
|
-
binding = _ySyncPluginKey$getSt.binding;
|
|
242
|
-
|
|
243
|
-
return yProsemirror.absolutePositionToRelativePosition(pos, type, binding.mapping);
|
|
244
|
-
}
|
|
245
|
-
|
|
246
|
-
relativePositionToAbsolutePosition(relPos) {
|
|
247
|
-
var state = this.store.getState();
|
|
248
|
-
|
|
249
|
-
var _ySyncPluginKey$getSt2 = yProsemirror.ySyncPluginKey.getState(state),
|
|
250
|
-
type = _ySyncPluginKey$getSt2.type,
|
|
251
|
-
binding = _ySyncPluginKey$getSt2.binding;
|
|
252
|
-
|
|
253
|
-
return yProsemirror.relativePositionToAbsolutePosition(this.provider.doc, type, relPos, binding.mapping);
|
|
254
|
-
}
|
|
255
|
-
|
|
256
348
|
}, (_applyDecoratedDescriptor(_class2.prototype, "yUndo", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "yUndo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "yRedo", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "yRedo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "undoShortcut", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "undoShortcut"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "redoShortcut", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "redoShortcut"), _class2.prototype)), _class2)) || _class);
|
|
257
349
|
/**
|
|
258
350
|
* The default destroy provider method.
|
|
@@ -1,11 +1,105 @@
|
|
|
1
1
|
import _applyDecoratedDescriptor from '@babel/runtime/helpers/esm/applyDecoratedDescriptor';
|
|
2
|
+
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
|
|
3
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
2
4
|
import { defaultCursorBuilder, ySyncPluginKey, defaultDeleteFilter, ySyncPlugin, yCursorPlugin, yUndoPlugin, yUndoPluginKey, undo, redo, absolutePositionToRelativePosition, relativePositionToAbsolutePosition } from 'y-prosemirror';
|
|
3
|
-
import { UndoManager } from 'yjs';
|
|
5
|
+
import { UndoManager, transact } from 'yjs';
|
|
4
6
|
import { extension, invariant, ErrorConstant, ExtensionPriority, command, keyBinding, NamedShortcut, PlainExtension, isFunction, isEmptyObject, nonChainable, convertCommand } from '@remirror/core';
|
|
5
7
|
import { AnnotationExtension } from '@remirror/extension-annotation';
|
|
6
8
|
import { ExtensionHistoryMessages } from '@remirror/messages';
|
|
7
9
|
|
|
8
10
|
var _dec, _dec2, _dec3, _dec4, _dec5, _class, _class2;
|
|
11
|
+
|
|
12
|
+
var _excluded = ["from", "to"],
|
|
13
|
+
_excluded2 = ["from", "to"];
|
|
14
|
+
|
|
15
|
+
class YjsAnnotationStore {
|
|
16
|
+
constructor(doc, pmName, mapName, getMapping) {
|
|
17
|
+
this.doc = doc;
|
|
18
|
+
this.getMapping = getMapping;
|
|
19
|
+
this.type = doc.getXmlFragment(pmName);
|
|
20
|
+
this.map = doc.getMap(mapName);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
addAnnotation(_ref) {
|
|
24
|
+
var from = _ref.from,
|
|
25
|
+
to = _ref.to,
|
|
26
|
+
data = _objectWithoutProperties(_ref, _excluded);
|
|
27
|
+
|
|
28
|
+
// XXX: Why is this cast needed?
|
|
29
|
+
var storedData = _objectSpread(_objectSpread({}, data), {}, {
|
|
30
|
+
from: this.absolutePositionToRelativePosition(from),
|
|
31
|
+
to: this.absolutePositionToRelativePosition(to)
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
this.map.set(data.id, storedData);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
updateAnnotation(id, updateData) {
|
|
38
|
+
var existing = this.map.get(id);
|
|
39
|
+
|
|
40
|
+
if (!existing) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
this.map.set(id, _objectSpread(_objectSpread({}, updateData), {}, {
|
|
45
|
+
from: existing.from,
|
|
46
|
+
to: existing.to
|
|
47
|
+
}));
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
removeAnnotations(ids) {
|
|
51
|
+
transact(this.doc, () => {
|
|
52
|
+
ids.forEach(id => this.map.delete(id));
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
setAnnotations(annotations) {
|
|
57
|
+
transact(this.doc, () => {
|
|
58
|
+
this.map.clear();
|
|
59
|
+
annotations.forEach(annotation => this.addAnnotation(annotation));
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
formatAnnotations() {
|
|
64
|
+
var result = [];
|
|
65
|
+
this.map.forEach(_ref2 => {
|
|
66
|
+
var relFrom = _ref2.from,
|
|
67
|
+
relTo = _ref2.to,
|
|
68
|
+
data = _objectWithoutProperties(_ref2, _excluded2);
|
|
69
|
+
|
|
70
|
+
var from = this.relativePositionToAbsolutePosition(relFrom);
|
|
71
|
+
var to = this.relativePositionToAbsolutePosition(relTo);
|
|
72
|
+
|
|
73
|
+
if (!from || !to) {
|
|
74
|
+
return;
|
|
75
|
+
} // XXX: Why is this cast needed?
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
result.push(_objectSpread(_objectSpread({}, data), {}, {
|
|
79
|
+
from,
|
|
80
|
+
to
|
|
81
|
+
}));
|
|
82
|
+
});
|
|
83
|
+
return result;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
absolutePositionToRelativePosition(pos) {
|
|
87
|
+
var mapping = this.getMapping();
|
|
88
|
+
return absolutePositionToRelativePosition(pos, this.type, mapping);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
relativePositionToAbsolutePosition(relPos) {
|
|
92
|
+
var mapping = this.getMapping();
|
|
93
|
+
return relativePositionToAbsolutePosition(this.doc, this.type, relPos, mapping);
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
}
|
|
97
|
+
/**
|
|
98
|
+
* The YJS extension is the recommended extension for creating a collaborative
|
|
99
|
+
* editor.
|
|
100
|
+
*/
|
|
101
|
+
|
|
102
|
+
|
|
9
103
|
var YjsExtension = (_dec = extension({
|
|
10
104
|
defaultOptions: {
|
|
11
105
|
getProvider: () => {
|
|
@@ -25,23 +119,23 @@ var YjsExtension = (_dec = extension({
|
|
|
25
119
|
defaultPriority: ExtensionPriority.High
|
|
26
120
|
}), _dec2 = command({
|
|
27
121
|
disableChaining: true,
|
|
28
|
-
description:
|
|
29
|
-
var t =
|
|
122
|
+
description: _ref3 => {
|
|
123
|
+
var t = _ref3.t;
|
|
30
124
|
return t(ExtensionHistoryMessages.UNDO_DESCRIPTION);
|
|
31
125
|
},
|
|
32
|
-
label:
|
|
33
|
-
var t =
|
|
126
|
+
label: _ref4 => {
|
|
127
|
+
var t = _ref4.t;
|
|
34
128
|
return t(ExtensionHistoryMessages.UNDO_LABEL);
|
|
35
129
|
},
|
|
36
130
|
icon: 'arrowGoBackFill'
|
|
37
131
|
}), _dec3 = command({
|
|
38
132
|
disableChaining: true,
|
|
39
|
-
description:
|
|
40
|
-
var t =
|
|
133
|
+
description: _ref5 => {
|
|
134
|
+
var t = _ref5.t;
|
|
41
135
|
return t(ExtensionHistoryMessages.REDO_DESCRIPTION);
|
|
42
136
|
},
|
|
43
|
-
label:
|
|
44
|
-
var t =
|
|
137
|
+
label: _ref6 => {
|
|
138
|
+
var t = _ref6.t;
|
|
45
139
|
return t(ExtensionHistoryMessages.REDO_LABEL);
|
|
46
140
|
},
|
|
47
141
|
icon: 'arrowGoForwardFill'
|
|
@@ -66,14 +160,27 @@ var YjsExtension = (_dec = extension({
|
|
|
66
160
|
return (_this$_provider = this._provider) !== null && _this$_provider !== void 0 ? _this$_provider : this._provider = getLazyValue(getProvider);
|
|
67
161
|
}
|
|
68
162
|
|
|
163
|
+
getBinding() {
|
|
164
|
+
var state = this.store.getState();
|
|
165
|
+
|
|
166
|
+
var _ySyncPluginKey$getSt = ySyncPluginKey.getState(state),
|
|
167
|
+
binding = _ySyncPluginKey$getSt.binding;
|
|
168
|
+
|
|
169
|
+
return binding;
|
|
170
|
+
}
|
|
171
|
+
|
|
69
172
|
onView() {
|
|
70
173
|
try {
|
|
174
|
+
var annotationStore = new YjsAnnotationStore(this.provider.doc, 'prosemirror', 'annotations', () => {
|
|
175
|
+
var _this$getBinding;
|
|
176
|
+
|
|
177
|
+
return (_this$getBinding = this.getBinding()) === null || _this$getBinding === void 0 ? void 0 : _this$getBinding.mapping;
|
|
178
|
+
});
|
|
71
179
|
this.store.manager.getExtension(AnnotationExtension).setOptions({
|
|
72
|
-
|
|
73
|
-
transformPosition: this.absolutePositionToRelativePosition.bind(this),
|
|
74
|
-
transformPositionBeforeRender: this.relativePositionToAbsolutePosition.bind(this)
|
|
180
|
+
getStore: () => annotationStore
|
|
75
181
|
});
|
|
76
|
-
|
|
182
|
+
|
|
183
|
+
var handler = (_update, _origin, _doc, yjsTr) => {
|
|
77
184
|
var _this$store$commands$, _this$store$commands;
|
|
78
185
|
|
|
79
186
|
// Ignore own changes
|
|
@@ -82,7 +189,12 @@ var YjsExtension = (_dec = extension({
|
|
|
82
189
|
}
|
|
83
190
|
|
|
84
191
|
(_this$store$commands$ = (_this$store$commands = this.store.commands).redrawAnnotations) === null || _this$store$commands$ === void 0 ? void 0 : _this$store$commands$.call(_this$store$commands);
|
|
85
|
-
}
|
|
192
|
+
};
|
|
193
|
+
|
|
194
|
+
this.provider.doc.on('update', handler);
|
|
195
|
+
return () => {
|
|
196
|
+
this.provider.doc.off('update', handler);
|
|
197
|
+
};
|
|
86
198
|
} catch (_unused) {// AnnotationExtension isn't present in editor
|
|
87
199
|
}
|
|
88
200
|
}
|
|
@@ -229,26 +341,6 @@ var YjsExtension = (_dec = extension({
|
|
|
229
341
|
return this.yRedo()(props);
|
|
230
342
|
}
|
|
231
343
|
|
|
232
|
-
absolutePositionToRelativePosition(pos) {
|
|
233
|
-
var state = this.store.getState();
|
|
234
|
-
|
|
235
|
-
var _ySyncPluginKey$getSt = ySyncPluginKey.getState(state),
|
|
236
|
-
type = _ySyncPluginKey$getSt.type,
|
|
237
|
-
binding = _ySyncPluginKey$getSt.binding;
|
|
238
|
-
|
|
239
|
-
return absolutePositionToRelativePosition(pos, type, binding.mapping);
|
|
240
|
-
}
|
|
241
|
-
|
|
242
|
-
relativePositionToAbsolutePosition(relPos) {
|
|
243
|
-
var state = this.store.getState();
|
|
244
|
-
|
|
245
|
-
var _ySyncPluginKey$getSt2 = ySyncPluginKey.getState(state),
|
|
246
|
-
type = _ySyncPluginKey$getSt2.type,
|
|
247
|
-
binding = _ySyncPluginKey$getSt2.binding;
|
|
248
|
-
|
|
249
|
-
return relativePositionToAbsolutePosition(this.provider.doc, type, relPos, binding.mapping);
|
|
250
|
-
}
|
|
251
|
-
|
|
252
344
|
}, (_applyDecoratedDescriptor(_class2.prototype, "yUndo", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "yUndo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "yRedo", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "yRedo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "undoShortcut", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "undoShortcut"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "redoShortcut", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "redoShortcut"), _class2.prototype)), _class2)) || _class);
|
|
253
345
|
/**
|
|
254
346
|
* The default destroy provider method.
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _applyDecoratedDescriptor = require('@babel/runtime/helpers/applyDecoratedDescriptor');
|
|
6
|
+
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
7
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
6
8
|
var yProsemirror = require('y-prosemirror');
|
|
7
9
|
var yjs = require('yjs');
|
|
8
10
|
var core = require('@remirror/core');
|
|
@@ -10,6 +12,98 @@ var extensionAnnotation = require('@remirror/extension-annotation');
|
|
|
10
12
|
var messages = require('@remirror/messages');
|
|
11
13
|
|
|
12
14
|
var _dec, _dec2, _dec3, _dec4, _dec5, _class, _class2;
|
|
15
|
+
|
|
16
|
+
var _excluded = ["from", "to"],
|
|
17
|
+
_excluded2 = ["from", "to"];
|
|
18
|
+
|
|
19
|
+
class YjsAnnotationStore {
|
|
20
|
+
constructor(doc, pmName, mapName, getMapping) {
|
|
21
|
+
this.doc = doc;
|
|
22
|
+
this.getMapping = getMapping;
|
|
23
|
+
this.type = doc.getXmlFragment(pmName);
|
|
24
|
+
this.map = doc.getMap(mapName);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
addAnnotation(_ref) {
|
|
28
|
+
var from = _ref.from,
|
|
29
|
+
to = _ref.to,
|
|
30
|
+
data = _objectWithoutProperties(_ref, _excluded);
|
|
31
|
+
|
|
32
|
+
// XXX: Why is this cast needed?
|
|
33
|
+
var storedData = _objectSpread(_objectSpread({}, data), {}, {
|
|
34
|
+
from: this.absolutePositionToRelativePosition(from),
|
|
35
|
+
to: this.absolutePositionToRelativePosition(to)
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
this.map.set(data.id, storedData);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
updateAnnotation(id, updateData) {
|
|
42
|
+
var existing = this.map.get(id);
|
|
43
|
+
|
|
44
|
+
if (!existing) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
this.map.set(id, _objectSpread(_objectSpread({}, updateData), {}, {
|
|
49
|
+
from: existing.from,
|
|
50
|
+
to: existing.to
|
|
51
|
+
}));
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
removeAnnotations(ids) {
|
|
55
|
+
yjs.transact(this.doc, () => {
|
|
56
|
+
ids.forEach(id => this.map.delete(id));
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
setAnnotations(annotations) {
|
|
61
|
+
yjs.transact(this.doc, () => {
|
|
62
|
+
this.map.clear();
|
|
63
|
+
annotations.forEach(annotation => this.addAnnotation(annotation));
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
formatAnnotations() {
|
|
68
|
+
var result = [];
|
|
69
|
+
this.map.forEach(_ref2 => {
|
|
70
|
+
var relFrom = _ref2.from,
|
|
71
|
+
relTo = _ref2.to,
|
|
72
|
+
data = _objectWithoutProperties(_ref2, _excluded2);
|
|
73
|
+
|
|
74
|
+
var from = this.relativePositionToAbsolutePosition(relFrom);
|
|
75
|
+
var to = this.relativePositionToAbsolutePosition(relTo);
|
|
76
|
+
|
|
77
|
+
if (!from || !to) {
|
|
78
|
+
return;
|
|
79
|
+
} // XXX: Why is this cast needed?
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
result.push(_objectSpread(_objectSpread({}, data), {}, {
|
|
83
|
+
from,
|
|
84
|
+
to
|
|
85
|
+
}));
|
|
86
|
+
});
|
|
87
|
+
return result;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
absolutePositionToRelativePosition(pos) {
|
|
91
|
+
var mapping = this.getMapping();
|
|
92
|
+
return yProsemirror.absolutePositionToRelativePosition(pos, this.type, mapping);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
relativePositionToAbsolutePosition(relPos) {
|
|
96
|
+
var mapping = this.getMapping();
|
|
97
|
+
return yProsemirror.relativePositionToAbsolutePosition(this.doc, this.type, relPos, mapping);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* The YJS extension is the recommended extension for creating a collaborative
|
|
103
|
+
* editor.
|
|
104
|
+
*/
|
|
105
|
+
|
|
106
|
+
|
|
13
107
|
var YjsExtension = (_dec = core.extension({
|
|
14
108
|
defaultOptions: {
|
|
15
109
|
getProvider: () => {
|
|
@@ -29,23 +123,23 @@ var YjsExtension = (_dec = core.extension({
|
|
|
29
123
|
defaultPriority: core.ExtensionPriority.High
|
|
30
124
|
}), _dec2 = core.command({
|
|
31
125
|
disableChaining: true,
|
|
32
|
-
description:
|
|
33
|
-
var t =
|
|
126
|
+
description: _ref3 => {
|
|
127
|
+
var t = _ref3.t;
|
|
34
128
|
return t(messages.ExtensionHistoryMessages.UNDO_DESCRIPTION);
|
|
35
129
|
},
|
|
36
|
-
label:
|
|
37
|
-
var t =
|
|
130
|
+
label: _ref4 => {
|
|
131
|
+
var t = _ref4.t;
|
|
38
132
|
return t(messages.ExtensionHistoryMessages.UNDO_LABEL);
|
|
39
133
|
},
|
|
40
134
|
icon: 'arrowGoBackFill'
|
|
41
135
|
}), _dec3 = core.command({
|
|
42
136
|
disableChaining: true,
|
|
43
|
-
description:
|
|
44
|
-
var t =
|
|
137
|
+
description: _ref5 => {
|
|
138
|
+
var t = _ref5.t;
|
|
45
139
|
return t(messages.ExtensionHistoryMessages.REDO_DESCRIPTION);
|
|
46
140
|
},
|
|
47
|
-
label:
|
|
48
|
-
var t =
|
|
141
|
+
label: _ref6 => {
|
|
142
|
+
var t = _ref6.t;
|
|
49
143
|
return t(messages.ExtensionHistoryMessages.REDO_LABEL);
|
|
50
144
|
},
|
|
51
145
|
icon: 'arrowGoForwardFill'
|
|
@@ -70,14 +164,27 @@ var YjsExtension = (_dec = core.extension({
|
|
|
70
164
|
return (_this$_provider = this._provider) !== null && _this$_provider !== void 0 ? _this$_provider : this._provider = getLazyValue(getProvider);
|
|
71
165
|
}
|
|
72
166
|
|
|
167
|
+
getBinding() {
|
|
168
|
+
var state = this.store.getState();
|
|
169
|
+
|
|
170
|
+
var _ySyncPluginKey$getSt = yProsemirror.ySyncPluginKey.getState(state),
|
|
171
|
+
binding = _ySyncPluginKey$getSt.binding;
|
|
172
|
+
|
|
173
|
+
return binding;
|
|
174
|
+
}
|
|
175
|
+
|
|
73
176
|
onView() {
|
|
74
177
|
try {
|
|
178
|
+
var annotationStore = new YjsAnnotationStore(this.provider.doc, 'prosemirror', 'annotations', () => {
|
|
179
|
+
var _this$getBinding;
|
|
180
|
+
|
|
181
|
+
return (_this$getBinding = this.getBinding()) === null || _this$getBinding === void 0 ? void 0 : _this$getBinding.mapping;
|
|
182
|
+
});
|
|
75
183
|
this.store.manager.getExtension(extensionAnnotation.AnnotationExtension).setOptions({
|
|
76
|
-
|
|
77
|
-
transformPosition: this.absolutePositionToRelativePosition.bind(this),
|
|
78
|
-
transformPositionBeforeRender: this.relativePositionToAbsolutePosition.bind(this)
|
|
184
|
+
getStore: () => annotationStore
|
|
79
185
|
});
|
|
80
|
-
|
|
186
|
+
|
|
187
|
+
var handler = (_update, _origin, _doc, yjsTr) => {
|
|
81
188
|
var _this$store$commands$, _this$store$commands;
|
|
82
189
|
|
|
83
190
|
// Ignore own changes
|
|
@@ -86,7 +193,12 @@ var YjsExtension = (_dec = core.extension({
|
|
|
86
193
|
}
|
|
87
194
|
|
|
88
195
|
(_this$store$commands$ = (_this$store$commands = this.store.commands).redrawAnnotations) === null || _this$store$commands$ === void 0 ? void 0 : _this$store$commands$.call(_this$store$commands);
|
|
89
|
-
}
|
|
196
|
+
};
|
|
197
|
+
|
|
198
|
+
this.provider.doc.on('update', handler);
|
|
199
|
+
return () => {
|
|
200
|
+
this.provider.doc.off('update', handler);
|
|
201
|
+
};
|
|
90
202
|
} catch (_unused) {// AnnotationExtension isn't present in editor
|
|
91
203
|
}
|
|
92
204
|
}
|
|
@@ -233,26 +345,6 @@ var YjsExtension = (_dec = core.extension({
|
|
|
233
345
|
return this.yRedo()(props);
|
|
234
346
|
}
|
|
235
347
|
|
|
236
|
-
absolutePositionToRelativePosition(pos) {
|
|
237
|
-
var state = this.store.getState();
|
|
238
|
-
|
|
239
|
-
var _ySyncPluginKey$getSt = yProsemirror.ySyncPluginKey.getState(state),
|
|
240
|
-
type = _ySyncPluginKey$getSt.type,
|
|
241
|
-
binding = _ySyncPluginKey$getSt.binding;
|
|
242
|
-
|
|
243
|
-
return yProsemirror.absolutePositionToRelativePosition(pos, type, binding.mapping);
|
|
244
|
-
}
|
|
245
|
-
|
|
246
|
-
relativePositionToAbsolutePosition(relPos) {
|
|
247
|
-
var state = this.store.getState();
|
|
248
|
-
|
|
249
|
-
var _ySyncPluginKey$getSt2 = yProsemirror.ySyncPluginKey.getState(state),
|
|
250
|
-
type = _ySyncPluginKey$getSt2.type,
|
|
251
|
-
binding = _ySyncPluginKey$getSt2.binding;
|
|
252
|
-
|
|
253
|
-
return yProsemirror.relativePositionToAbsolutePosition(this.provider.doc, type, relPos, binding.mapping);
|
|
254
|
-
}
|
|
255
|
-
|
|
256
348
|
}, (_applyDecoratedDescriptor(_class2.prototype, "yUndo", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "yUndo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "yRedo", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "yRedo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "undoShortcut", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "undoShortcut"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "redoShortcut", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "redoShortcut"), _class2.prototype)), _class2)) || _class);
|
|
257
349
|
/**
|
|
258
350
|
* The default destroy provider method.
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _applyDecoratedDescriptor = require('@babel/runtime/helpers/applyDecoratedDescriptor');
|
|
6
|
+
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
7
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
6
8
|
var yProsemirror = require('y-prosemirror');
|
|
7
9
|
var yjs = require('yjs');
|
|
8
10
|
var core = require('@remirror/core');
|
|
@@ -10,6 +12,98 @@ var extensionAnnotation = require('@remirror/extension-annotation');
|
|
|
10
12
|
var messages = require('@remirror/messages');
|
|
11
13
|
|
|
12
14
|
var _dec, _dec2, _dec3, _dec4, _dec5, _class, _class2;
|
|
15
|
+
|
|
16
|
+
var _excluded = ["from", "to"],
|
|
17
|
+
_excluded2 = ["from", "to"];
|
|
18
|
+
|
|
19
|
+
class YjsAnnotationStore {
|
|
20
|
+
constructor(doc, pmName, mapName, getMapping) {
|
|
21
|
+
this.doc = doc;
|
|
22
|
+
this.getMapping = getMapping;
|
|
23
|
+
this.type = doc.getXmlFragment(pmName);
|
|
24
|
+
this.map = doc.getMap(mapName);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
addAnnotation(_ref) {
|
|
28
|
+
var from = _ref.from,
|
|
29
|
+
to = _ref.to,
|
|
30
|
+
data = _objectWithoutProperties(_ref, _excluded);
|
|
31
|
+
|
|
32
|
+
// XXX: Why is this cast needed?
|
|
33
|
+
var storedData = _objectSpread(_objectSpread({}, data), {}, {
|
|
34
|
+
from: this.absolutePositionToRelativePosition(from),
|
|
35
|
+
to: this.absolutePositionToRelativePosition(to)
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
this.map.set(data.id, storedData);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
updateAnnotation(id, updateData) {
|
|
42
|
+
var existing = this.map.get(id);
|
|
43
|
+
|
|
44
|
+
if (!existing) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
this.map.set(id, _objectSpread(_objectSpread({}, updateData), {}, {
|
|
49
|
+
from: existing.from,
|
|
50
|
+
to: existing.to
|
|
51
|
+
}));
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
removeAnnotations(ids) {
|
|
55
|
+
yjs.transact(this.doc, () => {
|
|
56
|
+
ids.forEach(id => this.map.delete(id));
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
setAnnotations(annotations) {
|
|
61
|
+
yjs.transact(this.doc, () => {
|
|
62
|
+
this.map.clear();
|
|
63
|
+
annotations.forEach(annotation => this.addAnnotation(annotation));
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
formatAnnotations() {
|
|
68
|
+
var result = [];
|
|
69
|
+
this.map.forEach(_ref2 => {
|
|
70
|
+
var relFrom = _ref2.from,
|
|
71
|
+
relTo = _ref2.to,
|
|
72
|
+
data = _objectWithoutProperties(_ref2, _excluded2);
|
|
73
|
+
|
|
74
|
+
var from = this.relativePositionToAbsolutePosition(relFrom);
|
|
75
|
+
var to = this.relativePositionToAbsolutePosition(relTo);
|
|
76
|
+
|
|
77
|
+
if (!from || !to) {
|
|
78
|
+
return;
|
|
79
|
+
} // XXX: Why is this cast needed?
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
result.push(_objectSpread(_objectSpread({}, data), {}, {
|
|
83
|
+
from,
|
|
84
|
+
to
|
|
85
|
+
}));
|
|
86
|
+
});
|
|
87
|
+
return result;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
absolutePositionToRelativePosition(pos) {
|
|
91
|
+
var mapping = this.getMapping();
|
|
92
|
+
return yProsemirror.absolutePositionToRelativePosition(pos, this.type, mapping);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
relativePositionToAbsolutePosition(relPos) {
|
|
96
|
+
var mapping = this.getMapping();
|
|
97
|
+
return yProsemirror.relativePositionToAbsolutePosition(this.doc, this.type, relPos, mapping);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* The YJS extension is the recommended extension for creating a collaborative
|
|
103
|
+
* editor.
|
|
104
|
+
*/
|
|
105
|
+
|
|
106
|
+
|
|
13
107
|
var YjsExtension = (_dec = core.extension({
|
|
14
108
|
defaultOptions: {
|
|
15
109
|
getProvider: () => {
|
|
@@ -26,23 +120,23 @@ var YjsExtension = (_dec = core.extension({
|
|
|
26
120
|
defaultPriority: core.ExtensionPriority.High
|
|
27
121
|
}), _dec2 = core.command({
|
|
28
122
|
disableChaining: true,
|
|
29
|
-
description:
|
|
30
|
-
var t =
|
|
123
|
+
description: _ref3 => {
|
|
124
|
+
var t = _ref3.t;
|
|
31
125
|
return t(messages.ExtensionHistoryMessages.UNDO_DESCRIPTION);
|
|
32
126
|
},
|
|
33
|
-
label:
|
|
34
|
-
var t =
|
|
127
|
+
label: _ref4 => {
|
|
128
|
+
var t = _ref4.t;
|
|
35
129
|
return t(messages.ExtensionHistoryMessages.UNDO_LABEL);
|
|
36
130
|
},
|
|
37
131
|
icon: 'arrowGoBackFill'
|
|
38
132
|
}), _dec3 = core.command({
|
|
39
133
|
disableChaining: true,
|
|
40
|
-
description:
|
|
41
|
-
var t =
|
|
134
|
+
description: _ref5 => {
|
|
135
|
+
var t = _ref5.t;
|
|
42
136
|
return t(messages.ExtensionHistoryMessages.REDO_DESCRIPTION);
|
|
43
137
|
},
|
|
44
|
-
label:
|
|
45
|
-
var t =
|
|
138
|
+
label: _ref6 => {
|
|
139
|
+
var t = _ref6.t;
|
|
46
140
|
return t(messages.ExtensionHistoryMessages.REDO_LABEL);
|
|
47
141
|
},
|
|
48
142
|
icon: 'arrowGoForwardFill'
|
|
@@ -67,14 +161,27 @@ var YjsExtension = (_dec = core.extension({
|
|
|
67
161
|
return (_this$_provider = this._provider) !== null && _this$_provider !== void 0 ? _this$_provider : this._provider = getLazyValue(getProvider);
|
|
68
162
|
}
|
|
69
163
|
|
|
164
|
+
getBinding() {
|
|
165
|
+
var state = this.store.getState();
|
|
166
|
+
|
|
167
|
+
var _ySyncPluginKey$getSt = yProsemirror.ySyncPluginKey.getState(state),
|
|
168
|
+
binding = _ySyncPluginKey$getSt.binding;
|
|
169
|
+
|
|
170
|
+
return binding;
|
|
171
|
+
}
|
|
172
|
+
|
|
70
173
|
onView() {
|
|
71
174
|
try {
|
|
175
|
+
var annotationStore = new YjsAnnotationStore(this.provider.doc, 'prosemirror', 'annotations', () => {
|
|
176
|
+
var _this$getBinding;
|
|
177
|
+
|
|
178
|
+
return (_this$getBinding = this.getBinding()) === null || _this$getBinding === void 0 ? void 0 : _this$getBinding.mapping;
|
|
179
|
+
});
|
|
72
180
|
this.store.manager.getExtension(extensionAnnotation.AnnotationExtension).setOptions({
|
|
73
|
-
|
|
74
|
-
transformPosition: this.absolutePositionToRelativePosition.bind(this),
|
|
75
|
-
transformPositionBeforeRender: this.relativePositionToAbsolutePosition.bind(this)
|
|
181
|
+
getStore: () => annotationStore
|
|
76
182
|
});
|
|
77
|
-
|
|
183
|
+
|
|
184
|
+
var handler = (_update, _origin, _doc, yjsTr) => {
|
|
78
185
|
var _this$store$commands$, _this$store$commands;
|
|
79
186
|
|
|
80
187
|
// Ignore own changes
|
|
@@ -83,7 +190,12 @@ var YjsExtension = (_dec = core.extension({
|
|
|
83
190
|
}
|
|
84
191
|
|
|
85
192
|
(_this$store$commands$ = (_this$store$commands = this.store.commands).redrawAnnotations) === null || _this$store$commands$ === void 0 ? void 0 : _this$store$commands$.call(_this$store$commands);
|
|
86
|
-
}
|
|
193
|
+
};
|
|
194
|
+
|
|
195
|
+
this.provider.doc.on('update', handler);
|
|
196
|
+
return () => {
|
|
197
|
+
this.provider.doc.off('update', handler);
|
|
198
|
+
};
|
|
87
199
|
} catch (_unused) {// AnnotationExtension isn't present in editor
|
|
88
200
|
}
|
|
89
201
|
}
|
|
@@ -230,26 +342,6 @@ var YjsExtension = (_dec = core.extension({
|
|
|
230
342
|
return this.yRedo()(props);
|
|
231
343
|
}
|
|
232
344
|
|
|
233
|
-
absolutePositionToRelativePosition(pos) {
|
|
234
|
-
var state = this.store.getState();
|
|
235
|
-
|
|
236
|
-
var _ySyncPluginKey$getSt = yProsemirror.ySyncPluginKey.getState(state),
|
|
237
|
-
type = _ySyncPluginKey$getSt.type,
|
|
238
|
-
binding = _ySyncPluginKey$getSt.binding;
|
|
239
|
-
|
|
240
|
-
return yProsemirror.absolutePositionToRelativePosition(pos, type, binding.mapping);
|
|
241
|
-
}
|
|
242
|
-
|
|
243
|
-
relativePositionToAbsolutePosition(relPos) {
|
|
244
|
-
var state = this.store.getState();
|
|
245
|
-
|
|
246
|
-
var _ySyncPluginKey$getSt2 = yProsemirror.ySyncPluginKey.getState(state),
|
|
247
|
-
type = _ySyncPluginKey$getSt2.type,
|
|
248
|
-
binding = _ySyncPluginKey$getSt2.binding;
|
|
249
|
-
|
|
250
|
-
return yProsemirror.relativePositionToAbsolutePosition(this.provider.doc, type, relPos, binding.mapping);
|
|
251
|
-
}
|
|
252
|
-
|
|
253
345
|
}, (_applyDecoratedDescriptor(_class2.prototype, "yUndo", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "yUndo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "yRedo", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "yRedo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "undoShortcut", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "undoShortcut"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "redoShortcut", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "redoShortcut"), _class2.prototype)), _class2)) || _class);
|
|
254
346
|
/**
|
|
255
347
|
* The default destroy provider method.
|
|
@@ -1,11 +1,105 @@
|
|
|
1
1
|
import _applyDecoratedDescriptor from '@babel/runtime/helpers/esm/applyDecoratedDescriptor';
|
|
2
|
+
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
|
|
3
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
2
4
|
import { defaultCursorBuilder, ySyncPluginKey, defaultDeleteFilter, ySyncPlugin, yCursorPlugin, yUndoPlugin, yUndoPluginKey, undo, redo, absolutePositionToRelativePosition, relativePositionToAbsolutePosition } from 'y-prosemirror';
|
|
3
|
-
import { UndoManager } from 'yjs';
|
|
5
|
+
import { UndoManager, transact } from 'yjs';
|
|
4
6
|
import { extension, invariant, ErrorConstant, ExtensionPriority, command, keyBinding, NamedShortcut, PlainExtension, isFunction, isEmptyObject, nonChainable, convertCommand } from '@remirror/core';
|
|
5
7
|
import { AnnotationExtension } from '@remirror/extension-annotation';
|
|
6
8
|
import { ExtensionHistoryMessages } from '@remirror/messages';
|
|
7
9
|
|
|
8
10
|
var _dec, _dec2, _dec3, _dec4, _dec5, _class, _class2;
|
|
11
|
+
|
|
12
|
+
var _excluded = ["from", "to"],
|
|
13
|
+
_excluded2 = ["from", "to"];
|
|
14
|
+
|
|
15
|
+
class YjsAnnotationStore {
|
|
16
|
+
constructor(doc, pmName, mapName, getMapping) {
|
|
17
|
+
this.doc = doc;
|
|
18
|
+
this.getMapping = getMapping;
|
|
19
|
+
this.type = doc.getXmlFragment(pmName);
|
|
20
|
+
this.map = doc.getMap(mapName);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
addAnnotation(_ref) {
|
|
24
|
+
var from = _ref.from,
|
|
25
|
+
to = _ref.to,
|
|
26
|
+
data = _objectWithoutProperties(_ref, _excluded);
|
|
27
|
+
|
|
28
|
+
// XXX: Why is this cast needed?
|
|
29
|
+
var storedData = _objectSpread(_objectSpread({}, data), {}, {
|
|
30
|
+
from: this.absolutePositionToRelativePosition(from),
|
|
31
|
+
to: this.absolutePositionToRelativePosition(to)
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
this.map.set(data.id, storedData);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
updateAnnotation(id, updateData) {
|
|
38
|
+
var existing = this.map.get(id);
|
|
39
|
+
|
|
40
|
+
if (!existing) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
this.map.set(id, _objectSpread(_objectSpread({}, updateData), {}, {
|
|
45
|
+
from: existing.from,
|
|
46
|
+
to: existing.to
|
|
47
|
+
}));
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
removeAnnotations(ids) {
|
|
51
|
+
transact(this.doc, () => {
|
|
52
|
+
ids.forEach(id => this.map.delete(id));
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
setAnnotations(annotations) {
|
|
57
|
+
transact(this.doc, () => {
|
|
58
|
+
this.map.clear();
|
|
59
|
+
annotations.forEach(annotation => this.addAnnotation(annotation));
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
formatAnnotations() {
|
|
64
|
+
var result = [];
|
|
65
|
+
this.map.forEach(_ref2 => {
|
|
66
|
+
var relFrom = _ref2.from,
|
|
67
|
+
relTo = _ref2.to,
|
|
68
|
+
data = _objectWithoutProperties(_ref2, _excluded2);
|
|
69
|
+
|
|
70
|
+
var from = this.relativePositionToAbsolutePosition(relFrom);
|
|
71
|
+
var to = this.relativePositionToAbsolutePosition(relTo);
|
|
72
|
+
|
|
73
|
+
if (!from || !to) {
|
|
74
|
+
return;
|
|
75
|
+
} // XXX: Why is this cast needed?
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
result.push(_objectSpread(_objectSpread({}, data), {}, {
|
|
79
|
+
from,
|
|
80
|
+
to
|
|
81
|
+
}));
|
|
82
|
+
});
|
|
83
|
+
return result;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
absolutePositionToRelativePosition(pos) {
|
|
87
|
+
var mapping = this.getMapping();
|
|
88
|
+
return absolutePositionToRelativePosition(pos, this.type, mapping);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
relativePositionToAbsolutePosition(relPos) {
|
|
92
|
+
var mapping = this.getMapping();
|
|
93
|
+
return relativePositionToAbsolutePosition(this.doc, this.type, relPos, mapping);
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
}
|
|
97
|
+
/**
|
|
98
|
+
* The YJS extension is the recommended extension for creating a collaborative
|
|
99
|
+
* editor.
|
|
100
|
+
*/
|
|
101
|
+
|
|
102
|
+
|
|
9
103
|
var YjsExtension = (_dec = extension({
|
|
10
104
|
defaultOptions: {
|
|
11
105
|
getProvider: () => {
|
|
@@ -25,23 +119,23 @@ var YjsExtension = (_dec = extension({
|
|
|
25
119
|
defaultPriority: ExtensionPriority.High
|
|
26
120
|
}), _dec2 = command({
|
|
27
121
|
disableChaining: true,
|
|
28
|
-
description:
|
|
29
|
-
var t =
|
|
122
|
+
description: _ref3 => {
|
|
123
|
+
var t = _ref3.t;
|
|
30
124
|
return t(ExtensionHistoryMessages.UNDO_DESCRIPTION);
|
|
31
125
|
},
|
|
32
|
-
label:
|
|
33
|
-
var t =
|
|
126
|
+
label: _ref4 => {
|
|
127
|
+
var t = _ref4.t;
|
|
34
128
|
return t(ExtensionHistoryMessages.UNDO_LABEL);
|
|
35
129
|
},
|
|
36
130
|
icon: 'arrowGoBackFill'
|
|
37
131
|
}), _dec3 = command({
|
|
38
132
|
disableChaining: true,
|
|
39
|
-
description:
|
|
40
|
-
var t =
|
|
133
|
+
description: _ref5 => {
|
|
134
|
+
var t = _ref5.t;
|
|
41
135
|
return t(ExtensionHistoryMessages.REDO_DESCRIPTION);
|
|
42
136
|
},
|
|
43
|
-
label:
|
|
44
|
-
var t =
|
|
137
|
+
label: _ref6 => {
|
|
138
|
+
var t = _ref6.t;
|
|
45
139
|
return t(ExtensionHistoryMessages.REDO_LABEL);
|
|
46
140
|
},
|
|
47
141
|
icon: 'arrowGoForwardFill'
|
|
@@ -66,14 +160,27 @@ var YjsExtension = (_dec = extension({
|
|
|
66
160
|
return (_this$_provider = this._provider) !== null && _this$_provider !== void 0 ? _this$_provider : this._provider = getLazyValue(getProvider);
|
|
67
161
|
}
|
|
68
162
|
|
|
163
|
+
getBinding() {
|
|
164
|
+
var state = this.store.getState();
|
|
165
|
+
|
|
166
|
+
var _ySyncPluginKey$getSt = ySyncPluginKey.getState(state),
|
|
167
|
+
binding = _ySyncPluginKey$getSt.binding;
|
|
168
|
+
|
|
169
|
+
return binding;
|
|
170
|
+
}
|
|
171
|
+
|
|
69
172
|
onView() {
|
|
70
173
|
try {
|
|
174
|
+
var annotationStore = new YjsAnnotationStore(this.provider.doc, 'prosemirror', 'annotations', () => {
|
|
175
|
+
var _this$getBinding;
|
|
176
|
+
|
|
177
|
+
return (_this$getBinding = this.getBinding()) === null || _this$getBinding === void 0 ? void 0 : _this$getBinding.mapping;
|
|
178
|
+
});
|
|
71
179
|
this.store.manager.getExtension(AnnotationExtension).setOptions({
|
|
72
|
-
|
|
73
|
-
transformPosition: this.absolutePositionToRelativePosition.bind(this),
|
|
74
|
-
transformPositionBeforeRender: this.relativePositionToAbsolutePosition.bind(this)
|
|
180
|
+
getStore: () => annotationStore
|
|
75
181
|
});
|
|
76
|
-
|
|
182
|
+
|
|
183
|
+
var handler = (_update, _origin, _doc, yjsTr) => {
|
|
77
184
|
var _this$store$commands$, _this$store$commands;
|
|
78
185
|
|
|
79
186
|
// Ignore own changes
|
|
@@ -82,7 +189,12 @@ var YjsExtension = (_dec = extension({
|
|
|
82
189
|
}
|
|
83
190
|
|
|
84
191
|
(_this$store$commands$ = (_this$store$commands = this.store.commands).redrawAnnotations) === null || _this$store$commands$ === void 0 ? void 0 : _this$store$commands$.call(_this$store$commands);
|
|
85
|
-
}
|
|
192
|
+
};
|
|
193
|
+
|
|
194
|
+
this.provider.doc.on('update', handler);
|
|
195
|
+
return () => {
|
|
196
|
+
this.provider.doc.off('update', handler);
|
|
197
|
+
};
|
|
86
198
|
} catch (_unused) {// AnnotationExtension isn't present in editor
|
|
87
199
|
}
|
|
88
200
|
}
|
|
@@ -229,26 +341,6 @@ var YjsExtension = (_dec = extension({
|
|
|
229
341
|
return this.yRedo()(props);
|
|
230
342
|
}
|
|
231
343
|
|
|
232
|
-
absolutePositionToRelativePosition(pos) {
|
|
233
|
-
var state = this.store.getState();
|
|
234
|
-
|
|
235
|
-
var _ySyncPluginKey$getSt = ySyncPluginKey.getState(state),
|
|
236
|
-
type = _ySyncPluginKey$getSt.type,
|
|
237
|
-
binding = _ySyncPluginKey$getSt.binding;
|
|
238
|
-
|
|
239
|
-
return absolutePositionToRelativePosition(pos, type, binding.mapping);
|
|
240
|
-
}
|
|
241
|
-
|
|
242
|
-
relativePositionToAbsolutePosition(relPos) {
|
|
243
|
-
var state = this.store.getState();
|
|
244
|
-
|
|
245
|
-
var _ySyncPluginKey$getSt2 = ySyncPluginKey.getState(state),
|
|
246
|
-
type = _ySyncPluginKey$getSt2.type,
|
|
247
|
-
binding = _ySyncPluginKey$getSt2.binding;
|
|
248
|
-
|
|
249
|
-
return relativePositionToAbsolutePosition(this.provider.doc, type, relPos, binding.mapping);
|
|
250
|
-
}
|
|
251
|
-
|
|
252
344
|
}, (_applyDecoratedDescriptor(_class2.prototype, "yUndo", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "yUndo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "yRedo", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "yRedo"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "undoShortcut", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "undoShortcut"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "redoShortcut", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "redoShortcut"), _class2.prototype)), _class2)) || _class);
|
|
253
345
|
/**
|
|
254
346
|
* The default destroy provider method.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remirror/extension-yjs",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.22",
|
|
4
4
|
"description": "Realtime collaboration with yjs",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"remirror",
|
|
@@ -44,14 +44,14 @@
|
|
|
44
44
|
],
|
|
45
45
|
"dependencies": {
|
|
46
46
|
"@babel/runtime": "^7.13.10",
|
|
47
|
-
"@remirror/core": "^1.3.
|
|
48
|
-
"@remirror/extension-annotation": "^1.1.
|
|
47
|
+
"@remirror/core": "^1.3.4",
|
|
48
|
+
"@remirror/extension-annotation": "^1.1.13",
|
|
49
49
|
"@remirror/messages": "^1.0.6",
|
|
50
50
|
"y-prosemirror": "^1.0.14",
|
|
51
51
|
"y-protocols": "^1.0.5"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
|
-
"@remirror/pm": "^1.0.
|
|
54
|
+
"@remirror/pm": "^1.0.11",
|
|
55
55
|
"y-webrtc": "^10.2.2",
|
|
56
56
|
"yjs": "^13.5.23"
|
|
57
57
|
},
|