@kerebron/extension-basic-editor 0.6.7 → 0.7.0
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/esm/BasicEditorKit.d.ts.map +1 -1
- package/esm/BasicEditorKit.js +2 -0
- package/esm/BasicEditorKit.js.map +1 -1
- package/esm/ExtensionBasicCodeEditor.d.ts +3 -2
- package/esm/ExtensionBasicCodeEditor.d.ts.map +1 -1
- package/esm/ExtensionBasicCodeEditor.js +43 -0
- package/esm/ExtensionBasicCodeEditor.js.map +1 -1
- package/esm/ExtensionUser.d.ts +22 -0
- package/esm/ExtensionUser.d.ts.map +1 -0
- package/esm/ExtensionUser.js +45 -0
- package/esm/ExtensionUser.js.map +1 -0
- package/esm/remote-selection/ExtensionRemoteSelection.d.ts +2 -9
- package/esm/remote-selection/ExtensionRemoteSelection.d.ts.map +1 -1
- package/esm/remote-selection/ExtensionRemoteSelection.js +1 -12
- package/esm/remote-selection/ExtensionRemoteSelection.js.map +1 -1
- package/esm/remote-selection/remoteSelectionPlugin.d.ts +18 -17
- package/esm/remote-selection/remoteSelectionPlugin.d.ts.map +1 -1
- package/esm/remote-selection/remoteSelectionPlugin.js +42 -38
- package/esm/remote-selection/remoteSelectionPlugin.js.map +1 -1
- package/package.json +5 -2
- package/src/BasicEditorKit.ts +2 -0
- package/src/ExtensionBasicCodeEditor.ts +56 -1
- package/src/ExtensionUser.ts +70 -0
- package/src/remote-selection/ExtensionRemoteSelection.ts +4 -23
- package/src/remote-selection/remoteSelectionPlugin.ts +92 -66
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasicEditorKit.d.ts","sourceRoot":"","sources":["../src/BasicEditorKit.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"BasicEditorKit.d.ts","sourceRoot":"","sources":["../src/BasicEditorKit.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAqDhE,qBAAa,cAAe,YAAW,SAAS;IAC9C,aAAa,IAAI,iBAAiB,EAAE;CAsDrC"}
|
package/esm/BasicEditorKit.js
CHANGED
|
@@ -5,6 +5,7 @@ import { ExtensionGapcursor } from './ExtensionGapcursor.js';
|
|
|
5
5
|
import { ExtensionHtml } from './ExtensionHtml.js';
|
|
6
6
|
import { ExtensionMediaUpload } from './ExtensionMediaUpload.js';
|
|
7
7
|
import { ExtensionTextAlign } from './ExtensionTextAlign.js';
|
|
8
|
+
import { ExtensionUser } from './ExtensionUser.js';
|
|
8
9
|
import { ExtensionRemoteSelection } from './remote-selection/ExtensionRemoteSelection.js';
|
|
9
10
|
import { ExtensionPairing } from './pairing/ExtensionPairing.js';
|
|
10
11
|
import { MarkLink } from './MarkLink.js';
|
|
@@ -57,6 +58,7 @@ export class BasicEditorKit {
|
|
|
57
58
|
new ExtensionSelection(),
|
|
58
59
|
new ExtensionTextAlign(),
|
|
59
60
|
new ExtensionPairing(),
|
|
61
|
+
new ExtensionUser(),
|
|
60
62
|
new NodeDocument(),
|
|
61
63
|
new NodeText(),
|
|
62
64
|
new NodeParagraph(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasicEditorKit.js","sourceRoot":"","sources":["../src/BasicEditorKit.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,wBAAwB,EAAE,MAAM,gDAAgD,CAAC;AAC1F,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,MAAM,OAAO,cAAc;IACzB,aAAa;QACX,OAAO;YACL,IAAI,mBAAmB,EAAE;YACzB,IAAI,mBAAmB,EAAE;YACzB,IAAI,kBAAkB,EAAE;YACxB,IAAI,aAAa,EAAE;YACnB,IAAI,oBAAoB,EAAE;YAC1B,IAAI,wBAAwB,EAAE;YAC9B,IAAI,kBAAkB,EAAE;YACxB,IAAI,kBAAkB,EAAE;YACxB,IAAI,gBAAgB,EAAE;YACtB,IAAI,YAAY,EAAE;YAClB,IAAI,QAAQ,EAAE;YACd,IAAI,aAAa,EAAE;YACnB,IAAI,aAAa,EAAE;YACnB,IAAI,aAAa,EAAE;YACnB,IAAI,aAAa,EAAE;YACnB,IAAI,YAAY,EAAE;YAClB,IAAI,kBAAkB,EAAE;YACxB,IAAI,eAAe,EAAE;YACrB,IAAI,cAAc,EAAE;YACpB,IAAI,YAAY,EAAE;YAClB,IAAI,YAAY,EAAE;YAClB,IAAI,YAAY,EAAE;YAClB,IAAI,kBAAkB,EAAE;YACxB,IAAI,kBAAkB,EAAE;YACxB,IAAI,kBAAkB,EAAE;YACxB,IAAI,YAAY,EAAE;YAClB,IAAI,YAAY,EAAE;YAClB,IAAI,eAAe,EAAE;YACrB,IAAI,SAAS,EAAE;YACf,IAAI,SAAS,EAAE;YACf,IAAI,cAAc,EAAE;YACpB,IAAI,SAAS,EAAE;YACf,IAAI,WAAW,EAAE;YACjB,IAAI,QAAQ,EAAE;YACd,IAAI,mBAAmB,EAAE;YACzB,IAAI,UAAU,EAAE;YAChB,IAAI,iBAAiB,EAAE;YACvB,IAAI,QAAQ,EAAE;YACd,IAAI,UAAU,EAAE;YAChB,IAAI,UAAU,EAAE;YAChB,IAAI,aAAa,EAAE;YACnB,IAAI,UAAU,EAAE;YAChB,IAAI,QAAQ,EAAE;YACd,IAAI,UAAU,EAAE;YAChB,IAAI,YAAY,EAAE;YAClB,IAAI,aAAa,EAAE;YACnB,IAAI,aAAa,EAAE;YACnB,IAAI,eAAe,EAAE;YACrB,IAAI,aAAa,EAAE;SACpB,CAAC;IACJ,CAAC;CACF"}
|
|
1
|
+
{"version":3,"file":"BasicEditorKit.js","sourceRoot":"","sources":["../src/BasicEditorKit.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { Node } from 'prosemirror-model';
|
|
2
|
-
import { AnyExtensionOrReq, Extension, RawTextResult } from '@kerebron/editor';
|
|
1
|
+
import { Node, Schema } from 'prosemirror-model';
|
|
2
|
+
import { AnyExtensionOrReq, type Converter, type CoreEditor, Extension, RawTextResult } from '@kerebron/editor';
|
|
3
3
|
export declare class ExtensionBasicCodeEditor extends Extension {
|
|
4
4
|
name: string;
|
|
5
5
|
requires: AnyExtensionOrReq[];
|
|
@@ -7,5 +7,6 @@ export declare class ExtensionBasicCodeEditor extends Extension {
|
|
|
7
7
|
lang: string;
|
|
8
8
|
});
|
|
9
9
|
toRawText(doc: Node): RawTextResult;
|
|
10
|
+
getConverters(editor: CoreEditor, schema: Schema): Record<string, Converter>;
|
|
10
11
|
}
|
|
11
12
|
//# sourceMappingURL=ExtensionBasicCodeEditor.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionBasicCodeEditor.d.ts","sourceRoot":"","sources":["../src/ExtensionBasicCodeEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"ExtensionBasicCodeEditor.d.ts","sourceRoot":"","sources":["../src/ExtensionBasicCodeEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EACL,iBAAiB,EACjB,KAAK,SAAS,EACd,KAAK,UAAU,EACf,SAAS,EAET,aAAa,EACd,MAAM,kBAAkB,CAAC;AAc1B,qBAAa,wBAAyB,SAAQ,SAAS;IACrD,IAAI,SAAuB;IAC3B,QAAQ,EAAE,iBAAiB,EAAE,CAAC;gBAElB,EAAE,IAAI,EAAE,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE;IAgBtC,SAAS,CAAC,GAAG,EAAE,IAAI,GAAG,aAAa;IA6C1B,aAAa,CACpB,MAAM,EAAE,UAAU,EAClB,MAAM,EAAE,MAAM,GACb,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC;CA+C7B"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Extension, } from '@kerebron/editor';
|
|
2
|
+
import { createNodeFromObject } from '@kerebron/editor/utilities';
|
|
2
3
|
import { ExtensionSelection } from './ExtensionSelection.js';
|
|
3
4
|
import { ExtensionBaseKeymap } from './ExtensionBaseKeymap.js';
|
|
4
5
|
import { ExtensionDropcursor } from './ExtensionDropcursor.js';
|
|
@@ -60,5 +61,47 @@ export class ExtensionBasicCodeEditor extends Extension {
|
|
|
60
61
|
rawTextMap,
|
|
61
62
|
};
|
|
62
63
|
}
|
|
64
|
+
getConverters(editor, schema) {
|
|
65
|
+
return {
|
|
66
|
+
'text/code-only': {
|
|
67
|
+
fromDoc: async (document) => {
|
|
68
|
+
const retVal = [];
|
|
69
|
+
if (document.content) {
|
|
70
|
+
for (const node of document.content.toJSON()) {
|
|
71
|
+
if ('code_block' === node.type && Array.isArray(node.content)) {
|
|
72
|
+
for (const content of node.content) {
|
|
73
|
+
retVal.push(content.text);
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
return new TextEncoder().encode(retVal.join(''));
|
|
79
|
+
},
|
|
80
|
+
toDoc: async (buffer) => {
|
|
81
|
+
const code = new TextDecoder().decode(buffer);
|
|
82
|
+
const content = {
|
|
83
|
+
'type': 'doc_code',
|
|
84
|
+
'content': [
|
|
85
|
+
{
|
|
86
|
+
'type': 'code_block',
|
|
87
|
+
'attrs': {
|
|
88
|
+
'lang': schema.topNodeType.spec.defaultAttrs?.lang,
|
|
89
|
+
},
|
|
90
|
+
'content': [
|
|
91
|
+
{
|
|
92
|
+
'type': 'text',
|
|
93
|
+
'text': code,
|
|
94
|
+
},
|
|
95
|
+
],
|
|
96
|
+
},
|
|
97
|
+
],
|
|
98
|
+
};
|
|
99
|
+
return createNodeFromObject(content, schema, {
|
|
100
|
+
errorOnInvalidContent: false,
|
|
101
|
+
});
|
|
102
|
+
},
|
|
103
|
+
},
|
|
104
|
+
};
|
|
105
|
+
}
|
|
63
106
|
}
|
|
64
107
|
//# sourceMappingURL=ExtensionBasicCodeEditor.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionBasicCodeEditor.js","sourceRoot":"","sources":["../src/ExtensionBasicCodeEditor.ts"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"ExtensionBasicCodeEditor.js","sourceRoot":"","sources":["../src/ExtensionBasicCodeEditor.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Plugin, PluginKey } from 'prosemirror-state';
|
|
2
|
+
import { CommandFactories, Extension } from '@kerebron/editor';
|
|
3
|
+
import { ColorMapper, User } from '@kerebron/editor/user';
|
|
4
|
+
export declare const userPluginKey: PluginKey<UserPluginState>;
|
|
5
|
+
interface UserPluginState {
|
|
6
|
+
user: User;
|
|
7
|
+
}
|
|
8
|
+
export interface UserMeta {
|
|
9
|
+
changeUser?: {
|
|
10
|
+
user: User;
|
|
11
|
+
};
|
|
12
|
+
setColorMapper?: {
|
|
13
|
+
colorMapper: ColorMapper;
|
|
14
|
+
};
|
|
15
|
+
}
|
|
16
|
+
export declare class ExtensionUser extends Extension {
|
|
17
|
+
name: string;
|
|
18
|
+
getCommandFactories(): Partial<CommandFactories>;
|
|
19
|
+
getProseMirrorPlugins(): Plugin[];
|
|
20
|
+
}
|
|
21
|
+
export {};
|
|
22
|
+
//# sourceMappingURL=ExtensionUser.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExtensionUser.d.ts","sourceRoot":"","sources":["../src/ExtensionUser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAe,MAAM,EAAE,SAAS,EAAe,MAAM,mBAAmB,CAAC;AAEhF,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE/D,OAAO,EAAE,WAAW,EAAsB,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAE9E,eAAO,MAAM,aAAa,4BAAyC,CAAC;AAEpE,UAAU,eAAe;IACvB,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,MAAM,WAAW,QAAQ;IACvB,UAAU,CAAC,EAAE;QACX,IAAI,EAAE,IAAI,CAAC;KACZ,CAAC;IACF,cAAc,CAAC,EAAE;QACf,WAAW,EAAE,WAAW,CAAC;KAC1B,CAAC;CACH;AAuBD,qBAAa,aAAc,SAAQ,SAAS;IACjC,IAAI,SAAU;IAEd,mBAAmB,IAAI,OAAO,CAAC,gBAAgB,CAAC;IAmBhD,qBAAqB,IAAI,MAAM,EAAE;CAK3C"}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { Plugin, PluginKey } from 'prosemirror-state';
|
|
2
|
+
import { Extension } from '@kerebron/editor';
|
|
3
|
+
import { generateRandomUser } from '@kerebron/editor/user';
|
|
4
|
+
export const userPluginKey = new PluginKey('user');
|
|
5
|
+
const createUserPlugin = () => new Plugin({
|
|
6
|
+
key: userPluginKey,
|
|
7
|
+
state: {
|
|
8
|
+
init() {
|
|
9
|
+
return {
|
|
10
|
+
user: generateRandomUser(),
|
|
11
|
+
};
|
|
12
|
+
},
|
|
13
|
+
apply: (tr, pluginState) => {
|
|
14
|
+
const changeUser = tr.getMeta('changeUser');
|
|
15
|
+
if (changeUser) {
|
|
16
|
+
pluginState.user = { ...changeUser.user };
|
|
17
|
+
}
|
|
18
|
+
return pluginState;
|
|
19
|
+
},
|
|
20
|
+
},
|
|
21
|
+
});
|
|
22
|
+
export class ExtensionUser extends Extension {
|
|
23
|
+
name = 'user';
|
|
24
|
+
getCommandFactories() {
|
|
25
|
+
const changeUser = (user) => {
|
|
26
|
+
return (state, dispatch) => {
|
|
27
|
+
const tr = state.tr;
|
|
28
|
+
tr.setMeta('changeUser', { user });
|
|
29
|
+
if (dispatch) {
|
|
30
|
+
dispatch(tr);
|
|
31
|
+
}
|
|
32
|
+
return true;
|
|
33
|
+
};
|
|
34
|
+
};
|
|
35
|
+
return {
|
|
36
|
+
changeUser,
|
|
37
|
+
};
|
|
38
|
+
}
|
|
39
|
+
getProseMirrorPlugins() {
|
|
40
|
+
return [
|
|
41
|
+
createUserPlugin(),
|
|
42
|
+
];
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
//# sourceMappingURL=ExtensionUser.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExtensionUser.js","sourceRoot":"","sources":["../src/ExtensionUser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAe,MAAM,EAAE,SAAS,EAAe,MAAM,mBAAmB,CAAC;AAEhF,OAAO,EAAoB,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE/D,OAAO,EAAe,kBAAkB,EAAQ,MAAM,uBAAuB,CAAC;AAE9E,MAAM,CAAC,MAAM,aAAa,GAAG,IAAI,SAAS,CAAkB,MAAM,CAAC,CAAC;AAepE,MAAM,gBAAgB,GAAkC,GAAG,EAAE,CAC3D,IAAI,MAAM,CAAkB;IAC1B,GAAG,EAAE,aAAa;IAClB,KAAK,EAAE;QACL,IAAI;YACF,OAAO;gBACL,IAAI,EAAE,kBAAkB,EAAE;aAC3B,CAAC;QACJ,CAAC;QACD,KAAK,EAAE,CAAC,EAAE,EAAE,WAA4B,EAAE,EAAE;YAC1C,MAAM,UAAU,GAAG,EAAE,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;YAE5C,IAAI,UAAU,EAAE,CAAC;gBACf,WAAW,CAAC,IAAI,GAAG,EAAE,GAAG,UAAU,CAAC,IAAI,EAAE,CAAC;YAC5C,CAAC;YAED,OAAO,WAAW,CAAC;QACrB,CAAC;KACF;CACF,CAAC,CAAC;AAEL,MAAM,OAAO,aAAc,SAAQ,SAAS;IACjC,IAAI,GAAG,MAAM,CAAC;IAEd,mBAAmB;QAC1B,MAAM,UAAU,GAAmB,CAAC,IAAU,EAAE,EAAE;YAChD,OAAO,CAAC,KAAkB,EAAE,QAAoC,EAAE,EAAE;gBAClE,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;gBACpB,EAAE,CAAC,OAAO,CAAC,YAAY,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;gBAEnC,IAAI,QAAQ,EAAE,CAAC;oBACb,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACf,CAAC;gBAED,OAAO,IAAI,CAAC;YACd,CAAC,CAAC;QACJ,CAAC,CAAC;QAEF,OAAO;YACL,UAAU;SACX,CAAC;IACJ,CAAC;IAEQ,qBAAqB;QAC5B,OAAO;YACL,gBAAgB,EAAE;SACnB,CAAC;IACJ,CAAC;CACF"}
|
|
@@ -1,13 +1,9 @@
|
|
|
1
1
|
import { Plugin } from 'prosemirror-state';
|
|
2
2
|
import { Extension } from '@kerebron/editor';
|
|
3
|
-
type
|
|
3
|
+
import { type User } from '@kerebron/editor/user';
|
|
4
4
|
export interface SelectionState {
|
|
5
5
|
clientId: number;
|
|
6
|
-
user:
|
|
7
|
-
name: string;
|
|
8
|
-
color: Color;
|
|
9
|
-
colorLight: Color;
|
|
10
|
-
};
|
|
6
|
+
user: User;
|
|
11
7
|
cursor?: {
|
|
12
8
|
anchor: number;
|
|
13
9
|
head: number;
|
|
@@ -16,9 +12,6 @@ export interface SelectionState {
|
|
|
16
12
|
export { remoteSelectionPluginKey } from './remoteSelectionPlugin.js';
|
|
17
13
|
export declare class ExtensionRemoteSelection extends Extension {
|
|
18
14
|
name: string;
|
|
19
|
-
private remoteStates;
|
|
20
15
|
getProseMirrorPlugins(): Plugin[];
|
|
21
|
-
getRemoteStates(): SelectionState[];
|
|
22
|
-
setRemoteStates(states: SelectionState[]): void;
|
|
23
16
|
}
|
|
24
17
|
//# sourceMappingURL=ExtensionRemoteSelection.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionRemoteSelection.d.ts","sourceRoot":"","sources":["../../src/remote-selection/ExtensionRemoteSelection.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,
|
|
1
|
+
{"version":3,"file":"ExtensionRemoteSelection.d.ts","sourceRoot":"","sources":["../../src/remote-selection/ExtensionRemoteSelection.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAIlD,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,IAAI,CAAC;IACX,MAAM,CAAC,EAAE;QACP,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;CACH;AAED,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAEtE,qBAAa,wBAAyB,SAAQ,SAAS;IAC5C,IAAI,SAAsB;IAE1B,qBAAqB,IAAI,MAAM,EAAE;CAK3C"}
|
|
@@ -3,21 +3,10 @@ import { remoteSelectionPlugin } from './remoteSelectionPlugin.js';
|
|
|
3
3
|
export { remoteSelectionPluginKey } from './remoteSelectionPlugin.js';
|
|
4
4
|
export class ExtensionRemoteSelection extends Extension {
|
|
5
5
|
name = 'remote-selection';
|
|
6
|
-
remoteStates = [];
|
|
7
6
|
getProseMirrorPlugins() {
|
|
8
7
|
return [
|
|
9
|
-
remoteSelectionPlugin(
|
|
8
|
+
remoteSelectionPlugin(),
|
|
10
9
|
];
|
|
11
10
|
}
|
|
12
|
-
getRemoteStates() {
|
|
13
|
-
return this.remoteStates;
|
|
14
|
-
}
|
|
15
|
-
setRemoteStates(states) {
|
|
16
|
-
this.remoteStates = states;
|
|
17
|
-
const event = new CustomEvent('remoteSelectionChange', {
|
|
18
|
-
detail: {},
|
|
19
|
-
});
|
|
20
|
-
this.editor.dispatchEvent(event);
|
|
21
|
-
}
|
|
22
11
|
}
|
|
23
12
|
//# sourceMappingURL=ExtensionRemoteSelection.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionRemoteSelection.js","sourceRoot":"","sources":["../../src/remote-selection/ExtensionRemoteSelection.ts"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"ExtensionRemoteSelection.js","sourceRoot":"","sources":["../../src/remote-selection/ExtensionRemoteSelection.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAG7C,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAWnE,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAEtE,MAAM,OAAO,wBAAyB,SAAQ,SAAS;IAC5C,IAAI,GAAG,kBAAkB,CAAC;IAE1B,qBAAqB;QAC5B,OAAO;YACL,qBAAqB,EAAE;SACxB,CAAC;IACJ,CAAC;CACF"}
|
|
@@ -1,25 +1,26 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { DecorationSet } from 'prosemirror-view';
|
|
2
|
+
import { EditorState, Plugin, PluginKey } from 'prosemirror-state';
|
|
2
3
|
import { type DecorationAttrs } from 'prosemirror-view';
|
|
3
|
-
import type
|
|
4
|
-
import type {
|
|
5
|
-
export declare const remoteSelectionPluginKey: PluginKey<
|
|
4
|
+
import { type ColorMapper, type User } from '@kerebron/editor/user';
|
|
5
|
+
import type { SelectionState } from './ExtensionRemoteSelection.js';
|
|
6
|
+
export declare const remoteSelectionPluginKey: PluginKey<RemoteSelectionState>;
|
|
7
|
+
interface RemoteSelectionState {
|
|
8
|
+
remoteStates: SelectionState[];
|
|
9
|
+
me: User;
|
|
10
|
+
colorMapper: ColorMapper;
|
|
11
|
+
}
|
|
6
12
|
/**
|
|
7
13
|
* Default generator for a cursor element
|
|
8
14
|
*/
|
|
9
|
-
export declare const defaultCursorBuilder: (user:
|
|
15
|
+
export declare const defaultCursorBuilder: (user: User, me: User, colorMapper: ColorMapper) => HTMLElement;
|
|
10
16
|
/**
|
|
11
17
|
* Default generator for the selection attributes
|
|
12
18
|
*/
|
|
13
|
-
export declare const defaultSelectionBuilder: (user:
|
|
14
|
-
export declare const createDecorations: (state:
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
}, clientId: number) => DecorationAttrs) => any;
|
|
21
|
-
export declare const remoteSelectionPlugin: (extension: ExtensionRemoteSelection, editor: CoreEditor, { cursorBuilder, selectionBuilder, }?: {
|
|
22
|
-
cursorBuilder?: (user: any, clientId: number) => HTMLElement;
|
|
23
|
-
selectionBuilder?: (user: any, clientId: number) => DecorationAttrs;
|
|
24
|
-
}) => Plugin<any>;
|
|
19
|
+
export declare const defaultSelectionBuilder: (user: User, me: User, colorMapper: ColorMapper) => DecorationAttrs;
|
|
20
|
+
export declare const createDecorations: (state: EditorState, pluginState: RemoteSelectionState, createCursor: (user: User, me: User, colorMapper: ColorMapper) => Element, createSelection: (user: User, me: User, colorMapper: ColorMapper) => DecorationAttrs) => DecorationSet;
|
|
21
|
+
export declare const remoteSelectionPlugin: ({ cursorBuilder, selectionBuilder, }?: {
|
|
22
|
+
cursorBuilder?: (user: User, me: User, colorMapper: ColorMapper) => HTMLElement;
|
|
23
|
+
selectionBuilder?: (user: User, me: User, colorMapper: ColorMapper) => DecorationAttrs;
|
|
24
|
+
}) => Plugin<RemoteSelectionState>;
|
|
25
|
+
export {};
|
|
25
26
|
//# sourceMappingURL=remoteSelectionPlugin.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"remoteSelectionPlugin.d.ts","sourceRoot":"","sources":["../../src/remote-selection/remoteSelectionPlugin.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"remoteSelectionPlugin.d.ts","sourceRoot":"","sources":["../../src/remote-selection/remoteSelectionPlugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EACL,KAAK,WAAW,EAGhB,KAAK,IAAI,EACV,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAEpE,eAAO,MAAM,wBAAwB,iCAEpC,CAAC;AAEF,UAAU,oBAAoB;IAC5B,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,EAAE,EAAE,IAAI,CAAC;IACT,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED;;GAEG;AACH,eAAO,MAAM,oBAAoB,GAC/B,MAAM,IAAI,EACV,IAAI,IAAI,EACR,aAAa,WAAW,KACvB,WAgBF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,uBAAuB,GAClC,MAAM,IAAI,EACV,IAAI,IAAI,EACR,aAAa,WAAW,KACvB,eAQF,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,OAAO,WAAW,EAClB,aAAa,oBAAoB,EACjC,cAAc,CACZ,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,IAAI,EACR,WAAW,EAAE,WAAW,KACrB,OAAO,EACZ,iBAAiB,CACf,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,IAAI,EACR,WAAW,EAAE,WAAW,KACrB,eAAe,KACnB,aA0CF,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAChC,uCAGG;IACD,aAAa,CAAC,EAAE,CACd,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,IAAI,EACR,WAAW,EAAE,WAAW,KACrB,WAAW,CAAC;IACjB,gBAAgB,CAAC,EAAE,CACjB,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,IAAI,EACR,WAAW,EAAE,WAAW,KACrB,eAAe,CAAC;CACjB,iCA6CP,CAAC"}
|
|
@@ -1,15 +1,18 @@
|
|
|
1
1
|
import { Decoration, DecorationSet } from 'prosemirror-view';
|
|
2
2
|
import { Plugin, PluginKey } from 'prosemirror-state';
|
|
3
|
+
import { defaultColorMapper, generateBlankUser, } from '@kerebron/editor/user';
|
|
3
4
|
export const remoteSelectionPluginKey = new PluginKey('remote-selection');
|
|
4
5
|
/**
|
|
5
6
|
* Default generator for a cursor element
|
|
6
7
|
*/
|
|
7
|
-
export const defaultCursorBuilder = (user) => {
|
|
8
|
+
export const defaultCursorBuilder = (user, me, colorMapper) => {
|
|
9
|
+
const colorPair = colorMapper(user, me);
|
|
10
|
+
const color = colorPair.light;
|
|
8
11
|
const cursor = document.createElement('span');
|
|
9
12
|
cursor.classList.add('kb-yjs__cursor');
|
|
10
|
-
cursor.setAttribute('style', `border-color: ${
|
|
13
|
+
cursor.setAttribute('style', `border-color: ${color};`);
|
|
11
14
|
const userDiv = document.createElement('div');
|
|
12
|
-
userDiv.setAttribute('style', `background-color: ${
|
|
15
|
+
userDiv.setAttribute('style', `background-color: ${color}`);
|
|
13
16
|
userDiv.insertBefore(document.createTextNode(user.name), null);
|
|
14
17
|
const nonbreakingSpace1 = document.createTextNode('\u2060');
|
|
15
18
|
const nonbreakingSpace2 = document.createTextNode('\u2060');
|
|
@@ -21,32 +24,20 @@ export const defaultCursorBuilder = (user) => {
|
|
|
21
24
|
/**
|
|
22
25
|
* Default generator for the selection attributes
|
|
23
26
|
*/
|
|
24
|
-
export const defaultSelectionBuilder = (user) => {
|
|
27
|
+
export const defaultSelectionBuilder = (user, me, colorMapper) => {
|
|
28
|
+
const colorPair = colorMapper(user, me);
|
|
29
|
+
const color = colorPair.light;
|
|
25
30
|
return {
|
|
26
|
-
style: `background-color: ${
|
|
31
|
+
style: `background-color: ${color}70`,
|
|
27
32
|
class: 'kb-yjs__selection',
|
|
28
33
|
};
|
|
29
34
|
};
|
|
30
|
-
const
|
|
31
|
-
export const createDecorations = (state, extension, createCursor, createSelection) => {
|
|
35
|
+
export const createDecorations = (state, pluginState, createCursor, createSelection) => {
|
|
32
36
|
const decorations = [];
|
|
33
|
-
const remoteStates =
|
|
34
|
-
if (remoteStates.length === 0) {
|
|
35
|
-
return DecorationSet.create(state.doc, []);
|
|
36
|
-
}
|
|
37
|
+
const remoteStates = pluginState.remoteStates;
|
|
37
38
|
for (const remoteState of remoteStates) {
|
|
38
39
|
if (remoteState.cursor != null) {
|
|
39
|
-
const user = remoteState.user
|
|
40
|
-
if (user.color == null) {
|
|
41
|
-
user.color = '#ffa500';
|
|
42
|
-
}
|
|
43
|
-
else if (!rxValidColor.test(user.color)) {
|
|
44
|
-
// We only support 6-digit RGB colors in y-prosemirror
|
|
45
|
-
console.warn('A user uses an unsupported color format', user);
|
|
46
|
-
}
|
|
47
|
-
if (user.name == null) {
|
|
48
|
-
user.name = `User: ${remoteState.clientId}`;
|
|
49
|
-
}
|
|
40
|
+
const user = remoteState.user;
|
|
50
41
|
const cursor = remoteState.cursor;
|
|
51
42
|
let anchor = cursor.anchor || null;
|
|
52
43
|
let head = cursor.head || null;
|
|
@@ -54,13 +45,13 @@ export const createDecorations = (state, extension, createCursor, createSelectio
|
|
|
54
45
|
const maxsize = Math.max(state.doc.content.size - 1, 0);
|
|
55
46
|
anchor = Math.min(anchor, maxsize);
|
|
56
47
|
head = Math.min(head, maxsize);
|
|
57
|
-
decorations.push(Decoration.widget(head, () => createCursor(user,
|
|
58
|
-
key: remoteState.clientId +
|
|
48
|
+
decorations.push(Decoration.widget(head, () => createCursor(user, pluginState.me, pluginState.colorMapper), {
|
|
49
|
+
key: remoteState.clientId + user.id + user.name,
|
|
59
50
|
side: 10,
|
|
60
51
|
}));
|
|
61
52
|
const from = Math.min(anchor, head);
|
|
62
53
|
const to = Math.max(anchor, head);
|
|
63
|
-
decorations.push(Decoration.inline(from, to, createSelection(user,
|
|
54
|
+
decorations.push(Decoration.inline(from, to, createSelection(user, pluginState.me, pluginState.colorMapper), {
|
|
64
55
|
inclusiveEnd: true,
|
|
65
56
|
inclusiveStart: false,
|
|
66
57
|
}));
|
|
@@ -69,27 +60,40 @@ export const createDecorations = (state, extension, createCursor, createSelectio
|
|
|
69
60
|
}
|
|
70
61
|
return DecorationSet.create(state.doc, decorations);
|
|
71
62
|
};
|
|
72
|
-
export const remoteSelectionPlugin = (
|
|
63
|
+
export const remoteSelectionPlugin = ({ cursorBuilder = defaultCursorBuilder, selectionBuilder = defaultSelectionBuilder, } = {}) => {
|
|
73
64
|
return new Plugin({
|
|
74
65
|
key: remoteSelectionPluginKey,
|
|
75
66
|
state: {
|
|
76
|
-
init(
|
|
77
|
-
return
|
|
67
|
+
init() {
|
|
68
|
+
return {
|
|
69
|
+
remoteStates: [],
|
|
70
|
+
me: generateBlankUser(),
|
|
71
|
+
colorMapper: defaultColorMapper,
|
|
72
|
+
};
|
|
78
73
|
},
|
|
79
|
-
apply(tr,
|
|
80
|
-
const
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
if ((remoteCursorState?.isChangeOrigin) ||
|
|
84
|
-
(remoteCursorState?.remotePositionUpdated)) {
|
|
85
|
-
return createDecorations(newState, extension, cursorBuilder, selectionBuilder);
|
|
74
|
+
apply(tr, pluginState) {
|
|
75
|
+
const changeUser = tr.getMeta('changeUser');
|
|
76
|
+
if (changeUser) {
|
|
77
|
+
pluginState.me = { ...changeUser.user };
|
|
86
78
|
}
|
|
87
|
-
|
|
79
|
+
const setColorMapper = tr.getMeta('setColorMapper');
|
|
80
|
+
if (setColorMapper) {
|
|
81
|
+
pluginState.colorMapper = setColorMapper.colorMapper;
|
|
82
|
+
}
|
|
83
|
+
const remoteSelectionChange = tr.getMeta('remoteSelectionChange');
|
|
84
|
+
if (remoteSelectionChange) {
|
|
85
|
+
pluginState.remoteStates = [...remoteSelectionChange.remoteStates];
|
|
86
|
+
}
|
|
87
|
+
return pluginState;
|
|
88
88
|
},
|
|
89
89
|
},
|
|
90
90
|
props: {
|
|
91
|
-
decorations
|
|
92
|
-
|
|
91
|
+
decorations(state) {
|
|
92
|
+
const pluginState = this.getState(state);
|
|
93
|
+
if (!pluginState) {
|
|
94
|
+
return DecorationSet.empty;
|
|
95
|
+
}
|
|
96
|
+
return createDecorations(state, pluginState, cursorBuilder, selectionBuilder);
|
|
93
97
|
},
|
|
94
98
|
},
|
|
95
99
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"remoteSelectionPlugin.js","sourceRoot":"","sources":["../../src/remote-selection/remoteSelectionPlugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,
|
|
1
|
+
{"version":3,"file":"remoteSelectionPlugin.js","sourceRoot":"","sources":["../../src/remote-selection/remoteSelectionPlugin.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kerebron/extension-basic-editor",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"module": "./esm/BasicEditorKit.js",
|
|
6
6
|
"exports": {
|
|
@@ -40,6 +40,9 @@
|
|
|
40
40
|
"./ExtensionTextAlign": {
|
|
41
41
|
"import": "./esm/ExtensionTextAlign.js"
|
|
42
42
|
},
|
|
43
|
+
"./ExtensionUser": {
|
|
44
|
+
"import": "./esm/ExtensionUser.js"
|
|
45
|
+
},
|
|
43
46
|
"./NodeDocument": {
|
|
44
47
|
"import": "./esm/NodeDocument.js"
|
|
45
48
|
},
|
|
@@ -124,7 +127,7 @@
|
|
|
124
127
|
"assets"
|
|
125
128
|
],
|
|
126
129
|
"dependencies": {
|
|
127
|
-
"@kerebron/editor": "0.
|
|
130
|
+
"@kerebron/editor": "0.7.0",
|
|
128
131
|
"prosemirror-history": "1.4.1",
|
|
129
132
|
"prosemirror-model": "1.25.3",
|
|
130
133
|
"prosemirror-state": "1.4.3",
|
package/src/BasicEditorKit.ts
CHANGED
|
@@ -7,6 +7,7 @@ import { ExtensionGapcursor } from './ExtensionGapcursor.js';
|
|
|
7
7
|
import { ExtensionHtml } from './ExtensionHtml.js';
|
|
8
8
|
import { ExtensionMediaUpload } from './ExtensionMediaUpload.js';
|
|
9
9
|
import { ExtensionTextAlign } from './ExtensionTextAlign.js';
|
|
10
|
+
import { ExtensionUser } from './ExtensionUser.js';
|
|
10
11
|
import { ExtensionRemoteSelection } from './remote-selection/ExtensionRemoteSelection.js';
|
|
11
12
|
import { ExtensionPairing } from './pairing/ExtensionPairing.js';
|
|
12
13
|
|
|
@@ -62,6 +63,7 @@ export class BasicEditorKit implements EditorKit {
|
|
|
62
63
|
new ExtensionSelection(),
|
|
63
64
|
new ExtensionTextAlign(),
|
|
64
65
|
new ExtensionPairing(),
|
|
66
|
+
new ExtensionUser(),
|
|
65
67
|
new NodeDocument(),
|
|
66
68
|
new NodeText(),
|
|
67
69
|
new NodeParagraph(),
|
|
@@ -1,12 +1,16 @@
|
|
|
1
|
-
import { Node } from 'prosemirror-model';
|
|
1
|
+
import { Node, Schema } from 'prosemirror-model';
|
|
2
2
|
|
|
3
3
|
import {
|
|
4
4
|
AnyExtensionOrReq,
|
|
5
|
+
type Converter,
|
|
6
|
+
type CoreEditor,
|
|
5
7
|
Extension,
|
|
6
8
|
RawTextMapEntry,
|
|
7
9
|
RawTextResult,
|
|
8
10
|
} from '@kerebron/editor';
|
|
9
11
|
|
|
12
|
+
import { createNodeFromObject } from '@kerebron/editor/utilities';
|
|
13
|
+
|
|
10
14
|
import { ExtensionSelection } from './ExtensionSelection.js';
|
|
11
15
|
import { ExtensionBaseKeymap } from './ExtensionBaseKeymap.js';
|
|
12
16
|
import { ExtensionDropcursor } from './ExtensionDropcursor.js';
|
|
@@ -81,4 +85,55 @@ export class ExtensionBasicCodeEditor extends Extension {
|
|
|
81
85
|
rawTextMap,
|
|
82
86
|
};
|
|
83
87
|
}
|
|
88
|
+
|
|
89
|
+
override getConverters(
|
|
90
|
+
editor: CoreEditor,
|
|
91
|
+
schema: Schema,
|
|
92
|
+
): Record<string, Converter> {
|
|
93
|
+
return {
|
|
94
|
+
'text/code-only': {
|
|
95
|
+
fromDoc: async (document: Node): Promise<Uint8Array> => {
|
|
96
|
+
const retVal = [];
|
|
97
|
+
if (document.content) {
|
|
98
|
+
for (const node of document.content.toJSON()) {
|
|
99
|
+
if ('code_block' === node.type && Array.isArray(node.content)) {
|
|
100
|
+
for (const content of node.content) {
|
|
101
|
+
retVal.push(content.text);
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
return new TextEncoder().encode(retVal.join(''));
|
|
107
|
+
},
|
|
108
|
+
toDoc: async (buffer: Uint8Array): Promise<Node> => {
|
|
109
|
+
const code = new TextDecoder().decode(buffer);
|
|
110
|
+
const content = {
|
|
111
|
+
'type': 'doc_code',
|
|
112
|
+
'content': [
|
|
113
|
+
{
|
|
114
|
+
'type': 'code_block',
|
|
115
|
+
'attrs': {
|
|
116
|
+
'lang': schema.topNodeType.spec.defaultAttrs?.lang,
|
|
117
|
+
},
|
|
118
|
+
'content': [
|
|
119
|
+
{
|
|
120
|
+
'type': 'text',
|
|
121
|
+
'text': code,
|
|
122
|
+
},
|
|
123
|
+
],
|
|
124
|
+
},
|
|
125
|
+
],
|
|
126
|
+
};
|
|
127
|
+
|
|
128
|
+
return createNodeFromObject(
|
|
129
|
+
content,
|
|
130
|
+
schema,
|
|
131
|
+
{
|
|
132
|
+
errorOnInvalidContent: false,
|
|
133
|
+
},
|
|
134
|
+
);
|
|
135
|
+
},
|
|
136
|
+
},
|
|
137
|
+
};
|
|
138
|
+
}
|
|
84
139
|
}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { EditorState, Plugin, PluginKey, Transaction } from 'prosemirror-state';
|
|
2
|
+
|
|
3
|
+
import { CommandFactories, Extension } from '@kerebron/editor';
|
|
4
|
+
import { CommandFactory } from '@kerebron/editor/commands';
|
|
5
|
+
import { ColorMapper, generateRandomUser, User } from '@kerebron/editor/user';
|
|
6
|
+
|
|
7
|
+
export const userPluginKey = new PluginKey<UserPluginState>('user');
|
|
8
|
+
|
|
9
|
+
interface UserPluginState {
|
|
10
|
+
user: User;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
export interface UserMeta {
|
|
14
|
+
changeUser?: {
|
|
15
|
+
user: User;
|
|
16
|
+
};
|
|
17
|
+
setColorMapper?: {
|
|
18
|
+
colorMapper: ColorMapper;
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
const createUserPlugin: () => Plugin<UserPluginState> = () =>
|
|
23
|
+
new Plugin<UserPluginState>({
|
|
24
|
+
key: userPluginKey,
|
|
25
|
+
state: {
|
|
26
|
+
init() {
|
|
27
|
+
return {
|
|
28
|
+
user: generateRandomUser(),
|
|
29
|
+
};
|
|
30
|
+
},
|
|
31
|
+
apply: (tr, pluginState: UserPluginState) => {
|
|
32
|
+
const changeUser = tr.getMeta('changeUser');
|
|
33
|
+
|
|
34
|
+
if (changeUser) {
|
|
35
|
+
pluginState.user = { ...changeUser.user };
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
return pluginState;
|
|
39
|
+
},
|
|
40
|
+
},
|
|
41
|
+
});
|
|
42
|
+
|
|
43
|
+
export class ExtensionUser extends Extension {
|
|
44
|
+
override name = 'user';
|
|
45
|
+
|
|
46
|
+
override getCommandFactories(): Partial<CommandFactories> {
|
|
47
|
+
const changeUser: CommandFactory = (user: User) => {
|
|
48
|
+
return (state: EditorState, dispatch?: (tr: Transaction) => void) => {
|
|
49
|
+
const tr = state.tr;
|
|
50
|
+
tr.setMeta('changeUser', { user });
|
|
51
|
+
|
|
52
|
+
if (dispatch) {
|
|
53
|
+
dispatch(tr);
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
return true;
|
|
57
|
+
};
|
|
58
|
+
};
|
|
59
|
+
|
|
60
|
+
return {
|
|
61
|
+
changeUser,
|
|
62
|
+
};
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
override getProseMirrorPlugins(): Plugin[] {
|
|
66
|
+
return [
|
|
67
|
+
createUserPlugin(),
|
|
68
|
+
];
|
|
69
|
+
}
|
|
70
|
+
}
|
|
@@ -1,17 +1,12 @@
|
|
|
1
1
|
import { Plugin } from 'prosemirror-state';
|
|
2
|
-
import {
|
|
2
|
+
import { Extension } from '@kerebron/editor';
|
|
3
|
+
import { type User } from '@kerebron/editor/user';
|
|
3
4
|
|
|
4
5
|
import { remoteSelectionPlugin } from './remoteSelectionPlugin.js';
|
|
5
6
|
|
|
6
|
-
type Color = string;
|
|
7
|
-
|
|
8
7
|
export interface SelectionState {
|
|
9
8
|
clientId: number;
|
|
10
|
-
user:
|
|
11
|
-
name: string;
|
|
12
|
-
color: Color;
|
|
13
|
-
colorLight: Color;
|
|
14
|
-
};
|
|
9
|
+
user: User;
|
|
15
10
|
cursor?: {
|
|
16
11
|
anchor: number;
|
|
17
12
|
head: number;
|
|
@@ -23,23 +18,9 @@ export { remoteSelectionPluginKey } from './remoteSelectionPlugin.js';
|
|
|
23
18
|
export class ExtensionRemoteSelection extends Extension {
|
|
24
19
|
override name = 'remote-selection';
|
|
25
20
|
|
|
26
|
-
private remoteStates: SelectionState[] = [];
|
|
27
|
-
|
|
28
21
|
override getProseMirrorPlugins(): Plugin[] {
|
|
29
22
|
return [
|
|
30
|
-
remoteSelectionPlugin(
|
|
23
|
+
remoteSelectionPlugin(),
|
|
31
24
|
];
|
|
32
25
|
}
|
|
33
|
-
|
|
34
|
-
getRemoteStates(): SelectionState[] {
|
|
35
|
-
return this.remoteStates;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
setRemoteStates(states: SelectionState[]) {
|
|
39
|
-
this.remoteStates = states;
|
|
40
|
-
const event = new CustomEvent('remoteSelectionChange', {
|
|
41
|
-
detail: {},
|
|
42
|
-
});
|
|
43
|
-
this.editor.dispatchEvent(event);
|
|
44
|
-
}
|
|
45
26
|
}
|
|
@@ -1,22 +1,42 @@
|
|
|
1
1
|
import { Decoration, DecorationSet } from 'prosemirror-view';
|
|
2
|
-
import { Plugin, PluginKey } from 'prosemirror-state';
|
|
2
|
+
import { EditorState, Plugin, PluginKey } from 'prosemirror-state';
|
|
3
3
|
import { type DecorationAttrs } from 'prosemirror-view';
|
|
4
4
|
|
|
5
|
-
import
|
|
5
|
+
import {
|
|
6
|
+
type ColorMapper,
|
|
7
|
+
defaultColorMapper,
|
|
8
|
+
generateBlankUser,
|
|
9
|
+
type User,
|
|
10
|
+
} from '@kerebron/editor/user';
|
|
6
11
|
|
|
7
|
-
import type {
|
|
12
|
+
import type { SelectionState } from './ExtensionRemoteSelection.js';
|
|
8
13
|
|
|
9
|
-
export const remoteSelectionPluginKey = new PluginKey(
|
|
14
|
+
export const remoteSelectionPluginKey = new PluginKey<RemoteSelectionState>(
|
|
15
|
+
'remote-selection',
|
|
16
|
+
);
|
|
17
|
+
|
|
18
|
+
interface RemoteSelectionState {
|
|
19
|
+
remoteStates: SelectionState[];
|
|
20
|
+
me: User;
|
|
21
|
+
colorMapper: ColorMapper;
|
|
22
|
+
}
|
|
10
23
|
|
|
11
24
|
/**
|
|
12
25
|
* Default generator for a cursor element
|
|
13
26
|
*/
|
|
14
|
-
export const defaultCursorBuilder = (
|
|
27
|
+
export const defaultCursorBuilder = (
|
|
28
|
+
user: User,
|
|
29
|
+
me: User,
|
|
30
|
+
colorMapper: ColorMapper,
|
|
31
|
+
): HTMLElement => {
|
|
32
|
+
const colorPair = colorMapper(user, me);
|
|
33
|
+
const color = colorPair.light;
|
|
34
|
+
|
|
15
35
|
const cursor = document.createElement('span');
|
|
16
36
|
cursor.classList.add('kb-yjs__cursor');
|
|
17
|
-
cursor.setAttribute('style', `border-color: ${
|
|
37
|
+
cursor.setAttribute('style', `border-color: ${color};`);
|
|
18
38
|
const userDiv = document.createElement('div');
|
|
19
|
-
userDiv.setAttribute('style', `background-color: ${
|
|
39
|
+
userDiv.setAttribute('style', `background-color: ${color}`);
|
|
20
40
|
userDiv.insertBefore(document.createTextNode(user.name), null);
|
|
21
41
|
const nonbreakingSpace1 = document.createTextNode('\u2060');
|
|
22
42
|
const nonbreakingSpace2 = document.createTextNode('\u2060');
|
|
@@ -29,47 +49,40 @@ export const defaultCursorBuilder = (user: any): HTMLElement => {
|
|
|
29
49
|
/**
|
|
30
50
|
* Default generator for the selection attributes
|
|
31
51
|
*/
|
|
32
|
-
export const defaultSelectionBuilder = (
|
|
52
|
+
export const defaultSelectionBuilder = (
|
|
53
|
+
user: User,
|
|
54
|
+
me: User,
|
|
55
|
+
colorMapper: ColorMapper,
|
|
56
|
+
): DecorationAttrs => {
|
|
57
|
+
const colorPair = colorMapper(user, me);
|
|
58
|
+
const color = colorPair.light;
|
|
59
|
+
|
|
33
60
|
return {
|
|
34
|
-
style: `background-color: ${
|
|
61
|
+
style: `background-color: ${color}70`,
|
|
35
62
|
class: 'kb-yjs__selection',
|
|
36
63
|
};
|
|
37
64
|
};
|
|
38
65
|
|
|
39
|
-
const rxValidColor = /^#[0-9a-fA-F]{6}$/;
|
|
40
|
-
|
|
41
66
|
export const createDecorations = (
|
|
42
|
-
state:
|
|
43
|
-
|
|
67
|
+
state: EditorState,
|
|
68
|
+
pluginState: RemoteSelectionState,
|
|
44
69
|
createCursor: (
|
|
45
|
-
user:
|
|
46
|
-
|
|
70
|
+
user: User,
|
|
71
|
+
me: User,
|
|
72
|
+
colorMapper: ColorMapper,
|
|
47
73
|
) => Element,
|
|
48
74
|
createSelection: (
|
|
49
|
-
user:
|
|
50
|
-
|
|
75
|
+
user: User,
|
|
76
|
+
me: User,
|
|
77
|
+
colorMapper: ColorMapper,
|
|
51
78
|
) => DecorationAttrs,
|
|
52
|
-
):
|
|
79
|
+
): DecorationSet => {
|
|
53
80
|
const decorations: Decoration[] = [];
|
|
54
81
|
|
|
55
|
-
const remoteStates =
|
|
56
|
-
if (remoteStates.length === 0) {
|
|
57
|
-
return DecorationSet.create(state.doc, []);
|
|
58
|
-
}
|
|
59
|
-
|
|
82
|
+
const remoteStates = pluginState.remoteStates;
|
|
60
83
|
for (const remoteState of remoteStates) {
|
|
61
84
|
if (remoteState.cursor != null) {
|
|
62
|
-
const user = remoteState.user
|
|
63
|
-
if (user.color == null) {
|
|
64
|
-
user.color = '#ffa500';
|
|
65
|
-
} else if (!rxValidColor.test(user.color)) {
|
|
66
|
-
// We only support 6-digit RGB colors in y-prosemirror
|
|
67
|
-
console.warn('A user uses an unsupported color format', user);
|
|
68
|
-
}
|
|
69
|
-
if (user.name == null) {
|
|
70
|
-
user.name = `User: ${remoteState.clientId}`;
|
|
71
|
-
}
|
|
72
|
-
|
|
85
|
+
const user = remoteState.user;
|
|
73
86
|
const cursor = remoteState.cursor;
|
|
74
87
|
let anchor = cursor.anchor || null;
|
|
75
88
|
let head = cursor.head || null;
|
|
@@ -81,9 +94,9 @@ export const createDecorations = (
|
|
|
81
94
|
decorations.push(
|
|
82
95
|
Decoration.widget(
|
|
83
96
|
head,
|
|
84
|
-
() => createCursor(user,
|
|
97
|
+
() => createCursor(user, pluginState.me, pluginState.colorMapper),
|
|
85
98
|
{
|
|
86
|
-
key: remoteState.clientId +
|
|
99
|
+
key: remoteState.clientId + user.id + user.name,
|
|
87
100
|
side: 10,
|
|
88
101
|
},
|
|
89
102
|
),
|
|
@@ -94,7 +107,7 @@ export const createDecorations = (
|
|
|
94
107
|
Decoration.inline(
|
|
95
108
|
from,
|
|
96
109
|
to,
|
|
97
|
-
createSelection(user,
|
|
110
|
+
createSelection(user, pluginState.me, pluginState.colorMapper),
|
|
98
111
|
{
|
|
99
112
|
inclusiveEnd: true,
|
|
100
113
|
inclusiveStart: false,
|
|
@@ -108,49 +121,62 @@ export const createDecorations = (
|
|
|
108
121
|
};
|
|
109
122
|
|
|
110
123
|
export const remoteSelectionPlugin = (
|
|
111
|
-
extension: ExtensionRemoteSelection,
|
|
112
|
-
editor: CoreEditor,
|
|
113
124
|
{
|
|
114
125
|
cursorBuilder = defaultCursorBuilder,
|
|
115
126
|
selectionBuilder = defaultSelectionBuilder,
|
|
116
127
|
}: {
|
|
117
|
-
cursorBuilder?: (
|
|
118
|
-
|
|
128
|
+
cursorBuilder?: (
|
|
129
|
+
user: User,
|
|
130
|
+
me: User,
|
|
131
|
+
colorMapper: ColorMapper,
|
|
132
|
+
) => HTMLElement;
|
|
133
|
+
selectionBuilder?: (
|
|
134
|
+
user: User,
|
|
135
|
+
me: User,
|
|
136
|
+
colorMapper: ColorMapper,
|
|
137
|
+
) => DecorationAttrs;
|
|
119
138
|
} = {},
|
|
120
139
|
) => {
|
|
121
|
-
return new Plugin({
|
|
140
|
+
return new Plugin<RemoteSelectionState>({
|
|
122
141
|
key: remoteSelectionPluginKey,
|
|
123
142
|
state: {
|
|
124
|
-
init(
|
|
125
|
-
return
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
);
|
|
143
|
+
init() {
|
|
144
|
+
return {
|
|
145
|
+
remoteStates: [],
|
|
146
|
+
me: generateBlankUser(),
|
|
147
|
+
colorMapper: defaultColorMapper,
|
|
148
|
+
};
|
|
131
149
|
},
|
|
132
|
-
apply(tr,
|
|
133
|
-
const
|
|
134
|
-
|
|
135
|
-
|
|
150
|
+
apply(tr, pluginState) {
|
|
151
|
+
const changeUser = tr.getMeta('changeUser');
|
|
152
|
+
if (changeUser) {
|
|
153
|
+
pluginState.me = { ...changeUser.user };
|
|
154
|
+
}
|
|
155
|
+
const setColorMapper = tr.getMeta('setColorMapper');
|
|
156
|
+
if (setColorMapper) {
|
|
157
|
+
pluginState.colorMapper = setColorMapper.colorMapper;
|
|
158
|
+
}
|
|
136
159
|
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
) {
|
|
141
|
-
return createDecorations(
|
|
142
|
-
newState,
|
|
143
|
-
extension,
|
|
144
|
-
cursorBuilder,
|
|
145
|
-
selectionBuilder,
|
|
146
|
-
);
|
|
160
|
+
const remoteSelectionChange = tr.getMeta('remoteSelectionChange');
|
|
161
|
+
if (remoteSelectionChange) {
|
|
162
|
+
pluginState.remoteStates = [...remoteSelectionChange.remoteStates];
|
|
147
163
|
}
|
|
148
|
-
|
|
164
|
+
|
|
165
|
+
return pluginState;
|
|
149
166
|
},
|
|
150
167
|
},
|
|
151
168
|
props: {
|
|
152
|
-
decorations
|
|
153
|
-
|
|
169
|
+
decorations(state) {
|
|
170
|
+
const pluginState = this.getState(state);
|
|
171
|
+
if (!pluginState) {
|
|
172
|
+
return DecorationSet.empty;
|
|
173
|
+
}
|
|
174
|
+
return createDecorations(
|
|
175
|
+
state,
|
|
176
|
+
pluginState,
|
|
177
|
+
cursorBuilder,
|
|
178
|
+
selectionBuilder,
|
|
179
|
+
);
|
|
154
180
|
},
|
|
155
181
|
},
|
|
156
182
|
});
|