@prosekit/vue 0.6.6 → 0.6.8
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/{create-component-BREKWlWW.js → create-component.js} +3 -4
- package/dist/create-component.js.map +1 -0
- package/dist/{create-emits-B8725q2G.d.ts → create-emits.d.ts} +1 -1
- package/dist/create-emits.d.ts.map +1 -0
- package/dist/{editor-context-BfHHplRP.js → editor-context.js} +2 -3
- package/dist/editor-context.js.map +1 -0
- package/dist/prosekit-vue-autocomplete.d.ts +1 -1
- package/dist/prosekit-vue-autocomplete.js +2 -6
- package/dist/prosekit-vue-autocomplete.js.map +1 -1
- package/dist/prosekit-vue-block-handle.d.ts +1 -1
- package/dist/prosekit-vue-block-handle.js +2 -5
- package/dist/prosekit-vue-block-handle.js.map +1 -1
- package/dist/prosekit-vue-drop-indicator.d.ts +1 -1
- package/dist/prosekit-vue-drop-indicator.js +2 -3
- package/dist/prosekit-vue-drop-indicator.js.map +1 -1
- package/dist/prosekit-vue-inline-popover.d.ts +1 -1
- package/dist/prosekit-vue-inline-popover.js +2 -3
- package/dist/prosekit-vue-inline-popover.js.map +1 -1
- package/dist/prosekit-vue-popover.d.ts +1 -1
- package/dist/prosekit-vue-popover.js +2 -5
- package/dist/prosekit-vue-popover.js.map +1 -1
- package/dist/prosekit-vue-resizable.d.ts +1 -1
- package/dist/prosekit-vue-resizable.js +2 -4
- package/dist/prosekit-vue-resizable.js.map +1 -1
- package/dist/prosekit-vue-table-handle.d.ts +1 -1
- package/dist/prosekit-vue-table-handle.js +2 -11
- package/dist/prosekit-vue-table-handle.js.map +1 -1
- package/dist/prosekit-vue-tooltip.d.ts +1 -1
- package/dist/prosekit-vue-tooltip.js +2 -5
- package/dist/prosekit-vue-tooltip.js.map +1 -1
- package/dist/prosekit-vue.d.ts +17 -17
- package/dist/prosekit-vue.d.ts.map +1 -1
- package/dist/prosekit-vue.js +118 -120
- package/dist/prosekit-vue.js.map +1 -1
- package/package.json +10 -9
- package/src/components/autocomplete/autocomplete-empty.gen.ts +2 -2
- package/src/components/autocomplete/autocomplete-item.gen.ts +2 -2
- package/src/components/autocomplete/autocomplete-list.gen.ts +2 -2
- package/src/components/autocomplete/autocomplete-popover.gen.ts +2 -2
- package/src/components/autocomplete/index.gen.ts +4 -4
- package/src/components/block-handle/block-handle-add.gen.ts +2 -2
- package/src/components/block-handle/block-handle-draggable.gen.ts +2 -2
- package/src/components/block-handle/block-handle-popover.gen.ts +2 -2
- package/src/components/block-handle/index.gen.ts +3 -3
- package/src/components/create-component.ts +1 -1
- package/src/components/drop-indicator/drop-indicator.gen.ts +2 -2
- package/src/components/drop-indicator/index.gen.ts +1 -1
- package/src/components/inline-popover/index.gen.ts +1 -1
- package/src/components/inline-popover/inline-popover.gen.ts +2 -2
- package/src/components/popover/index.gen.ts +3 -3
- package/src/components/popover/popover-content.gen.ts +2 -2
- package/src/components/popover/popover-root.gen.ts +2 -2
- package/src/components/popover/popover-trigger.gen.ts +2 -2
- package/src/components/prosekit.ts +9 -11
- package/src/components/resizable/index.gen.ts +2 -2
- package/src/components/resizable/resizable-handle.gen.ts +2 -2
- package/src/components/resizable/resizable-root.gen.ts +2 -2
- package/src/components/table-handle/index.gen.ts +9 -9
- package/src/components/table-handle/table-handle-column-root.gen.ts +2 -2
- package/src/components/table-handle/table-handle-column-trigger.gen.ts +2 -2
- package/src/components/table-handle/table-handle-drag-preview.gen.ts +2 -2
- package/src/components/table-handle/table-handle-drop-indicator.gen.ts +2 -2
- package/src/components/table-handle/table-handle-popover-content.gen.ts +2 -2
- package/src/components/table-handle/table-handle-popover-item.gen.ts +2 -2
- package/src/components/table-handle/table-handle-root.gen.ts +2 -2
- package/src/components/table-handle/table-handle-row-root.gen.ts +2 -2
- package/src/components/table-handle/table-handle-row-trigger.gen.ts +2 -2
- package/src/components/tooltip/index.gen.ts +3 -3
- package/src/components/tooltip/tooltip-content.gen.ts +2 -2
- package/src/components/tooltip/tooltip-root.gen.ts +2 -2
- package/src/components/tooltip/tooltip-trigger.gen.ts +2 -2
- package/src/components/view-renderer.ts +34 -0
- package/src/extensions/vue-mark-view.ts +33 -46
- package/src/extensions/vue-node-view.ts +33 -46
- package/src/hooks/use-doc-change.ts +1 -1
- package/src/hooks/use-editor-derived-value.ts +1 -1
- package/src/hooks/use-editor-extension.ts +1 -1
- package/src/hooks/use-editor.ts +2 -2
- package/src/hooks/use-extension.spec.ts +1 -1
- package/src/hooks/use-extension.ts +2 -2
- package/src/hooks/use-keymap.ts +1 -1
- package/src/hooks/use-state-update.ts +1 -1
- package/src/index.ts +9 -9
- package/dist/create-component-BREKWlWW.js.map +0 -1
- package/dist/create-emits-B8725q2G.d.ts.map +0 -1
- package/dist/editor-context-BfHHplRP.js.map +0 -1
package/dist/prosekit-vue.js
CHANGED
|
@@ -1,139 +1,125 @@
|
|
|
1
|
-
import { n as useEditorContext, t as provideEditor } from "./editor-context
|
|
2
|
-
import {
|
|
3
|
-
import { computed, defineComponent, h, onMounted, onUnmounted, shallowRef, toValue, triggerRef, watchPostEffect } from "vue";
|
|
1
|
+
import { n as useEditorContext, t as provideEditor } from "./editor-context.js";
|
|
2
|
+
import { Teleport, computed, defineComponent, h, markRaw, onMounted, onUnmounted, shallowRef, toValue, triggerRef, watchPostEffect } from "vue";
|
|
4
3
|
import { EditorNotFoundError, ProseKitError, defineDocChangeHandler, defineKeymap, defineMarkViewComponent, defineMarkViewFactory, defineMountHandler, defineNodeViewComponent, defineNodeViewFactory, defineUpdateHandler, union, withPriority } from "@prosekit/core";
|
|
5
|
-
|
|
6
|
-
//#region src/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
4
|
+
import { AbstractVueMarkView, AbstractVueNodeView, buildVueMarkViewCreator, buildVueNodeViewCreator, useVueRenderer } from "@prosemirror-adapter/vue";
|
|
5
|
+
//#region src/extensions/vue-mark-view.ts
|
|
6
|
+
var ProseKitVueMarkView = class extends AbstractVueMarkView {
|
|
7
|
+
constructor(..._args) {
|
|
8
|
+
super(..._args);
|
|
9
|
+
this.render = () => {
|
|
10
|
+
const UserComponent = this.component;
|
|
11
|
+
const render = () => {
|
|
12
|
+
const props = this.context;
|
|
13
|
+
return h(Teleport, {
|
|
14
|
+
key: this.key,
|
|
15
|
+
to: this.dom
|
|
16
|
+
}, [h(UserComponent, props)]);
|
|
17
|
+
};
|
|
18
|
+
return markRaw(defineComponent({
|
|
19
|
+
name: "ProsemirrorMarkView",
|
|
20
|
+
setup: () => {
|
|
21
|
+
return render;
|
|
22
|
+
}
|
|
23
|
+
}));
|
|
24
|
+
};
|
|
25
|
+
}
|
|
26
|
+
};
|
|
22
27
|
/**
|
|
23
28
|
* @internal
|
|
24
29
|
*/
|
|
25
|
-
function
|
|
26
|
-
return
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
//#endregion
|
|
33
|
-
//#region src/hooks/use-extension.ts
|
|
34
|
-
/**
|
|
35
|
-
* Add an extension to the editor.
|
|
36
|
-
*
|
|
37
|
-
* @public
|
|
38
|
-
*/
|
|
39
|
-
function useExtension(extension, options) {
|
|
40
|
-
useEditorExtension(options?.editor, usePriorityExtension(extension, options?.priority));
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
//#endregion
|
|
44
|
-
//#region src/extensions/vue-mark-view.ts
|
|
45
|
-
function withMarkViewProps(component) {
|
|
46
|
-
return defineComponent({
|
|
47
|
-
name: "MarkViewPropsWrapper",
|
|
48
|
-
setup: () => {
|
|
49
|
-
const props = useMarkViewContext();
|
|
50
|
-
return () => h(component, props);
|
|
51
|
-
}
|
|
30
|
+
function defineVueMarkViewFactory(renderVueRenderer, removeVueRenderer) {
|
|
31
|
+
return defineMarkViewFactory({
|
|
32
|
+
group: "vue",
|
|
33
|
+
factory: buildVueMarkViewCreator(renderVueRenderer, removeVueRenderer, ProseKitVueMarkView)
|
|
52
34
|
});
|
|
53
35
|
}
|
|
54
36
|
/**
|
|
55
|
-
* @internal
|
|
56
|
-
*/
|
|
57
|
-
const VueMarkViewsConsumer = /* @__PURE__ */ defineComponent({
|
|
58
|
-
name: "VueMarkViewsConsumer",
|
|
59
|
-
setup: () => {
|
|
60
|
-
const markViewFactory = useMarkViewFactory();
|
|
61
|
-
useExtension(computed(() => {
|
|
62
|
-
return defineVueMarkViewFactory(markViewFactory);
|
|
63
|
-
}));
|
|
64
|
-
return () => null;
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
/**
|
|
68
37
|
* Defines a mark view using a Vue component.
|
|
69
38
|
*
|
|
70
39
|
* @public
|
|
71
40
|
*/
|
|
72
41
|
function defineVueMarkView(options) {
|
|
73
|
-
const { name, component, ...userOptions } = options;
|
|
74
42
|
return defineMarkViewComponent({
|
|
75
43
|
group: "vue",
|
|
76
|
-
name,
|
|
77
|
-
args:
|
|
78
|
-
...userOptions,
|
|
79
|
-
component: withMarkViewProps(component)
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
function defineVueMarkViewFactory(factory) {
|
|
84
|
-
return defineMarkViewFactory({
|
|
85
|
-
group: "vue",
|
|
86
|
-
factory
|
|
44
|
+
name: options.name,
|
|
45
|
+
args: options
|
|
87
46
|
});
|
|
88
47
|
}
|
|
89
|
-
|
|
90
48
|
//#endregion
|
|
91
49
|
//#region src/extensions/vue-node-view.ts
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
const
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
50
|
+
var ProseKitVueNodeView = class extends AbstractVueNodeView {
|
|
51
|
+
constructor(..._args) {
|
|
52
|
+
super(..._args);
|
|
53
|
+
this.render = () => {
|
|
54
|
+
const UserComponent = this.component;
|
|
55
|
+
const render = () => {
|
|
56
|
+
const props = this.context;
|
|
57
|
+
return h(Teleport, {
|
|
58
|
+
key: this.key,
|
|
59
|
+
to: this.dom
|
|
60
|
+
}, [h(UserComponent, props)]);
|
|
61
|
+
};
|
|
62
|
+
return markRaw(defineComponent({
|
|
63
|
+
name: "ProsemirrorNodeView",
|
|
64
|
+
setup: () => {
|
|
65
|
+
return render;
|
|
66
|
+
}
|
|
67
|
+
}));
|
|
68
|
+
};
|
|
69
|
+
}
|
|
70
|
+
};
|
|
101
71
|
/**
|
|
102
72
|
* @internal
|
|
103
73
|
*/
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
}));
|
|
111
|
-
return () => null;
|
|
112
|
-
}
|
|
113
|
-
});
|
|
74
|
+
function defineVueNodeViewFactory(renderVueRenderer, removeVueRenderer) {
|
|
75
|
+
return defineNodeViewFactory({
|
|
76
|
+
group: "vue",
|
|
77
|
+
factory: buildVueNodeViewCreator(renderVueRenderer, removeVueRenderer, ProseKitVueNodeView)
|
|
78
|
+
});
|
|
79
|
+
}
|
|
114
80
|
/**
|
|
115
81
|
* Defines a node view using a Vue component.
|
|
116
82
|
*
|
|
117
83
|
* @public
|
|
118
84
|
*/
|
|
119
85
|
function defineVueNodeView(options) {
|
|
120
|
-
const { name, component, ...userOptions } = options;
|
|
121
86
|
return defineNodeViewComponent({
|
|
122
87
|
group: "vue",
|
|
123
|
-
name,
|
|
124
|
-
args:
|
|
125
|
-
...userOptions,
|
|
126
|
-
component: withNodeViewProps(component)
|
|
127
|
-
}
|
|
88
|
+
name: options.name,
|
|
89
|
+
args: options
|
|
128
90
|
});
|
|
129
91
|
}
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
92
|
+
//#endregion
|
|
93
|
+
//#region src/hooks/use-editor-extension.ts
|
|
94
|
+
/**
|
|
95
|
+
* @internal
|
|
96
|
+
*/
|
|
97
|
+
function useEditorExtension(editorRef, extensionRef) {
|
|
98
|
+
const editorContext = useEditorContext();
|
|
99
|
+
watchPostEffect((onCleanup) => {
|
|
100
|
+
const editor = toValue(editorRef) || toValue(editorContext);
|
|
101
|
+
const extension = toValue(extensionRef);
|
|
102
|
+
if (!editor) throw new EditorNotFoundError();
|
|
103
|
+
if (extension) onCleanup(editor.use(extension));
|
|
134
104
|
});
|
|
135
105
|
}
|
|
136
|
-
|
|
106
|
+
//#endregion
|
|
107
|
+
//#region src/components/view-renderer.ts
|
|
108
|
+
/**
|
|
109
|
+
* @internal
|
|
110
|
+
*/
|
|
111
|
+
const ViewRenderer = defineComponent({
|
|
112
|
+
name: "ViewRenderer",
|
|
113
|
+
props: { editor: {
|
|
114
|
+
type: Object,
|
|
115
|
+
required: true
|
|
116
|
+
} },
|
|
117
|
+
setup: (props, { slots }) => {
|
|
118
|
+
const { renderVueRenderer, removeVueRenderer, render } = useVueRenderer();
|
|
119
|
+
useEditorExtension(() => props.editor, union([defineVueMarkViewFactory(renderVueRenderer, removeVueRenderer), defineVueNodeViewFactory(renderVueRenderer, removeVueRenderer)]));
|
|
120
|
+
return () => [slots.default?.(), render()];
|
|
121
|
+
}
|
|
122
|
+
});
|
|
137
123
|
//#endregion
|
|
138
124
|
//#region src/components/prosekit.ts
|
|
139
125
|
/**
|
|
@@ -149,16 +135,30 @@ const ProseKit = defineComponent({
|
|
|
149
135
|
} },
|
|
150
136
|
setup: (props, { slots }) => {
|
|
151
137
|
provideEditor(props.editor);
|
|
152
|
-
return () => {
|
|
153
|
-
return h(ProsemirrorAdapterProvider, null, () => [
|
|
154
|
-
h(VueNodeViewsConsumer),
|
|
155
|
-
h(VueMarkViewsConsumer),
|
|
156
|
-
slots.default?.()
|
|
157
|
-
]);
|
|
158
|
-
};
|
|
138
|
+
return () => h(ViewRenderer, { editor: props.editor }, () => slots.default?.());
|
|
159
139
|
}
|
|
160
140
|
});
|
|
161
|
-
|
|
141
|
+
//#endregion
|
|
142
|
+
//#region src/hooks/use-priority-extension.ts
|
|
143
|
+
/**
|
|
144
|
+
* @internal
|
|
145
|
+
*/
|
|
146
|
+
function usePriorityExtension(extension, priority) {
|
|
147
|
+
return computed(() => {
|
|
148
|
+
const ext = toValue(extension);
|
|
149
|
+
return ext && priority ? withPriority(ext, priority) : ext;
|
|
150
|
+
});
|
|
151
|
+
}
|
|
152
|
+
//#endregion
|
|
153
|
+
//#region src/hooks/use-extension.ts
|
|
154
|
+
/**
|
|
155
|
+
* Add an extension to the editor.
|
|
156
|
+
*
|
|
157
|
+
* @public
|
|
158
|
+
*/
|
|
159
|
+
function useExtension(extension, options) {
|
|
160
|
+
useEditorExtension(options?.editor, usePriorityExtension(extension, options?.priority));
|
|
161
|
+
}
|
|
162
162
|
//#endregion
|
|
163
163
|
//#region src/hooks/use-doc-change.ts
|
|
164
164
|
/**
|
|
@@ -169,7 +169,6 @@ const ProseKit = defineComponent({
|
|
|
169
169
|
function useDocChange(handler, options) {
|
|
170
170
|
useExtension(defineDocChangeHandler((view) => handler(view.state.doc)), options);
|
|
171
171
|
}
|
|
172
|
-
|
|
173
172
|
//#endregion
|
|
174
173
|
//#region src/hooks/use-editor.ts
|
|
175
174
|
/**
|
|
@@ -182,14 +181,15 @@ function useEditor(options) {
|
|
|
182
181
|
const editor = useEditorContext();
|
|
183
182
|
if (!editor) throw new ProseKitError("useEditor must be used within the ProseKit component");
|
|
184
183
|
const editorRef = shallowRef(editor);
|
|
185
|
-
if (update)
|
|
184
|
+
if (update) {
|
|
186
185
|
const forceUpdate = () => triggerRef(editorRef);
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
186
|
+
onMounted(() => {
|
|
187
|
+
const extension = union(defineMountHandler(forceUpdate), defineUpdateHandler(forceUpdate));
|
|
188
|
+
onUnmounted(editor.use(extension));
|
|
189
|
+
});
|
|
190
|
+
}
|
|
190
191
|
return editorRef;
|
|
191
192
|
}
|
|
192
|
-
|
|
193
193
|
//#endregion
|
|
194
194
|
//#region src/hooks/use-editor-derived-value.ts
|
|
195
195
|
/**
|
|
@@ -209,13 +209,11 @@ function useEditorDerivedValue(derive, options) {
|
|
|
209
209
|
const editorAccessor = initialEditor ? computed(() => toValue(initialEditor)) : useEditor({ update: true });
|
|
210
210
|
return computed(() => derive(toValue(editorAccessor)));
|
|
211
211
|
}
|
|
212
|
-
|
|
213
212
|
//#endregion
|
|
214
213
|
//#region src/hooks/use-keymap.ts
|
|
215
214
|
function useKeymap(keymap, options) {
|
|
216
215
|
useExtension(computed(() => defineKeymap(toValue(keymap))), options);
|
|
217
216
|
}
|
|
218
|
-
|
|
219
217
|
//#endregion
|
|
220
218
|
//#region src/hooks/use-state-update.ts
|
|
221
219
|
/**
|
|
@@ -226,7 +224,7 @@ function useKeymap(keymap, options) {
|
|
|
226
224
|
function useStateUpdate(handler, options) {
|
|
227
225
|
useExtension(defineUpdateHandler((view) => handler(view.state)), options);
|
|
228
226
|
}
|
|
229
|
-
|
|
230
227
|
//#endregion
|
|
231
228
|
export { ProseKit, defineVueMarkView, defineVueNodeView, useDocChange, useEditor, useEditorDerivedValue, useExtension, useKeymap, useStateUpdate };
|
|
229
|
+
|
|
232
230
|
//# sourceMappingURL=prosekit-vue.js.map
|
package/dist/prosekit-vue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prosekit-vue.js","names":[],"sources":["../src/hooks/use-editor-extension.ts","../src/hooks/use-priority-extension.ts","../src/hooks/use-extension.ts","../src/extensions/vue-mark-view.ts","../src/extensions/vue-node-view.ts","../src/components/prosekit.ts","../src/hooks/use-doc-change.ts","../src/hooks/use-editor.ts","../src/hooks/use-editor-derived-value.ts","../src/hooks/use-keymap.ts","../src/hooks/use-state-update.ts"],"sourcesContent":["import { EditorNotFoundError, type Editor, type Extension } from '@prosekit/core'\nimport { toValue, watchPostEffect, type MaybeRefOrGetter } from 'vue'\n\nimport { useEditorContext } from '../injection/editor-context'\n\n/**\n * @internal\n */\nexport function useEditorExtension(\n editorRef: MaybeRefOrGetter<Editor> | null | undefined,\n extensionRef: MaybeRefOrGetter<Extension | null> | null,\n): void {\n const editorContext = useEditorContext()\n\n watchPostEffect((onCleanup) => {\n const editor = toValue(editorRef) || toValue(editorContext)\n const extension = toValue(extensionRef)\n\n if (!editor) {\n throw new EditorNotFoundError()\n }\n if (extension) {\n onCleanup(editor.use(extension))\n }\n })\n}\n","import { withPriority, type Extension, type Priority } from '@prosekit/core'\nimport { computed, toValue, type ComputedRef, type MaybeRefOrGetter } from 'vue'\n\n/**\n * @internal\n */\nexport function usePriorityExtension<T extends Extension = Extension>(\n extension: MaybeRefOrGetter<T | null>,\n priority: Priority | null | undefined,\n): ComputedRef<T | null> {\n return computed(() => {\n const ext = toValue(extension)\n return ext && priority ? withPriority(ext, priority) : ext\n })\n}\n","import type { Editor, Extension, Priority } from '@prosekit/core'\nimport type { MaybeRefOrGetter } from 'vue'\n\nimport { useEditorExtension } from './use-editor-extension'\nimport { usePriorityExtension } from './use-priority-extension'\n\nexport interface UseExtensionOptions {\n /**\n * The editor to add the extension to. If not provided, it will use the\n * editor from the nearest `<ProseKit>` component.\n */\n editor?: MaybeRefOrGetter<Editor>\n\n /**\n * Optional priority to add the extension with.\n */\n priority?: Priority\n}\n\n/**\n * Add an extension to the editor.\n *\n * @public\n */\nexport function useExtension(\n /**\n * The ref to an extension to add to the editor. If it changes, the previous\n * extension will be removed and the new one (if not null) will be added.\n */\n extension: MaybeRefOrGetter<Extension | null>,\n options?: UseExtensionOptions,\n): void {\n useEditorExtension(\n options?.editor,\n usePriorityExtension(extension, options?.priority),\n )\n}\n","import { defineMarkViewComponent, defineMarkViewFactory, type Extension } from '@prosekit/core'\nimport type { MarkViewConstructor } from '@prosekit/pm/view'\nimport type { CoreMarkViewUserOptions } from '@prosemirror-adapter/core'\nimport {\n useMarkViewContext,\n useMarkViewFactory,\n type MarkViewContext,\n type MarkViewFactory,\n type VueMarkViewUserOptions,\n} from '@prosemirror-adapter/vue'\nimport { computed, defineComponent, h, type DefineComponent } from 'vue'\n\nimport { useExtension } from '../hooks/use-extension'\n\n/**\n * @public\n */\nexport interface VueMarkViewProps extends MarkViewContext {}\n\n/**\n * @public\n */\nexport type VueMarkViewComponent = DefineComponent<VueMarkViewProps, any, any>\n\n/**\n * Options for {@link defineVueMarkView}.\n *\n * @public\n */\nexport interface VueMarkViewOptions extends CoreMarkViewUserOptions<VueMarkViewComponent> {\n /**\n * The name of the mark type.\n */\n name: string\n}\n\nfunction withMarkViewProps(component: VueMarkViewComponent) {\n return defineComponent({\n name: 'MarkViewPropsWrapper',\n setup: () => {\n const props: Readonly<VueMarkViewProps> = useMarkViewContext()\n return () => h(component, props)\n },\n })\n}\n\n/**\n * @internal\n */\nexport const VueMarkViewsConsumer: DefineComponent = /* @__PURE__ */ defineComponent({\n name: 'VueMarkViewsConsumer',\n setup: () => {\n const markViewFactory: MarkViewFactory = useMarkViewFactory()\n const extension = computed(() => {\n return defineVueMarkViewFactory(markViewFactory)\n })\n useExtension(extension)\n return (): null => null\n },\n})\n\n/**\n * Defines a mark view using a Vue component.\n *\n * @public\n */\nexport function defineVueMarkView(options: VueMarkViewOptions): Extension {\n const { name, component, ...userOptions } = options\n\n const args: VueMarkViewUserOptions = {\n ...userOptions,\n component: withMarkViewProps(component),\n }\n\n return defineMarkViewComponent<VueMarkViewUserOptions>({\n group: 'vue',\n name,\n args,\n })\n}\n\nfunction defineVueMarkViewFactory(\n factory: (options: VueMarkViewUserOptions) => MarkViewConstructor,\n) {\n return defineMarkViewFactory<VueMarkViewUserOptions>({\n group: 'vue',\n factory,\n })\n}\n","import { defineNodeViewComponent, defineNodeViewFactory, type Extension } from '@prosekit/core'\nimport type { NodeViewConstructor } from '@prosekit/pm/view'\nimport type { CoreNodeViewUserOptions } from '@prosemirror-adapter/core'\nimport {\n useNodeViewContext,\n useNodeViewFactory,\n type NodeViewContext,\n type NodeViewFactory,\n type VueNodeViewUserOptions,\n} from '@prosemirror-adapter/vue'\nimport { computed, defineComponent, h, type DefineComponent } from 'vue'\n\nimport { useExtension } from '../hooks/use-extension'\n\n/**\n * @public\n */\nexport interface VueNodeViewProps extends NodeViewContext {}\n\n/**\n * @public\n */\nexport type VueNodeViewComponent = DefineComponent<VueNodeViewProps, any, any>\n\n/**\n * Options for {@link defineVueNodeView}.\n *\n * @public\n */\nexport interface VueNodeViewOptions extends CoreNodeViewUserOptions<VueNodeViewComponent> {\n /**\n * The name of the node type.\n */\n name: string\n}\n\nfunction withNodeViewProps(component: VueNodeViewComponent) {\n return defineComponent({\n name: 'NodeViewPropsWrapper',\n setup: () => {\n const props: Readonly<VueNodeViewProps> = useNodeViewContext()\n return () => h(component, props)\n },\n })\n}\n\n/**\n * @internal\n */\nexport const VueNodeViewsConsumer: DefineComponent = /* @__PURE__ */ defineComponent({\n name: 'VueNodeViewsConsumer',\n setup: () => {\n const nodeViewFactory: NodeViewFactory = useNodeViewFactory()\n const extension = computed(() => {\n return defineVueNodeViewFactory(nodeViewFactory)\n })\n useExtension(extension)\n return (): null => null\n },\n})\n\n/**\n * Defines a node view using a Vue component.\n *\n * @public\n */\nexport function defineVueNodeView(options: VueNodeViewOptions): Extension {\n const { name, component, ...userOptions } = options\n\n const args: VueNodeViewUserOptions = {\n ...userOptions,\n component: withNodeViewProps(component),\n }\n\n return defineNodeViewComponent<VueNodeViewUserOptions>({\n group: 'vue',\n name,\n args,\n })\n}\n\nfunction defineVueNodeViewFactory(\n factory: (options: VueNodeViewUserOptions) => NodeViewConstructor,\n) {\n return defineNodeViewFactory<VueNodeViewUserOptions>({\n group: 'vue',\n factory,\n })\n}\n","import type { Editor } from '@prosekit/core'\nimport { ProsemirrorAdapterProvider } from '@prosemirror-adapter/vue'\nimport { defineComponent, h, type DefineSetupFnComponent, type PropType } from 'vue'\n\nimport { VueMarkViewsConsumer } from '../extensions/vue-mark-view'\nimport { VueNodeViewsConsumer } from '../extensions/vue-node-view'\nimport { provideEditor } from '../injection/editor-context'\n\nexport interface ProseKitProps {\n editor: Editor\n}\n\n/**\n * The root component for a ProseKit editor.\n *\n * @public\n */\nexport const ProseKit: DefineSetupFnComponent<ProseKitProps> = defineComponent<ProseKitProps>({\n name: 'ProseKit',\n props: { editor: { type: Object as PropType<Editor>, required: true } },\n setup: (props, { slots }) => {\n provideEditor(props.editor)\n return () => {\n return h(ProsemirrorAdapterProvider, null, () => [\n h(VueNodeViewsConsumer),\n h(VueMarkViewsConsumer),\n slots.default?.(),\n ])\n }\n },\n})\n","import { defineDocChangeHandler } from '@prosekit/core'\nimport type { ProseMirrorNode } from '@prosekit/pm/model'\n\nimport { useExtension, type UseExtensionOptions } from './use-extension'\n\n/**\n * Calls the given handler whenever the editor document changes.\n *\n * @public\n */\nexport function useDocChange(\n handler: (doc: ProseMirrorNode) => void,\n options?: UseExtensionOptions,\n): void {\n const extension = defineDocChangeHandler((view) => handler(view.state.doc))\n useExtension(extension, options)\n}\n","import { defineMountHandler, defineUpdateHandler, ProseKitError, union, type Editor, type Extension } from '@prosekit/core'\nimport { onMounted, onUnmounted, shallowRef, triggerRef, type ShallowRef } from 'vue'\n\nimport { useEditorContext } from '../injection/editor-context'\n\n/**\n * Retrieves the editor instance from the nearest ProseKit component.\n *\n * @public\n */\nexport function useEditor<E extends Extension = any>(options?: {\n /**\n * Whether to update the component when the editor is mounted or editor state\n * is updated.\n *\n * @default false\n */\n update?: boolean\n}): ShallowRef<Editor<E>> {\n const update = options?.update ?? false\n\n const editor = useEditorContext<E>()\n if (!editor) {\n throw new ProseKitError(\n 'useEditor must be used within the ProseKit component',\n )\n }\n\n const editorRef = shallowRef<Editor<E>>(editor)\n\n if (update) {\n onMounted(() => {\n const forceUpdate = () => triggerRef(editorRef)\n const extension = union(\n defineMountHandler(forceUpdate),\n defineUpdateHandler(forceUpdate),\n )\n const dispose = editor.use(extension)\n onUnmounted(dispose)\n })\n }\n\n return editorRef\n}\n","import type { Editor, Extension } from '@prosekit/core'\nimport { computed, toValue, type MaybeRefOrGetter, type Ref, type ShallowRef } from 'vue'\n\nimport { useEditor } from './use-editor'\n\nexport interface UseEditorDerivedOptions<E extends Extension = any> {\n /**\n * The editor to add the extension to. If not provided, it will use the\n * editor from the nearest `<ProseKit>` component.\n */\n editor?: MaybeRefOrGetter<Editor<E>>\n}\n\n/**\n * Runs a function to derive a value from the editor instance after editor state\n * changes.\n *\n * This is useful when you need to render something based on the editor state,\n * for example, whether the selected text is wrapped in an italic mark.\n *\n * It returns a shallow ref of the derived value that updates whenever the editor\n * state changes.\n *\n * @public\n */\nexport function useEditorDerivedValue<E extends Extension, Derived>(\n /**\n * A function that receives the editor instance and returns a derived value.\n *\n * It will be called whenever the editor's document state changes, or when it\n * mounts.\n */\n derive: (editor: Editor<E>) => Derived,\n options?: UseEditorDerivedOptions<E>,\n): ShallowRef<Derived> {\n const initialEditor = options?.editor\n const editorAccessor: Ref<Editor<E>> = initialEditor\n ? computed(() => toValue(initialEditor))\n : useEditor<E>({ update: true })\n\n return computed(() => derive(toValue(editorAccessor)))\n}\n","import { defineKeymap, type Keymap } from '@prosekit/core'\nimport { computed, toValue, type MaybeRefOrGetter } from 'vue'\n\nimport { useExtension, type UseExtensionOptions } from './use-extension'\n\nexport function useKeymap(\n keymap: MaybeRefOrGetter<Keymap>,\n options?: UseExtensionOptions,\n): void {\n const extension = computed(() => defineKeymap(toValue(keymap)))\n useExtension(extension, options)\n}\n","import { defineUpdateHandler } from '@prosekit/core'\nimport type { EditorState } from '@prosekit/pm/state'\n\nimport { useExtension, type UseExtensionOptions } from './use-extension'\n\n/**\n * Calls the given handler whenever the editor state changes.\n *\n * @public\n */\nexport function useStateUpdate(\n handler: (state: EditorState) => void,\n options?: UseExtensionOptions,\n): void {\n const extension = defineUpdateHandler((view) => handler(view.state))\n useExtension(extension, options)\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"prosekit-vue.js","names":[],"sources":["../src/extensions/vue-mark-view.ts","../src/extensions/vue-node-view.ts","../src/hooks/use-editor-extension.ts","../src/components/view-renderer.ts","../src/components/prosekit.ts","../src/hooks/use-priority-extension.ts","../src/hooks/use-extension.ts","../src/hooks/use-doc-change.ts","../src/hooks/use-editor.ts","../src/hooks/use-editor-derived-value.ts","../src/hooks/use-keymap.ts","../src/hooks/use-state-update.ts"],"sourcesContent":["import { defineMarkViewComponent, defineMarkViewFactory, type Extension } from '@prosekit/core'\nimport type { CoreMarkViewUserOptions } from '@prosemirror-adapter/core'\nimport {\n AbstractVueMarkView,\n buildVueMarkViewCreator,\n type MarkViewContext,\n type VueRendererComponent,\n type VueRendererResult,\n} from '@prosemirror-adapter/vue'\nimport { defineComponent, h, markRaw, Teleport, type DefineComponent } from 'vue'\n\n/**\n * @public\n */\nexport interface VueMarkViewProps extends MarkViewContext {}\n\n/**\n * @public\n */\nexport type VueMarkViewComponent = DefineComponent<VueMarkViewProps, any, any>\n\n/**\n * Options for {@link defineVueMarkView}.\n *\n * @public\n */\nexport interface VueMarkViewOptions extends CoreMarkViewUserOptions<VueMarkViewComponent> {\n /**\n * The name of the mark type.\n */\n name: string\n}\n\nclass ProseKitVueMarkView extends AbstractVueMarkView<VueMarkViewComponent> {\n render = (): VueRendererComponent => {\n const UserComponent = this.component\n const render = () => {\n const props = this.context\n return h(Teleport, { key: this.key, to: this.dom }, [h(UserComponent, props)])\n }\n const RendererComponent: VueRendererComponent = defineComponent({\n name: 'ProsemirrorMarkView',\n setup: () => {\n return render\n },\n })\n return markRaw(RendererComponent)\n }\n}\n\n/**\n * @internal\n */\nexport function defineVueMarkViewFactory(\n renderVueRenderer: VueRendererResult['renderVueRenderer'],\n removeVueRenderer: VueRendererResult['removeVueRenderer'],\n): Extension {\n const factory = buildVueMarkViewCreator(renderVueRenderer, removeVueRenderer, ProseKitVueMarkView)\n return defineMarkViewFactory<VueMarkViewOptions>({\n group: 'vue',\n factory,\n })\n}\n\n/**\n * Defines a mark view using a Vue component.\n *\n * @public\n */\nexport function defineVueMarkView(options: VueMarkViewOptions): Extension {\n return defineMarkViewComponent<VueMarkViewOptions>({\n group: 'vue',\n name: options.name,\n args: options,\n })\n}\n","import { defineNodeViewComponent, defineNodeViewFactory, type Extension } from '@prosekit/core'\nimport type { CoreNodeViewUserOptions } from '@prosemirror-adapter/core'\nimport {\n AbstractVueNodeView,\n buildVueNodeViewCreator,\n type NodeViewContext,\n type VueRendererComponent,\n type VueRendererResult,\n} from '@prosemirror-adapter/vue'\nimport { defineComponent, h, markRaw, Teleport, type DefineComponent } from 'vue'\n\n/**\n * @public\n */\nexport interface VueNodeViewProps extends NodeViewContext {}\n\n/**\n * @public\n */\nexport type VueNodeViewComponent = DefineComponent<VueNodeViewProps, any, any>\n\n/**\n * Options for {@link defineVueNodeView}.\n *\n * @public\n */\nexport interface VueNodeViewOptions extends CoreNodeViewUserOptions<VueNodeViewComponent> {\n /**\n * The name of the node type.\n */\n name: string\n}\n\nclass ProseKitVueNodeView extends AbstractVueNodeView<VueNodeViewComponent> {\n render = (): VueRendererComponent => {\n const UserComponent = this.component\n const render = () => {\n const props = this.context\n return h(Teleport, { key: this.key, to: this.dom }, [h(UserComponent, props)])\n }\n const RendererComponent: VueRendererComponent = defineComponent({\n name: 'ProsemirrorNodeView',\n setup: () => {\n return render\n },\n })\n return markRaw(RendererComponent)\n }\n}\n\n/**\n * @internal\n */\nexport function defineVueNodeViewFactory(\n renderVueRenderer: VueRendererResult['renderVueRenderer'],\n removeVueRenderer: VueRendererResult['removeVueRenderer'],\n): Extension {\n const factory = buildVueNodeViewCreator(renderVueRenderer, removeVueRenderer, ProseKitVueNodeView)\n return defineNodeViewFactory<VueNodeViewOptions>({\n group: 'vue',\n factory,\n })\n}\n\n/**\n * Defines a node view using a Vue component.\n *\n * @public\n */\nexport function defineVueNodeView(options: VueNodeViewOptions): Extension {\n return defineNodeViewComponent<VueNodeViewOptions>({\n group: 'vue',\n name: options.name,\n args: options,\n })\n}\n","import { EditorNotFoundError, type Editor, type Extension } from '@prosekit/core'\nimport { toValue, watchPostEffect, type MaybeRefOrGetter } from 'vue'\n\nimport { useEditorContext } from '../injection/editor-context.ts'\n\n/**\n * @internal\n */\nexport function useEditorExtension(\n editorRef: MaybeRefOrGetter<Editor> | null | undefined,\n extensionRef: MaybeRefOrGetter<Extension | null> | null,\n): void {\n const editorContext = useEditorContext()\n\n watchPostEffect((onCleanup) => {\n const editor = toValue(editorRef) || toValue(editorContext)\n const extension = toValue(extensionRef)\n\n if (!editor) {\n throw new EditorNotFoundError()\n }\n if (extension) {\n onCleanup(editor.use(extension))\n }\n })\n}\n","import { union, type Editor } from '@prosekit/core'\nimport { useVueRenderer } from '@prosemirror-adapter/vue'\nimport { defineComponent, type DefineSetupFnComponent, type PropType } from 'vue'\n\nimport { defineVueMarkViewFactory } from '../extensions/vue-mark-view.ts'\nimport { defineVueNodeViewFactory } from '../extensions/vue-node-view.ts'\nimport { useEditorExtension } from '../hooks/use-editor-extension.ts'\n\n/**\n * @internal\n */\ninterface ViewRendererProps {\n editor: Editor\n}\n\n/**\n * @internal\n */\nexport const ViewRenderer: DefineSetupFnComponent<ViewRendererProps> = defineComponent<ViewRendererProps>({\n name: 'ViewRenderer',\n props: { editor: { type: Object as PropType<Editor>, required: true } },\n setup: (props, { slots }) => {\n const { renderVueRenderer, removeVueRenderer, render } = useVueRenderer()\n\n const extension = union([\n defineVueMarkViewFactory(renderVueRenderer, removeVueRenderer),\n defineVueNodeViewFactory(renderVueRenderer, removeVueRenderer),\n ])\n\n useEditorExtension(() => props.editor, extension)\n\n return () => [slots.default?.(), render()]\n },\n})\n","import type { Editor } from '@prosekit/core'\nimport { defineComponent, h, type DefineSetupFnComponent, type PropType } from 'vue'\n\nimport { provideEditor } from '../injection/editor-context.ts'\n\nimport { ViewRenderer } from './view-renderer.ts'\n\nexport interface ProseKitProps {\n editor: Editor\n}\n\n/**\n * The root component for a ProseKit editor.\n *\n * @public\n */\nexport const ProseKit: DefineSetupFnComponent<ProseKitProps> = defineComponent<ProseKitProps>({\n name: 'ProseKit',\n props: { editor: { type: Object as PropType<Editor>, required: true } },\n setup: (props, { slots }) => {\n provideEditor(props.editor)\n return () =>\n h(\n ViewRenderer,\n { editor: props.editor },\n () => slots.default?.(),\n )\n },\n})\n","import { withPriority, type Extension, type Priority } from '@prosekit/core'\nimport { computed, toValue, type ComputedRef, type MaybeRefOrGetter } from 'vue'\n\n/**\n * @internal\n */\nexport function usePriorityExtension<T extends Extension = Extension>(\n extension: MaybeRefOrGetter<T | null>,\n priority: Priority | null | undefined,\n): ComputedRef<T | null> {\n return computed(() => {\n const ext = toValue(extension)\n return ext && priority ? withPriority(ext, priority) : ext\n })\n}\n","import type { Editor, Extension, Priority } from '@prosekit/core'\nimport type { MaybeRefOrGetter } from 'vue'\n\nimport { useEditorExtension } from './use-editor-extension.ts'\nimport { usePriorityExtension } from './use-priority-extension.ts'\n\nexport interface UseExtensionOptions {\n /**\n * The editor to add the extension to. If not provided, it will use the\n * editor from the nearest `<ProseKit>` component.\n */\n editor?: MaybeRefOrGetter<Editor>\n\n /**\n * Optional priority to add the extension with.\n */\n priority?: Priority\n}\n\n/**\n * Add an extension to the editor.\n *\n * @public\n */\nexport function useExtension(\n /**\n * The ref to an extension to add to the editor. If it changes, the previous\n * extension will be removed and the new one (if not null) will be added.\n */\n extension: MaybeRefOrGetter<Extension | null>,\n options?: UseExtensionOptions,\n): void {\n useEditorExtension(\n options?.editor,\n usePriorityExtension(extension, options?.priority),\n )\n}\n","import { defineDocChangeHandler } from '@prosekit/core'\nimport type { ProseMirrorNode } from '@prosekit/pm/model'\n\nimport { useExtension, type UseExtensionOptions } from './use-extension.ts'\n\n/**\n * Calls the given handler whenever the editor document changes.\n *\n * @public\n */\nexport function useDocChange(\n handler: (doc: ProseMirrorNode) => void,\n options?: UseExtensionOptions,\n): void {\n const extension = defineDocChangeHandler((view) => handler(view.state.doc))\n useExtension(extension, options)\n}\n","import { defineMountHandler, defineUpdateHandler, ProseKitError, union, type Editor, type Extension } from '@prosekit/core'\nimport { onMounted, onUnmounted, shallowRef, triggerRef, type ShallowRef } from 'vue'\n\nimport { useEditorContext } from '../injection/editor-context.ts'\n\n/**\n * Retrieves the editor instance from the nearest ProseKit component.\n *\n * @public\n */\nexport function useEditor<E extends Extension = any>(options?: {\n /**\n * Whether to update the component when the editor is mounted or editor state\n * is updated.\n *\n * @default false\n */\n update?: boolean\n}): ShallowRef<Editor<E>> {\n const update = options?.update ?? false\n\n const editor = useEditorContext<E>()\n if (!editor) {\n throw new ProseKitError(\n 'useEditor must be used within the ProseKit component',\n )\n }\n\n const editorRef = shallowRef<Editor<E>>(editor)\n\n if (update) {\n const forceUpdate = () => triggerRef(editorRef)\n onMounted(() => {\n const extension = union(\n defineMountHandler(forceUpdate),\n defineUpdateHandler(forceUpdate),\n )\n const dispose = editor.use(extension)\n onUnmounted(dispose)\n })\n }\n\n return editorRef\n}\n","import type { Editor, Extension } from '@prosekit/core'\nimport { computed, toValue, type MaybeRefOrGetter, type Ref, type ShallowRef } from 'vue'\n\nimport { useEditor } from './use-editor.ts'\n\nexport interface UseEditorDerivedOptions<E extends Extension = any> {\n /**\n * The editor to add the extension to. If not provided, it will use the\n * editor from the nearest `<ProseKit>` component.\n */\n editor?: MaybeRefOrGetter<Editor<E>>\n}\n\n/**\n * Runs a function to derive a value from the editor instance after editor state\n * changes.\n *\n * This is useful when you need to render something based on the editor state,\n * for example, whether the selected text is wrapped in an italic mark.\n *\n * It returns a shallow ref of the derived value that updates whenever the editor\n * state changes.\n *\n * @public\n */\nexport function useEditorDerivedValue<E extends Extension, Derived>(\n /**\n * A function that receives the editor instance and returns a derived value.\n *\n * It will be called whenever the editor's document state changes, or when it\n * mounts.\n */\n derive: (editor: Editor<E>) => Derived,\n options?: UseEditorDerivedOptions<E>,\n): ShallowRef<Derived> {\n const initialEditor = options?.editor\n const editorAccessor: Ref<Editor<E>> = initialEditor\n ? computed(() => toValue(initialEditor))\n : useEditor<E>({ update: true })\n\n return computed(() => derive(toValue(editorAccessor)))\n}\n","import { defineKeymap, type Keymap } from '@prosekit/core'\nimport { computed, toValue, type MaybeRefOrGetter } from 'vue'\n\nimport { useExtension, type UseExtensionOptions } from './use-extension.ts'\n\nexport function useKeymap(\n keymap: MaybeRefOrGetter<Keymap>,\n options?: UseExtensionOptions,\n): void {\n const extension = computed(() => defineKeymap(toValue(keymap)))\n useExtension(extension, options)\n}\n","import { defineUpdateHandler } from '@prosekit/core'\nimport type { EditorState } from '@prosekit/pm/state'\n\nimport { useExtension, type UseExtensionOptions } from './use-extension.ts'\n\n/**\n * Calls the given handler whenever the editor state changes.\n *\n * @public\n */\nexport function useStateUpdate(\n handler: (state: EditorState) => void,\n options?: UseExtensionOptions,\n): void {\n const extension = defineUpdateHandler((view) => handler(view.state))\n useExtension(extension, options)\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@prosekit/vue",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.6.
|
|
4
|
+
"version": "0.6.8",
|
|
5
5
|
"private": false,
|
|
6
6
|
"description": "Vue components and utilities for ProseKit",
|
|
7
7
|
"author": {
|
|
@@ -68,11 +68,11 @@
|
|
|
68
68
|
"src"
|
|
69
69
|
],
|
|
70
70
|
"dependencies": {
|
|
71
|
-
"@prosemirror-adapter/core": "^0.
|
|
72
|
-
"@prosemirror-adapter/vue": "^0.
|
|
73
|
-
"@prosekit/
|
|
71
|
+
"@prosemirror-adapter/core": "^0.5.2",
|
|
72
|
+
"@prosemirror-adapter/vue": "^0.5.2",
|
|
73
|
+
"@prosekit/web": "^0.7.13",
|
|
74
74
|
"@prosekit/pm": "^0.1.15",
|
|
75
|
-
"@prosekit/
|
|
75
|
+
"@prosekit/core": "^0.11.0"
|
|
76
76
|
},
|
|
77
77
|
"peerDependencies": {
|
|
78
78
|
"vue": ">= 3.0.0"
|
|
@@ -83,12 +83,13 @@
|
|
|
83
83
|
}
|
|
84
84
|
},
|
|
85
85
|
"devDependencies": {
|
|
86
|
-
"@vitejs/plugin-vue": "^6.0.
|
|
86
|
+
"@vitejs/plugin-vue": "^6.0.5",
|
|
87
87
|
"@vue/test-utils": "^2.4.6",
|
|
88
|
-
"tsdown": "^0.
|
|
88
|
+
"tsdown": "^0.21.4",
|
|
89
89
|
"typescript": "~5.9.3",
|
|
90
|
-
"vitest": "^4.
|
|
91
|
-
"vue": "^3.5.
|
|
90
|
+
"vitest": "^4.1.1",
|
|
91
|
+
"vue": "^3.5.30",
|
|
92
|
+
"@prosekit/config-ts": "0.0.0",
|
|
92
93
|
"@prosekit/config-vitest": "0.0.0",
|
|
93
94
|
"@prosekit/config-tsdown": "0.0.0"
|
|
94
95
|
},
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/autocomplete'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link AutocompleteEmpty} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/autocomplete'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link AutocompleteItem} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/autocomplete'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link AutocompleteList} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/autocomplete'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link AutocompletePopover} component.
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { AutocompleteEmpty, type AutocompleteEmptyProps, type AutocompleteEmptyEmits } from './autocomplete-empty.gen'
|
|
1
|
+
export { AutocompleteEmpty, type AutocompleteEmptyProps, type AutocompleteEmptyEmits } from './autocomplete-empty.gen.ts'
|
|
2
2
|
|
|
3
|
-
export { AutocompleteItem, type AutocompleteItemProps, type AutocompleteItemEmits } from './autocomplete-item.gen'
|
|
3
|
+
export { AutocompleteItem, type AutocompleteItemProps, type AutocompleteItemEmits } from './autocomplete-item.gen.ts'
|
|
4
4
|
|
|
5
|
-
export { AutocompleteList, type AutocompleteListProps, type AutocompleteListEmits } from './autocomplete-list.gen'
|
|
5
|
+
export { AutocompleteList, type AutocompleteListProps, type AutocompleteListEmits } from './autocomplete-list.gen.ts'
|
|
6
6
|
|
|
7
|
-
export { AutocompletePopover, type AutocompletePopoverProps, type AutocompletePopoverEmits } from './autocomplete-popover.gen'
|
|
7
|
+
export { AutocompletePopover, type AutocompletePopoverProps, type AutocompletePopoverEmits } from './autocomplete-popover.gen.ts'
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/block-handle'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link BlockHandleAdd} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/block-handle'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link BlockHandleDraggable} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/block-handle'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link BlockHandlePopover} component.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { BlockHandleAdd, type BlockHandleAddProps, type BlockHandleAddEmits } from './block-handle-add.gen'
|
|
1
|
+
export { BlockHandleAdd, type BlockHandleAddProps, type BlockHandleAddEmits } from './block-handle-add.gen.ts'
|
|
2
2
|
|
|
3
|
-
export { BlockHandleDraggable, type BlockHandleDraggableProps, type BlockHandleDraggableEmits } from './block-handle-draggable.gen'
|
|
3
|
+
export { BlockHandleDraggable, type BlockHandleDraggableProps, type BlockHandleDraggableEmits } from './block-handle-draggable.gen.ts'
|
|
4
4
|
|
|
5
|
-
export { BlockHandlePopover, type BlockHandlePopoverProps, type BlockHandlePopoverEmits } from './block-handle-popover.gen'
|
|
5
|
+
export { BlockHandlePopover, type BlockHandlePopoverProps, type BlockHandlePopoverEmits } from './block-handle-popover.gen.ts'
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent, h, onMounted, ref, watchEffect, type DefineSetupFnComponent, type EmitsOptions, type HTMLAttributes } from 'vue'
|
|
2
2
|
|
|
3
|
-
import { useEditorContext } from '../injection/editor-context'
|
|
3
|
+
import { useEditorContext } from '../injection/editor-context.ts'
|
|
4
4
|
|
|
5
5
|
export function createComponent<
|
|
6
6
|
Props extends { [PropName in keyof Props]: unknown },
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/drop-indicator'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link DropIndicator} component.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { DropIndicator, type DropIndicatorProps, type DropIndicatorEmits } from './drop-indicator.gen'
|
|
1
|
+
export { DropIndicator, type DropIndicatorProps, type DropIndicatorEmits } from './drop-indicator.gen.ts'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { InlinePopover, type InlinePopoverProps, type InlinePopoverEmits } from './inline-popover.gen'
|
|
1
|
+
export { InlinePopover, type InlinePopoverProps, type InlinePopoverEmits } from './inline-popover.gen.ts'
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/inline-popover'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link InlinePopover} component.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { PopoverContent, type PopoverContentProps, type PopoverContentEmits } from './popover-content.gen'
|
|
1
|
+
export { PopoverContent, type PopoverContentProps, type PopoverContentEmits } from './popover-content.gen.ts'
|
|
2
2
|
|
|
3
|
-
export { PopoverRoot, type PopoverRootProps, type PopoverRootEmits } from './popover-root.gen'
|
|
3
|
+
export { PopoverRoot, type PopoverRootProps, type PopoverRootEmits } from './popover-root.gen.ts'
|
|
4
4
|
|
|
5
|
-
export { PopoverTrigger, type PopoverTriggerProps, type PopoverTriggerEmits } from './popover-trigger.gen'
|
|
5
|
+
export { PopoverTrigger, type PopoverTriggerProps, type PopoverTriggerEmits } from './popover-trigger.gen.ts'
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/popover'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link PopoverContent} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/popover'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link PopoverRoot} component.
|
|
@@ -6,8 +6,8 @@ import {
|
|
|
6
6
|
} from '@prosekit/web/popover'
|
|
7
7
|
import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
|
|
8
8
|
|
|
9
|
-
import { createComponent } from '../create-component'
|
|
10
|
-
import type { CreateEmits } from '../create-emits'
|
|
9
|
+
import { createComponent } from '../create-component.ts'
|
|
10
|
+
import type { CreateEmits } from '../create-emits.ts'
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* Props for the {@link PopoverTrigger} component.
|