@milkdown/plugin-upload 4.14.2 → 5.1.1
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/lib/index.d.ts +2 -2
- package/lib/index.d.ts.map +1 -1
- package/lib/upload.d.ts +16 -3
- package/lib/upload.d.ts.map +1 -1
- package/lib/upload.js +72 -71
- package/lib/upload.js.map +1 -1
- package/package.json +3 -3
- package/src/upload.ts +74 -73
package/lib/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { AtomList } from '@milkdown/utils';
|
|
2
2
|
export { Uploader, uploadPlugin } from './upload';
|
|
3
|
-
export declare const upload: AtomList<import("@milkdown/utils/lib/types").
|
|
3
|
+
export declare const upload: AtomList<import("@milkdown/utils/lib/types").Metadata<import("@milkdown/utils/lib/types").GetPlugin<string, {
|
|
4
4
|
uploader: import("./upload").Uploader;
|
|
5
|
-
}
|
|
5
|
+
}>> & import("@milkdown/core").MilkdownPlugin>;
|
|
6
6
|
//# sourceMappingURL=index.d.ts.map
|
package/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAI3C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAElD,eAAO,MAAM,MAAM;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAI3C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAElD,eAAO,MAAM,MAAM;;8CAAoC,CAAC"}
|
package/lib/upload.d.ts
CHANGED
|
@@ -1,8 +1,21 @@
|
|
|
1
1
|
/// <reference types="prosemirror-model" />
|
|
2
2
|
import type { Fragment, Node, Schema } from '@milkdown/prose';
|
|
3
|
-
import { Plugin } from '@milkdown/prose';
|
|
4
3
|
export declare type Uploader = (files: FileList, schema: Schema) => Promise<Fragment | Node | Node[]>;
|
|
5
|
-
export declare const uploadPlugin: import("@milkdown/utils/lib/types").
|
|
4
|
+
export declare const uploadPlugin: import("@milkdown/utils/lib/types").WithExtend<string, {
|
|
6
5
|
uploader: Uploader;
|
|
7
|
-
},
|
|
6
|
+
}, {
|
|
7
|
+
[x: string]: import("prosemirror-model").NodeType<any>;
|
|
8
|
+
} & {
|
|
9
|
+
[x: string]: import("prosemirror-model").MarkType<any>;
|
|
10
|
+
}, {
|
|
11
|
+
schema?: ((ctx: import("@milkdown/core").Ctx) => {
|
|
12
|
+
node?: Record<string, import("@milkdown/core").NodeSchema> | undefined;
|
|
13
|
+
mark?: Record<string, import("@milkdown/core").MarkSchema> | undefined;
|
|
14
|
+
}) | undefined;
|
|
15
|
+
view?: ((ctx: import("@milkdown/core").Ctx) => Partial<{
|
|
16
|
+
[x: string]: import("@milkdown/prose").NodeViewFactory;
|
|
17
|
+
} & {
|
|
18
|
+
[x: string]: import("@milkdown/prose").MarkViewFactory;
|
|
19
|
+
}>) | undefined;
|
|
20
|
+
}>;
|
|
8
21
|
//# sourceMappingURL=upload.d.ts.map
|
package/lib/upload.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["../src/upload.ts"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["../src/upload.ts"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAM9D,oBAAY,QAAQ,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,QAAQ,GAAG,IAAI,GAAG,IAAI,EAAE,CAAC,CAAC;AAG9F,eAAO,MAAM,YAAY;cAAoC,QAAQ;;;;;;;;;;;;;;;EA+EnE,CAAC"}
|
package/lib/upload.js
CHANGED
|
@@ -1,81 +1,82 @@
|
|
|
1
1
|
/* Copyright 2021, Milkdown by Mirone. */
|
|
2
2
|
import { schemaCtx, themeToolCtx } from '@milkdown/core';
|
|
3
3
|
import { Decoration, DecorationSet, Plugin } from '@milkdown/prose';
|
|
4
|
-
import {
|
|
4
|
+
import { createPlugin } from '@milkdown/utils';
|
|
5
5
|
import { defaultUploader } from './default-uploader';
|
|
6
|
-
export const uploadPlugin =
|
|
6
|
+
export const uploadPlugin = createPlugin((_, options) => {
|
|
7
7
|
var _a;
|
|
8
8
|
const uploader = (_a = options === null || options === void 0 ? void 0 : options.uploader) !== null && _a !== void 0 ? _a : defaultUploader;
|
|
9
|
-
const schema = utils.ctx.get(schemaCtx);
|
|
10
|
-
const placeholderPlugin = new Plugin({
|
|
11
|
-
state: {
|
|
12
|
-
init() {
|
|
13
|
-
return DecorationSet.empty;
|
|
14
|
-
},
|
|
15
|
-
apply(tr, set) {
|
|
16
|
-
const _set = set.map(tr.mapping, tr.doc);
|
|
17
|
-
const action = tr.getMeta(this);
|
|
18
|
-
if (!action) {
|
|
19
|
-
return _set;
|
|
20
|
-
}
|
|
21
|
-
if (action.add) {
|
|
22
|
-
const widget = document.createElement('span');
|
|
23
|
-
const { icon } = utils.ctx.get(themeToolCtx).slots;
|
|
24
|
-
widget.appendChild(icon('loading'));
|
|
25
|
-
const decoration = Decoration.widget(action.add.pos, widget, { id: action.add.id });
|
|
26
|
-
return _set.add(tr.doc, [decoration]);
|
|
27
|
-
}
|
|
28
|
-
if (action.remove) {
|
|
29
|
-
return _set.remove(_set.find(null, null, (spec) => spec.id === action.remove.id));
|
|
30
|
-
}
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
props: {
|
|
34
|
-
decorations(state) {
|
|
35
|
-
return this.getState(state);
|
|
36
|
-
},
|
|
37
|
-
},
|
|
38
|
-
});
|
|
39
|
-
const findPlaceholder = (state, id) => {
|
|
40
|
-
const decorations = placeholderPlugin.getState(state);
|
|
41
|
-
const found = decorations.find(null, null, (spec) => spec.id === id);
|
|
42
|
-
return found.length ? found[0].from : -1;
|
|
43
|
-
};
|
|
44
|
-
const uploadPlugin = new Plugin({
|
|
45
|
-
props: {
|
|
46
|
-
handleDrop: (view, event) => {
|
|
47
|
-
var _a, _b, _c;
|
|
48
|
-
if (!(event instanceof DragEvent)) {
|
|
49
|
-
return false;
|
|
50
|
-
}
|
|
51
|
-
const { files } = (_a = event.dataTransfer) !== null && _a !== void 0 ? _a : {};
|
|
52
|
-
if (!files || files.length <= 0) {
|
|
53
|
-
return false;
|
|
54
|
-
}
|
|
55
|
-
const id = Symbol('upload symbol');
|
|
56
|
-
const { tr } = view.state;
|
|
57
|
-
const insertPos = (_c = (_b = view.posAtCoords({ left: event.clientX, top: event.clientY })) === null || _b === void 0 ? void 0 : _b.pos) !== null && _c !== void 0 ? _c : tr.selection.from;
|
|
58
|
-
view.dispatch(tr.setMeta(placeholderPlugin, { add: { id, pos: insertPos } }));
|
|
59
|
-
uploader(files, schema)
|
|
60
|
-
.then((fragment) => {
|
|
61
|
-
const pos = findPlaceholder(view.state, id);
|
|
62
|
-
if (pos < 0)
|
|
63
|
-
return;
|
|
64
|
-
view.dispatch(view.state.tr
|
|
65
|
-
.replaceWith(pos, pos, fragment)
|
|
66
|
-
.setMeta(placeholderPlugin, { remove: { id } }));
|
|
67
|
-
return;
|
|
68
|
-
})
|
|
69
|
-
.catch((e) => {
|
|
70
|
-
console.error(e);
|
|
71
|
-
});
|
|
72
|
-
return true;
|
|
73
|
-
},
|
|
74
|
-
},
|
|
75
|
-
});
|
|
76
9
|
return {
|
|
77
|
-
|
|
78
|
-
|
|
10
|
+
prosePlugins: (_, ctx) => {
|
|
11
|
+
const schema = ctx.get(schemaCtx);
|
|
12
|
+
const placeholderPlugin = new Plugin({
|
|
13
|
+
state: {
|
|
14
|
+
init() {
|
|
15
|
+
return DecorationSet.empty;
|
|
16
|
+
},
|
|
17
|
+
apply(tr, set) {
|
|
18
|
+
const _set = set.map(tr.mapping, tr.doc);
|
|
19
|
+
const action = tr.getMeta(this);
|
|
20
|
+
if (!action) {
|
|
21
|
+
return _set;
|
|
22
|
+
}
|
|
23
|
+
if (action.add) {
|
|
24
|
+
const widget = document.createElement('span');
|
|
25
|
+
const { icon } = ctx.get(themeToolCtx).slots;
|
|
26
|
+
widget.appendChild(icon('loading'));
|
|
27
|
+
const decoration = Decoration.widget(action.add.pos, widget, { id: action.add.id });
|
|
28
|
+
return _set.add(tr.doc, [decoration]);
|
|
29
|
+
}
|
|
30
|
+
if (action.remove) {
|
|
31
|
+
return _set.remove(_set.find(null, null, (spec) => spec.id === action.remove.id));
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
},
|
|
35
|
+
props: {
|
|
36
|
+
decorations(state) {
|
|
37
|
+
return this.getState(state);
|
|
38
|
+
},
|
|
39
|
+
},
|
|
40
|
+
});
|
|
41
|
+
const findPlaceholder = (state, id) => {
|
|
42
|
+
const decorations = placeholderPlugin.getState(state);
|
|
43
|
+
const found = decorations.find(null, null, (spec) => spec.id === id);
|
|
44
|
+
return found.length ? found[0].from : -1;
|
|
45
|
+
};
|
|
46
|
+
const uploadPlugin = new Plugin({
|
|
47
|
+
props: {
|
|
48
|
+
handleDrop: (view, event) => {
|
|
49
|
+
var _a, _b, _c;
|
|
50
|
+
if (!(event instanceof DragEvent)) {
|
|
51
|
+
return false;
|
|
52
|
+
}
|
|
53
|
+
const { files } = (_a = event.dataTransfer) !== null && _a !== void 0 ? _a : {};
|
|
54
|
+
if (!files || files.length <= 0) {
|
|
55
|
+
return false;
|
|
56
|
+
}
|
|
57
|
+
const id = Symbol('upload symbol');
|
|
58
|
+
const { tr } = view.state;
|
|
59
|
+
const insertPos = (_c = (_b = view.posAtCoords({ left: event.clientX, top: event.clientY })) === null || _b === void 0 ? void 0 : _b.pos) !== null && _c !== void 0 ? _c : tr.selection.from;
|
|
60
|
+
view.dispatch(tr.setMeta(placeholderPlugin, { add: { id, pos: insertPos } }));
|
|
61
|
+
uploader(files, schema)
|
|
62
|
+
.then((fragment) => {
|
|
63
|
+
const pos = findPlaceholder(view.state, id);
|
|
64
|
+
if (pos < 0)
|
|
65
|
+
return;
|
|
66
|
+
view.dispatch(view.state.tr
|
|
67
|
+
.replaceWith(pos, pos, fragment)
|
|
68
|
+
.setMeta(placeholderPlugin, { remove: { id } }));
|
|
69
|
+
return;
|
|
70
|
+
})
|
|
71
|
+
.catch((e) => {
|
|
72
|
+
console.error(e);
|
|
73
|
+
});
|
|
74
|
+
return true;
|
|
75
|
+
},
|
|
76
|
+
},
|
|
77
|
+
});
|
|
78
|
+
return [placeholderPlugin, uploadPlugin];
|
|
79
|
+
},
|
|
79
80
|
};
|
|
80
81
|
});
|
|
81
82
|
//# sourceMappingURL=upload.js.map
|
package/lib/upload.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"upload.js","sourceRoot":"","sources":["../src/upload.ts"],"names":[],"mappings":"AAAA,yCAAyC;AACzC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEzD,OAAO,EAAE,UAAU,EAAE,aAAa,EAAe,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACjF,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"upload.js","sourceRoot":"","sources":["../src/upload.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@milkdown/plugin-upload",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.1.1",
|
|
4
4
|
"main": "lib/index.js",
|
|
5
5
|
"module": "lib/index.js",
|
|
6
6
|
"types": "lib/index.d.ts",
|
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
"@milkdown/core": "*"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@milkdown/utils": "
|
|
22
|
-
"tslib": "^2.
|
|
21
|
+
"@milkdown/utils": "5.1.1",
|
|
22
|
+
"tslib": "^2.3.1"
|
|
23
23
|
},
|
|
24
24
|
"scripts": {
|
|
25
25
|
"start": "vite",
|
package/src/upload.ts
CHANGED
|
@@ -2,89 +2,90 @@
|
|
|
2
2
|
import { schemaCtx, themeToolCtx } from '@milkdown/core';
|
|
3
3
|
import type { Fragment, Node, Schema } from '@milkdown/prose';
|
|
4
4
|
import { Decoration, DecorationSet, EditorState, Plugin } from '@milkdown/prose';
|
|
5
|
-
import {
|
|
5
|
+
import { createPlugin } from '@milkdown/utils';
|
|
6
6
|
|
|
7
7
|
import { defaultUploader } from './default-uploader';
|
|
8
8
|
|
|
9
9
|
export type Uploader = (files: FileList, schema: Schema) => Promise<Fragment | Node | Node[]>;
|
|
10
10
|
type Spec = { id: symbol; pos: number };
|
|
11
11
|
|
|
12
|
-
export const uploadPlugin =
|
|
12
|
+
export const uploadPlugin = createPlugin<string, { uploader: Uploader }>((_, options) => {
|
|
13
13
|
const uploader = options?.uploader ?? defaultUploader;
|
|
14
|
-
const schema = utils.ctx.get(schemaCtx);
|
|
15
14
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
return DecorationSet.empty;
|
|
20
|
-
},
|
|
21
|
-
apply(tr, set) {
|
|
22
|
-
const _set = set.map(tr.mapping, tr.doc);
|
|
23
|
-
const action = tr.getMeta(this);
|
|
24
|
-
if (!action) {
|
|
25
|
-
return _set;
|
|
26
|
-
}
|
|
27
|
-
if (action.add) {
|
|
28
|
-
const widget = document.createElement('span');
|
|
29
|
-
const { icon } = utils.ctx.get(themeToolCtx).slots;
|
|
30
|
-
widget.appendChild(icon('loading'));
|
|
31
|
-
const decoration = Decoration.widget(action.add.pos, widget, { id: action.add.id });
|
|
32
|
-
return _set.add(tr.doc, [decoration]);
|
|
33
|
-
}
|
|
34
|
-
if (action.remove) {
|
|
35
|
-
return _set.remove(_set.find(null, null, (spec: Spec) => spec.id === action.remove.id));
|
|
36
|
-
}
|
|
37
|
-
},
|
|
38
|
-
},
|
|
39
|
-
props: {
|
|
40
|
-
decorations(state) {
|
|
41
|
-
return this.getState(state);
|
|
42
|
-
},
|
|
43
|
-
},
|
|
44
|
-
});
|
|
45
|
-
const findPlaceholder = (state: EditorState, id: symbol): number => {
|
|
46
|
-
const decorations = placeholderPlugin.getState(state);
|
|
47
|
-
const found = decorations.find(null, null, (spec: Spec) => spec.id === id);
|
|
48
|
-
return found.length ? found[0].from : -1;
|
|
49
|
-
};
|
|
50
|
-
const uploadPlugin = new Plugin({
|
|
51
|
-
props: {
|
|
52
|
-
handleDrop: (view, event) => {
|
|
53
|
-
if (!(event instanceof DragEvent)) {
|
|
54
|
-
return false;
|
|
55
|
-
}
|
|
56
|
-
const { files } = event.dataTransfer ?? {};
|
|
57
|
-
if (!files || files.length <= 0) {
|
|
58
|
-
return false;
|
|
59
|
-
}
|
|
60
|
-
const id = Symbol('upload symbol');
|
|
61
|
-
const { tr } = view.state;
|
|
62
|
-
const insertPos =
|
|
63
|
-
view.posAtCoords({ left: event.clientX, top: event.clientY })?.pos ?? tr.selection.from;
|
|
64
|
-
view.dispatch(tr.setMeta(placeholderPlugin, { add: { id, pos: insertPos } }));
|
|
15
|
+
return {
|
|
16
|
+
prosePlugins: (_, ctx) => {
|
|
17
|
+
const schema = ctx.get(schemaCtx);
|
|
65
18
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
19
|
+
const placeholderPlugin = new Plugin({
|
|
20
|
+
state: {
|
|
21
|
+
init() {
|
|
22
|
+
return DecorationSet.empty;
|
|
23
|
+
},
|
|
24
|
+
apply(tr, set) {
|
|
25
|
+
const _set = set.map(tr.mapping, tr.doc);
|
|
26
|
+
const action = tr.getMeta(this);
|
|
27
|
+
if (!action) {
|
|
28
|
+
return _set;
|
|
29
|
+
}
|
|
30
|
+
if (action.add) {
|
|
31
|
+
const widget = document.createElement('span');
|
|
32
|
+
const { icon } = ctx.get(themeToolCtx).slots;
|
|
33
|
+
widget.appendChild(icon('loading'));
|
|
34
|
+
const decoration = Decoration.widget(action.add.pos, widget, { id: action.add.id });
|
|
35
|
+
return _set.add(tr.doc, [decoration]);
|
|
36
|
+
}
|
|
37
|
+
if (action.remove) {
|
|
38
|
+
return _set.remove(_set.find(null, null, (spec: Spec) => spec.id === action.remove.id));
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
props: {
|
|
43
|
+
decorations(state) {
|
|
44
|
+
return this.getState(state);
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
});
|
|
48
|
+
const findPlaceholder = (state: EditorState, id: symbol): number => {
|
|
49
|
+
const decorations = placeholderPlugin.getState(state);
|
|
50
|
+
const found = decorations.find(null, null, (spec: Spec) => spec.id === id);
|
|
51
|
+
return found.length ? found[0].from : -1;
|
|
52
|
+
};
|
|
53
|
+
const uploadPlugin = new Plugin({
|
|
54
|
+
props: {
|
|
55
|
+
handleDrop: (view, event) => {
|
|
56
|
+
if (!(event instanceof DragEvent)) {
|
|
57
|
+
return false;
|
|
58
|
+
}
|
|
59
|
+
const { files } = event.dataTransfer ?? {};
|
|
60
|
+
if (!files || files.length <= 0) {
|
|
61
|
+
return false;
|
|
62
|
+
}
|
|
63
|
+
const id = Symbol('upload symbol');
|
|
64
|
+
const { tr } = view.state;
|
|
65
|
+
const insertPos =
|
|
66
|
+
view.posAtCoords({ left: event.clientX, top: event.clientY })?.pos ?? tr.selection.from;
|
|
67
|
+
view.dispatch(tr.setMeta(placeholderPlugin, { add: { id, pos: insertPos } }));
|
|
70
68
|
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
);
|
|
76
|
-
return;
|
|
77
|
-
})
|
|
78
|
-
.catch((e) => {
|
|
79
|
-
console.error(e);
|
|
80
|
-
});
|
|
81
|
-
return true;
|
|
82
|
-
},
|
|
83
|
-
},
|
|
84
|
-
});
|
|
69
|
+
uploader(files, schema)
|
|
70
|
+
.then((fragment) => {
|
|
71
|
+
const pos = findPlaceholder(view.state, id);
|
|
72
|
+
if (pos < 0) return;
|
|
85
73
|
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
74
|
+
view.dispatch(
|
|
75
|
+
view.state.tr
|
|
76
|
+
.replaceWith(pos, pos, fragment)
|
|
77
|
+
.setMeta(placeholderPlugin, { remove: { id } }),
|
|
78
|
+
);
|
|
79
|
+
return;
|
|
80
|
+
})
|
|
81
|
+
.catch((e) => {
|
|
82
|
+
console.error(e);
|
|
83
|
+
});
|
|
84
|
+
return true;
|
|
85
|
+
},
|
|
86
|
+
},
|
|
87
|
+
});
|
|
88
|
+
return [placeholderPlugin, uploadPlugin];
|
|
89
|
+
},
|
|
89
90
|
};
|
|
90
91
|
});
|