@kungal/editor-vue 0.11.0 → 0.13.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/CHANGELOG.md +39 -0
- package/dist/components/KunEditor.vue.d.ts +26 -1
- package/dist/components/KunEditor.vue.d.ts.map +1 -1
- package/dist/components/ToolbarHost.vue.d.ts +30 -0
- package/dist/components/ToolbarHost.vue.d.ts.map +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +276 -239
- package/dist/types.d.ts +26 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,44 @@
|
|
|
1
1
|
# @kungal/editor-vue
|
|
2
2
|
|
|
3
|
+
## 0.13.0
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- @kungal/editor-core@0.13.0
|
|
8
|
+
|
|
9
|
+
## 0.12.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- 5786594: Add a `#toolbar` slot and a KunUI toolbar — the toolbar is now a swappable layer.
|
|
14
|
+
|
|
15
|
+
`<KunEditor>` exposes a `#toolbar` scoped slot whose props are the command API
|
|
16
|
+
(`KunEditorToolbarApi`: `run(cmdKey, payload)` / `insertText` / `insertQuote` /
|
|
17
|
+
`insertMention` / `focus` / `adapters` / `features` / `locale`). The API is
|
|
18
|
+
computed inside the Milkdown providers and handed down, so a custom toolbar can
|
|
19
|
+
live in the consumer's tree without `useInstance`/`inject`. The hand-rolled
|
|
20
|
+
default toolbar is the slot's fallback — omit the slot and nothing changes.
|
|
21
|
+
|
|
22
|
+
`@kungal/editor-nuxt` ships `<KunEditorToolbar>` (auto-imported): the same
|
|
23
|
+
toolbar built with **KunButton / KunIcon / KunTooltip / KunPopover** (real tooltip
|
|
24
|
+
delay, popover focus/collision, a11y):
|
|
25
|
+
|
|
26
|
+
```vue
|
|
27
|
+
<KunEditor v-model="md" :adapters="adapters">
|
|
28
|
+
<template #toolbar="api"><KunEditorToolbar v-bind="api" /></template>
|
|
29
|
+
</KunEditor>
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
This keeps `@kungal/editor-vue` **headless / zero UI-kit dependency** (any Vue app
|
|
33
|
+
can use it with the default toolbar) while the KunUI ecosystem (forum, moyu) gets
|
|
34
|
+
native chrome — the "headless core + optional UI layer" pattern (TipTap UI,
|
|
35
|
+
BlockNote's swappable toolbar). Also exports `EMOJI` from `@kungal/editor-vue` for
|
|
36
|
+
building custom pickers.
|
|
37
|
+
|
|
38
|
+
### Patch Changes
|
|
39
|
+
|
|
40
|
+
- @kungal/editor-core@0.12.0
|
|
41
|
+
|
|
3
42
|
## 0.11.0
|
|
4
43
|
|
|
5
44
|
### Patch Changes
|
|
@@ -12,7 +12,26 @@ type __VLS_Props = {
|
|
|
12
12
|
/** Read-only render (no editing). */
|
|
13
13
|
readonly?: boolean;
|
|
14
14
|
};
|
|
15
|
-
declare
|
|
15
|
+
declare var __VLS_20: {
|
|
16
|
+
run: <T>(key: import("@milkdown/kit/core").CmdKey<T>, payload?: T) => void;
|
|
17
|
+
insertText: (text: string) => void;
|
|
18
|
+
insertQuote: (payload: {
|
|
19
|
+
refId: string;
|
|
20
|
+
label: string;
|
|
21
|
+
}) => void;
|
|
22
|
+
insertMention: (payload: {
|
|
23
|
+
userId: number;
|
|
24
|
+
name: string;
|
|
25
|
+
}) => void;
|
|
26
|
+
focus: () => void;
|
|
27
|
+
adapters: KunEditorAdapters;
|
|
28
|
+
features: KunEditorFeatures;
|
|
29
|
+
locale: KunEditorLocale;
|
|
30
|
+
};
|
|
31
|
+
type __VLS_Slots = {} & {
|
|
32
|
+
toolbar?: (props: typeof __VLS_20) => any;
|
|
33
|
+
};
|
|
34
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, KunEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
16
35
|
"update:modelValue": (markdown: string) => any;
|
|
17
36
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
18
37
|
"onUpdate:modelValue"?: ((markdown: string) => any) | undefined;
|
|
@@ -22,6 +41,12 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, KunEditor
|
|
|
22
41
|
locale: KunEditorLocale;
|
|
23
42
|
readonly: boolean;
|
|
24
43
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
44
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
25
45
|
declare const _default: typeof __VLS_export;
|
|
26
46
|
export default _default;
|
|
47
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
48
|
+
new (): {
|
|
49
|
+
$slots: S;
|
|
50
|
+
};
|
|
51
|
+
};
|
|
27
52
|
//# sourceMappingURL=KunEditor.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KunEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/KunEditor.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"KunEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/KunEditor.vue"],"names":[],"mappings":"AA2KA,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAM5B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/C,KAAK,WAAW,GAAG;IACf,gCAAgC;IAChC,UAAU,EAAE,MAAM,CAAA;IAClB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,qDAAqD;IACrD,MAAM,CAAC,EAAE,eAAe,CAAA;IACxB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAC;AAsOJ,QAAA,IAAI,QAAQ;iEAhQZ,CA9JwB;;;;;;;;;;;;;;CA8ZqB,CAAE;AAC/C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAOhD,QAAA,MAAM,UAAU;;;;;cAtPD,iBAAiB;cAEjB,iBAAiB;YAEnB,eAAe;cAEb,OAAO;6EAqPpB,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { CmdKey } from '@milkdown/kit/core';
|
|
2
|
+
declare var __VLS_1: {
|
|
3
|
+
run: <T>(key: CmdKey<T>, payload?: T) => void;
|
|
4
|
+
insertText: (text: string) => void;
|
|
5
|
+
insertQuote: (payload: {
|
|
6
|
+
refId: string;
|
|
7
|
+
label: string;
|
|
8
|
+
}) => void;
|
|
9
|
+
insertMention: (payload: {
|
|
10
|
+
userId: number;
|
|
11
|
+
name: string;
|
|
12
|
+
}) => void;
|
|
13
|
+
focus: () => void;
|
|
14
|
+
adapters: import("@kungal/editor-core").KunEditorAdapters;
|
|
15
|
+
features: import("@kungal/editor-core").KunEditorFeatures;
|
|
16
|
+
locale: import("@kungal/editor-core").KunEditorLocale;
|
|
17
|
+
};
|
|
18
|
+
type __VLS_Slots = {} & {
|
|
19
|
+
default?: (props: typeof __VLS_1) => any;
|
|
20
|
+
};
|
|
21
|
+
declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
22
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
23
|
+
declare const _default: typeof __VLS_export;
|
|
24
|
+
export default _default;
|
|
25
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
26
|
+
new (): {
|
|
27
|
+
$slots: S;
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=ToolbarHost.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToolbarHost.vue.d.ts","sourceRoot":"","sources":["../../src/components/ToolbarHost.vue"],"names":[],"mappings":"AAyEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAuEhD,QAAA,IAAI,OAAO;oCAxEX,CA9De;;;;;;;;;;;;;;CAsIO,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAG/C,QAAA,MAAM,UAAU,+QACd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -2,6 +2,8 @@ import type { Plugin } from 'vue';
|
|
|
2
2
|
import KunEditor from './components/KunEditor.vue';
|
|
3
3
|
export { KunEditor };
|
|
4
4
|
export type { KunEditorExpose } from './types';
|
|
5
|
+
export type { KunEditorToolbarApi } from './types';
|
|
6
|
+
export { EMOJI } from './emoji';
|
|
5
7
|
export type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale, UploadImage, SearchMentionUsers, StickerSource, Notify, NotifyLevel, MentionUser, StickerItem, StickerPack } from '@kungal/editor-core';
|
|
6
8
|
/** Vue plugin: `app.use(KunEditorPlugin)` to register <KunEditor> globally. */
|
|
7
9
|
export declare const KunEditorPlugin: Plugin;
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAO,MAAM,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,SAAS,MAAM,4BAA4B,CAAA;AAElD,OAAO,EAAE,SAAS,EAAE,CAAA;AAGpB,YAAY,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAG9C,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,aAAa,EACb,MAAM,EACN,WAAW,EACX,WAAW,EACX,WAAW,EACX,WAAW,EACZ,MAAM,qBAAqB,CAAA;AAE5B,+EAA+E;AAC/E,eAAO,MAAM,eAAe,EAAE,MAI7B,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAO,MAAM,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,SAAS,MAAM,4BAA4B,CAAA;AAElD,OAAO,EAAE,SAAS,EAAE,CAAA;AAGpB,YAAY,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAG9C,YAAY,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAGlD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAG/B,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,aAAa,EACb,MAAM,EACN,WAAW,EACX,WAAW,EACX,WAAW,EACX,WAAW,EACZ,MAAM,qBAAqB,CAAA;AAE5B,+EAA+E;AAC/E,eAAO,MAAM,eAAe,EAAE,MAI7B,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -1,39 +1,39 @@
|
|
|
1
|
-
import { Fragment as e, computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s,
|
|
2
|
-
import { Milkdown as
|
|
3
|
-
import { ProsemirrorAdapterProvider as
|
|
4
|
-
import { Editor as
|
|
5
|
-
import { listenerCtx as
|
|
6
|
-
import { SlashProvider as
|
|
7
|
-
import { callCommand as
|
|
8
|
-
import { createKunEditorPlugins as
|
|
1
|
+
import { Fragment as e, computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, guardReactiveProps as c, inject as l, normalizeProps as u, onBeforeUnmount as d, onMounted as f, openBlock as p, provide as m, ref as h, renderList as g, renderSlot as _, toDisplayString as v, unref as y, vShow as b, watch as x, withCtx as S, withDirectives as C, withModifiers as w } from "vue";
|
|
2
|
+
import { Milkdown as T, MilkdownProvider as E, useEditor as D, useInstance as O } from "@milkdown/vue";
|
|
3
|
+
import { ProsemirrorAdapterProvider as k, usePluginViewContext as A, usePluginViewFactory as j } from "@prosemirror-adapter/vue";
|
|
4
|
+
import { Editor as M, defaultValueCtx as N, editorViewCtx as P, editorViewOptionsCtx as F, rootCtx as I } from "@milkdown/kit/core";
|
|
5
|
+
import { listenerCtx as L } from "@milkdown/kit/plugin/listener";
|
|
6
|
+
import { SlashProvider as ee, slashFactory as te } from "@milkdown/kit/plugin/slash";
|
|
7
|
+
import { callCommand as R, replaceAll as z } from "@milkdown/kit/utils";
|
|
8
|
+
import { createKunEditorPlugins as ne, insertKunSpoilerCommand as re, insertMentionCommand as B, insertQuoteCommand as V, kunCM as ie, mentionId as ae, toggleLatexCommand as oe } from "@kungal/editor-core/preset";
|
|
9
9
|
import { TextSelection as se } from "@milkdown/kit/prose/state";
|
|
10
|
-
import { createCodeBlockCommand as ce, insertHrCommand as
|
|
11
|
-
import { toggleStrikethroughCommand as
|
|
12
|
-
import { EditorState as
|
|
13
|
-
import { EditorView as
|
|
14
|
-
import { markdown as
|
|
15
|
-
import { basicSetup as
|
|
10
|
+
import { createCodeBlockCommand as ce, insertHrCommand as le, insertImageCommand as H, toggleEmphasisCommand as U, toggleInlineCodeCommand as W, toggleStrongCommand as ue, wrapInBlockquoteCommand as de, wrapInBulletListCommand as fe, wrapInHeadingCommand as G, wrapInOrderedListCommand as pe } from "@milkdown/kit/preset/commonmark";
|
|
11
|
+
import { toggleStrikethroughCommand as me } from "@milkdown/kit/preset/gfm";
|
|
12
|
+
import { EditorState as he } from "@codemirror/state";
|
|
13
|
+
import { EditorView as K } from "@codemirror/view";
|
|
14
|
+
import { markdown as ge } from "@codemirror/lang-markdown";
|
|
15
|
+
import { basicSetup as _e } from "codemirror";
|
|
16
16
|
//#region src/context.ts
|
|
17
|
-
var
|
|
17
|
+
var q = Symbol("kun-editor-context"), ve = [
|
|
18
18
|
"data-active",
|
|
19
19
|
"onMousedown",
|
|
20
20
|
"onMouseenter"
|
|
21
|
-
],
|
|
21
|
+
], ye = ["src", "alt"], be = {
|
|
22
22
|
key: 1,
|
|
23
23
|
class: "kun-mention-dropdown__avatar kun-mention-dropdown__avatar--fallback"
|
|
24
|
-
},
|
|
24
|
+
}, xe = { class: "kun-mention-dropdown__name" }, Se = {
|
|
25
25
|
key: 1,
|
|
26
26
|
class: "kun-mention-dropdown__hint"
|
|
27
|
-
},
|
|
27
|
+
}, Ce = {
|
|
28
28
|
key: 2,
|
|
29
29
|
class: "kun-mention-dropdown__hint"
|
|
30
|
-
},
|
|
30
|
+
}, we = {
|
|
31
31
|
key: 3,
|
|
32
32
|
class: "kun-mention-dropdown__hint"
|
|
33
|
-
},
|
|
33
|
+
}, Te = /* @__PURE__ */ s({
|
|
34
34
|
__name: "MentionDropdown",
|
|
35
35
|
setup(n) {
|
|
36
|
-
let r = /(?:^|\s)@([^\s@]{0,30})$/, o =
|
|
36
|
+
let r = /(?:^|\s)@([^\s@]{0,30})$/, o = l(q), s = o?.adapters.searchMentionUsers, c = t(() => (o?.locale ?? "zh-cn").toLowerCase().startsWith("en")), u = t(() => c.value ? {
|
|
37
37
|
searching: "Searching…",
|
|
38
38
|
empty: "No matching users",
|
|
39
39
|
prompt: "Type a username to search"
|
|
@@ -41,48 +41,48 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
41
41
|
searching: "搜索中…",
|
|
42
42
|
empty: "无匹配用户",
|
|
43
43
|
prompt: "输入用户名以搜索"
|
|
44
|
-
}), { view:
|
|
45
|
-
j &&= (clearTimeout(j), null),
|
|
44
|
+
}), { view: m, prevState: _ } = A(), y = h(null), b, S = h(!1), C = h(""), T = h([]), E = h(0), D = h(!1), O = null, k = 0, j = null, M = () => {
|
|
45
|
+
j &&= (clearTimeout(j), null), C.value = "", T.value = [], E.value = 0, D.value = !1, O = null;
|
|
46
46
|
}, N = (e) => {
|
|
47
47
|
if (j &&= (clearTimeout(j), null), !e || !s) {
|
|
48
|
-
T.value = [],
|
|
48
|
+
T.value = [], D.value = !1;
|
|
49
49
|
return;
|
|
50
50
|
}
|
|
51
|
-
|
|
52
|
-
let t = ++
|
|
51
|
+
D.value = !0, j = setTimeout(async () => {
|
|
52
|
+
let t = ++k, n = [];
|
|
53
53
|
try {
|
|
54
54
|
n = await s(e);
|
|
55
55
|
} catch {
|
|
56
56
|
n = [];
|
|
57
57
|
}
|
|
58
|
-
t ===
|
|
58
|
+
t === k && (T.value = n ?? [], E.value = 0, D.value = !1);
|
|
59
59
|
}, 180);
|
|
60
60
|
}, P = (e) => {
|
|
61
61
|
let { selection: t } = e.state;
|
|
62
62
|
if (!t.empty) return null;
|
|
63
63
|
let { $from: n } = t, i = n.parent.textBetween(Math.max(0, n.parentOffset - 100), n.parentOffset, void 0, "").match(r);
|
|
64
64
|
return i ? i[1] ?? "" : null;
|
|
65
|
-
},
|
|
65
|
+
}, F = (e) => {
|
|
66
66
|
let t = P(e);
|
|
67
67
|
if (t === null) return !1;
|
|
68
68
|
let n = e.state.selection.$from.pos;
|
|
69
|
-
return
|
|
69
|
+
return O = {
|
|
70
70
|
from: n - (t.length + 1),
|
|
71
71
|
to: n
|
|
72
|
-
}, t !==
|
|
73
|
-
},
|
|
74
|
-
let t =
|
|
75
|
-
if (!t || !
|
|
72
|
+
}, t !== C.value && (C.value = t, N(t)), !0;
|
|
73
|
+
}, I = (e) => {
|
|
74
|
+
let t = m.value;
|
|
75
|
+
if (!t || !O) return;
|
|
76
76
|
let n = t.state.schema.nodes[ae];
|
|
77
77
|
if (!n) return;
|
|
78
78
|
let r = n.create({
|
|
79
79
|
userId: e.id,
|
|
80
80
|
name: e.name
|
|
81
|
-
}), { from: i, to: a } =
|
|
82
|
-
o.insertText(" ", s), o.setSelection(se.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(),
|
|
83
|
-
},
|
|
84
|
-
if (!
|
|
85
|
-
|
|
81
|
+
}), { from: i, to: a } = O, o = t.state.tr.replaceWith(i, a, r), s = i + r.nodeSize;
|
|
82
|
+
o.insertText(" ", s), o.setSelection(se.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(), b.hide();
|
|
83
|
+
}, L = (e) => {
|
|
84
|
+
if (!S.value || !T.value.length) {
|
|
85
|
+
S.value && e.key === "Escape" && (e.preventDefault(), b.hide());
|
|
86
86
|
return;
|
|
87
87
|
}
|
|
88
88
|
let t = T.value.length - 1;
|
|
@@ -96,49 +96,49 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
96
96
|
case "Enter":
|
|
97
97
|
case "Tab": {
|
|
98
98
|
let t = T.value[E.value];
|
|
99
|
-
t && (e.preventDefault(), e.stopPropagation(),
|
|
99
|
+
t && (e.preventDefault(), e.stopPropagation(), I(t));
|
|
100
100
|
break;
|
|
101
101
|
}
|
|
102
102
|
case "Escape":
|
|
103
|
-
e.preventDefault(), e.stopPropagation(),
|
|
103
|
+
e.preventDefault(), e.stopPropagation(), b.hide();
|
|
104
104
|
break;
|
|
105
105
|
}
|
|
106
106
|
};
|
|
107
|
-
return
|
|
108
|
-
|
|
109
|
-
content:
|
|
107
|
+
return f(() => {
|
|
108
|
+
b = new ee({
|
|
109
|
+
content: y.value,
|
|
110
110
|
trigger: "@",
|
|
111
|
-
shouldShow:
|
|
111
|
+
shouldShow: F,
|
|
112
112
|
debounce: 0
|
|
113
|
-
}),
|
|
114
|
-
|
|
115
|
-
},
|
|
116
|
-
|
|
117
|
-
},
|
|
118
|
-
}),
|
|
119
|
-
|
|
120
|
-
}),
|
|
121
|
-
j && clearTimeout(j), window.removeEventListener("keydown",
|
|
122
|
-
}), (t, n) => (
|
|
113
|
+
}), b.onShow = () => {
|
|
114
|
+
S.value = !0;
|
|
115
|
+
}, b.onHide = () => {
|
|
116
|
+
S.value = !1, M();
|
|
117
|
+
}, b.update(m.value, _.value), window.addEventListener("keydown", L, !0);
|
|
118
|
+
}), x([m, _], () => {
|
|
119
|
+
b?.update(m.value, _.value);
|
|
120
|
+
}), d(() => {
|
|
121
|
+
j && clearTimeout(j), window.removeEventListener("keydown", L, !0), b?.destroy();
|
|
122
|
+
}), (t, n) => (p(), i("div", {
|
|
123
123
|
ref_key: "divRef",
|
|
124
|
-
ref:
|
|
124
|
+
ref: y,
|
|
125
125
|
class: "kun-mention-dropdown",
|
|
126
126
|
"data-show": "false"
|
|
127
|
-
}, [T.value.length ? (
|
|
127
|
+
}, [T.value.length ? (p(!0), i(e, { key: 0 }, g(T.value, (e, t) => (p(), i("button", {
|
|
128
128
|
key: e.id,
|
|
129
129
|
type: "button",
|
|
130
130
|
class: "kun-mention-dropdown__item",
|
|
131
131
|
"data-active": t === E.value,
|
|
132
|
-
onMousedown:
|
|
132
|
+
onMousedown: w((t) => I(e), ["prevent"]),
|
|
133
133
|
onMouseenter: (e) => E.value = t
|
|
134
|
-
}, [e.avatar ? (
|
|
134
|
+
}, [e.avatar ? (p(), i("img", {
|
|
135
135
|
key: 0,
|
|
136
136
|
src: e.avatar,
|
|
137
137
|
alt: e.name,
|
|
138
138
|
class: "kun-mention-dropdown__avatar"
|
|
139
|
-
}, null, 8,
|
|
139
|
+
}, null, 8, ye)) : (p(), i("span", be, v(e.name.charAt(0)), 1)), a("span", xe, v(e.name), 1)], 40, ve))), 128)) : D.value ? (p(), i("div", Se, v(u.value.searching), 1)) : C.value ? (p(), i("div", Ce, v(u.value.empty), 1)) : (p(), i("div", we, v(u.value.prompt), 1))], 512));
|
|
140
140
|
}
|
|
141
|
-
}),
|
|
141
|
+
}), Ee = /* @__PURE__ */ s({
|
|
142
142
|
__name: "MilkdownEditor",
|
|
143
143
|
props: {
|
|
144
144
|
modelValue: {},
|
|
@@ -149,68 +149,68 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
149
149
|
},
|
|
150
150
|
emits: ["update:modelValue"],
|
|
151
151
|
setup(e, { expose: t, emit: r }) {
|
|
152
|
-
let i = e, a = r, o = i.modelValue, s =
|
|
153
|
-
let t =
|
|
154
|
-
t.set(
|
|
152
|
+
let i = e, a = r, o = i.modelValue, s = j(), c = te("kunMention"), l = i.features.mention !== !1 && !!i.adapters.searchMentionUsers && !!s, u = D((e) => {
|
|
153
|
+
let t = M.make().config((t) => {
|
|
154
|
+
t.set(I, e), t.set(N, i.modelValue), t.get(L).markdownUpdated((e, t, n) => {
|
|
155
155
|
t !== n && (o = t, a("update:modelValue", t));
|
|
156
|
-
}), t.update(
|
|
156
|
+
}), t.update(F, (e) => ({
|
|
157
157
|
...e,
|
|
158
158
|
editable: () => !i.readonly
|
|
159
|
-
})), l && t.set(c.key, { view: s({ component:
|
|
160
|
-
}).use(
|
|
159
|
+
})), l && t.set(c.key, { view: s({ component: Te }) });
|
|
160
|
+
}).use(ne(i.adapters, i.features, { locale: i.locale }));
|
|
161
161
|
return l && t.use(c), t;
|
|
162
162
|
});
|
|
163
|
-
|
|
164
|
-
e !== o && (o = e, u.get()?.action(
|
|
163
|
+
x(() => i.modelValue, (e) => {
|
|
164
|
+
e !== o && (o = e, u.get()?.action(z(e)));
|
|
165
165
|
});
|
|
166
|
-
let
|
|
167
|
-
u.get()?.action((e) => e.get(
|
|
166
|
+
let d = () => {
|
|
167
|
+
u.get()?.action((e) => e.get(P).focus());
|
|
168
168
|
};
|
|
169
169
|
return t({
|
|
170
170
|
insertQuote: (e) => {
|
|
171
|
-
u.get()?.action(
|
|
171
|
+
u.get()?.action(R(V.key, e)), d();
|
|
172
172
|
},
|
|
173
173
|
insertMention: (e) => {
|
|
174
|
-
u.get()?.action(
|
|
174
|
+
u.get()?.action(R(B.key, e)), d();
|
|
175
175
|
},
|
|
176
|
-
focus:
|
|
177
|
-
}), (e, t) => (
|
|
176
|
+
focus: d
|
|
177
|
+
}), (e, t) => (p(), n(y(T)));
|
|
178
178
|
}
|
|
179
|
-
}),
|
|
180
|
-
bold:
|
|
181
|
-
italic:
|
|
182
|
-
strike:
|
|
183
|
-
code:
|
|
184
|
-
h1:
|
|
185
|
-
h2:
|
|
186
|
-
h3:
|
|
187
|
-
bulletList:
|
|
188
|
-
orderedList:
|
|
189
|
-
quote:
|
|
190
|
-
codeBlock:
|
|
191
|
-
hr:
|
|
192
|
-
image:
|
|
193
|
-
spoiler:
|
|
194
|
-
latex:
|
|
195
|
-
smile:
|
|
196
|
-
},
|
|
179
|
+
}), J = (e) => `<svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${e}</svg>`, Y = (e, t = 13) => `<svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true"><text x="12" y="12" dominant-baseline="central" text-anchor="middle" font-size="${t}" font-weight="700" font-family="ui-sans-serif, system-ui, sans-serif" fill="currentColor">${e}</text></svg>`, X = {
|
|
180
|
+
bold: J("<path d=\"M6 4h8a4 4 0 0 1 0 8H6z\"/><path d=\"M6 12h9a4 4 0 0 1 0 8H6z\"/>"),
|
|
181
|
+
italic: J("<line x1=\"19\" y1=\"4\" x2=\"10\" y2=\"4\"/><line x1=\"14\" y1=\"20\" x2=\"5\" y2=\"20\"/><line x1=\"15\" y1=\"4\" x2=\"9\" y2=\"20\"/>"),
|
|
182
|
+
strike: J("<path d=\"M16 4H9a3 3 0 0 0-2.83 4\"/><path d=\"M14 12a4 4 0 0 1 0 8H6\"/><line x1=\"4\" y1=\"12\" x2=\"20\" y2=\"12\"/>"),
|
|
183
|
+
code: J("<path d=\"m18 16 4-4-4-4\"/><path d=\"m6 8-4 4 4 4\"/><path d=\"m14.5 4-5 16\"/>"),
|
|
184
|
+
h1: Y("H1", 11),
|
|
185
|
+
h2: Y("H2", 11),
|
|
186
|
+
h3: Y("H3", 11),
|
|
187
|
+
bulletList: J("<line x1=\"8\" y1=\"6\" x2=\"21\" y2=\"6\"/><line x1=\"8\" y1=\"12\" x2=\"21\" y2=\"12\"/><line x1=\"8\" y1=\"18\" x2=\"21\" y2=\"18\"/><circle cx=\"3.5\" cy=\"6\" r=\"1.2\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"3.5\" cy=\"12\" r=\"1.2\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"3.5\" cy=\"18\" r=\"1.2\" fill=\"currentColor\" stroke=\"none\"/>"),
|
|
188
|
+
orderedList: J("<line x1=\"10\" y1=\"6\" x2=\"21\" y2=\"6\"/><line x1=\"10\" y1=\"12\" x2=\"21\" y2=\"12\"/><line x1=\"10\" y1=\"18\" x2=\"21\" y2=\"18\"/><path d=\"M4 6h1v4\"/><path d=\"M4 10h2\"/><path d=\"M6 18H4c0-1 2-1.5 2-2.5S5 14 4 14.5\"/>"),
|
|
189
|
+
quote: J("<path d=\"M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z\" fill=\"currentColor\" stroke=\"none\"/>"),
|
|
190
|
+
codeBlock: J("<rect x=\"3\" y=\"4\" width=\"18\" height=\"16\" rx=\"2\"/><path d=\"m9 10-2 2 2 2\"/><path d=\"m15 10 2 2-2 2\"/>"),
|
|
191
|
+
hr: J("<line x1=\"4\" y1=\"12\" x2=\"20\" y2=\"12\"/>"),
|
|
192
|
+
image: J("<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/><circle cx=\"9\" cy=\"9\" r=\"1.8\" fill=\"currentColor\" stroke=\"none\"/><path d=\"m21 15-4.5-4.5a2 2 0 0 0-2.8 0L5 19\"/>"),
|
|
193
|
+
spoiler: J("<path d=\"M9.9 4.24A9.1 9.1 0 0 1 12 4c7 0 10 8 10 8a13.2 13.2 0 0 1-1.67 2.68\"/><path d=\"M6.6 6.6A13.5 13.5 0 0 0 2 12s3 8 10 8a9.7 9.7 0 0 0 5.4-1.6\"/><line x1=\"2\" y1=\"2\" x2=\"22\" y2=\"22\"/>"),
|
|
194
|
+
latex: Y("Σ", 15),
|
|
195
|
+
smile: J("<circle cx=\"12\" cy=\"12\" r=\"9\"/><path d=\"M8 14s1.5 2 4 2 4-2 4-2\"/><line x1=\"9\" y1=\"9\" x2=\"9.01\" y2=\"9\"/><line x1=\"15\" y1=\"9\" x2=\"15.01\" y2=\"9\"/>")
|
|
196
|
+
}, Z = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), De = [
|
|
197
197
|
"title",
|
|
198
198
|
"aria-label",
|
|
199
199
|
"aria-expanded"
|
|
200
|
-
],
|
|
200
|
+
], Oe = ["innerHTML"], ke = { class: "kun-editor__picker-panel" }, Ae = {
|
|
201
201
|
key: 0,
|
|
202
202
|
class: "kun-editor__picker-tabs",
|
|
203
203
|
role: "tablist"
|
|
204
|
-
},
|
|
204
|
+
}, je = ["data-active"], Me = ["data-active"], Ne = { class: "kun-editor__emoji-grid" }, Pe = ["onClick"], Fe = {
|
|
205
205
|
key: 1,
|
|
206
206
|
class: "kun-editor__sticker-body"
|
|
207
|
-
},
|
|
207
|
+
}, Ie = { class: "kun-editor__pack-name" }, Le = { class: "kun-editor__sticker-grid" }, Re = ["title", "onClick"], ze = ["src", "alt"], Be = {
|
|
208
208
|
key: 1,
|
|
209
209
|
class: "kun-editor__picker-hint"
|
|
210
|
-
},
|
|
210
|
+
}, Ve = /* @__PURE__ */ s({
|
|
211
211
|
__name: "StickerPicker",
|
|
212
212
|
setup(n) {
|
|
213
|
-
let [, o] =
|
|
213
|
+
let [, o] = O(), s = l(q), c = s?.adapters.stickerSource, u = !!c, m = t(() => (s?.locale ?? "zh-cn").toLowerCase().startsWith("en")), _ = t(() => m.value ? {
|
|
214
214
|
trigger: "Emoji & stickers",
|
|
215
215
|
emoji: "Emoji",
|
|
216
216
|
sticker: "Stickers",
|
|
@@ -222,99 +222,99 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
222
222
|
sticker: "贴纸",
|
|
223
223
|
empty: "暂无贴纸",
|
|
224
224
|
failed: "贴纸加载失败"
|
|
225
|
-
}),
|
|
226
|
-
if (!(
|
|
227
|
-
|
|
225
|
+
}), x = h(!1), S = h(null), w = h("emoji"), T = h([]), E = h(!1), D = h(!1), k = async () => {
|
|
226
|
+
if (!(E.value || !c)) {
|
|
227
|
+
E.value = !0;
|
|
228
228
|
try {
|
|
229
|
-
|
|
229
|
+
T.value = await c();
|
|
230
230
|
} catch {
|
|
231
|
-
|
|
231
|
+
D.value = !0;
|
|
232
232
|
}
|
|
233
233
|
}
|
|
234
234
|
}, A = () => {
|
|
235
|
-
|
|
236
|
-
},
|
|
237
|
-
|
|
235
|
+
x.value = !x.value, x.value && u && k();
|
|
236
|
+
}, j = (e) => {
|
|
237
|
+
x.value && S.value && !S.value.contains(e.target) && (x.value = !1);
|
|
238
238
|
};
|
|
239
|
-
|
|
240
|
-
let
|
|
239
|
+
f(() => document.addEventListener("click", j)), d(() => document.removeEventListener("click", j));
|
|
240
|
+
let M = (e) => {
|
|
241
241
|
o()?.action((t) => {
|
|
242
|
-
let n = t.get(
|
|
242
|
+
let n = t.get(P), { state: r } = n;
|
|
243
243
|
n.dispatch(r.tr.insertText(e, r.selection.from));
|
|
244
244
|
});
|
|
245
|
-
},
|
|
246
|
-
o()?.action(
|
|
245
|
+
}, N = (e, t) => {
|
|
246
|
+
o()?.action(R(H.key, {
|
|
247
247
|
src: e,
|
|
248
248
|
title: t,
|
|
249
249
|
alt: t
|
|
250
250
|
}));
|
|
251
251
|
};
|
|
252
|
-
return (t, n) => (
|
|
252
|
+
return (t, n) => (p(), i("div", {
|
|
253
253
|
ref_key: "rootRef",
|
|
254
|
-
ref:
|
|
254
|
+
ref: S,
|
|
255
255
|
class: "kun-editor__picker"
|
|
256
256
|
}, [a("button", {
|
|
257
257
|
type: "button",
|
|
258
258
|
class: "kun-editor__tool",
|
|
259
|
-
title:
|
|
260
|
-
"aria-label":
|
|
261
|
-
"aria-expanded":
|
|
259
|
+
title: _.value.trigger,
|
|
260
|
+
"aria-label": _.value.trigger,
|
|
261
|
+
"aria-expanded": x.value,
|
|
262
262
|
onClick: A
|
|
263
263
|
}, [a("span", {
|
|
264
264
|
class: "kun-editor__icon",
|
|
265
|
-
innerHTML:
|
|
266
|
-
}, null, 8,
|
|
267
|
-
|
|
265
|
+
innerHTML: y(X).smile
|
|
266
|
+
}, null, 8, Oe)], 8, De), C(a("div", ke, [
|
|
267
|
+
u ? (p(), i("div", Ae, [a("button", {
|
|
268
268
|
type: "button",
|
|
269
269
|
class: "kun-editor__picker-tab",
|
|
270
270
|
"data-active": w.value === "emoji",
|
|
271
271
|
onClick: n[0] ||= (e) => w.value = "emoji"
|
|
272
|
-
},
|
|
272
|
+
}, v(_.value.emoji), 9, je), a("button", {
|
|
273
273
|
type: "button",
|
|
274
274
|
class: "kun-editor__picker-tab",
|
|
275
275
|
"data-active": w.value === "sticker",
|
|
276
276
|
onClick: n[1] ||= (e) => w.value = "sticker"
|
|
277
|
-
},
|
|
278
|
-
|
|
277
|
+
}, v(_.value.sticker), 9, Me)])) : r("", !0),
|
|
278
|
+
C(a("div", Ne, [(p(!0), i(e, null, g(y(Z), (e, t) => (p(), i("button", {
|
|
279
279
|
key: t,
|
|
280
280
|
type: "button",
|
|
281
281
|
class: "kun-editor__emoji",
|
|
282
|
-
onClick: (t) =>
|
|
283
|
-
},
|
|
284
|
-
|
|
282
|
+
onClick: (t) => M(e)
|
|
283
|
+
}, v(e), 9, Pe))), 128))], 512), [[b, !u || w.value === "emoji"]]),
|
|
284
|
+
u ? C((p(), i("div", Fe, [T.value.length ? (p(!0), i(e, { key: 0 }, g(T.value, (t) => (p(), i("div", {
|
|
285
285
|
key: t.name,
|
|
286
286
|
class: "kun-editor__pack"
|
|
287
|
-
}, [a("div",
|
|
287
|
+
}, [a("div", Ie, v(t.name), 1), a("div", Le, [(p(!0), i(e, null, g(t.stickers, (e, t) => (p(), i("button", {
|
|
288
288
|
key: t,
|
|
289
289
|
type: "button",
|
|
290
290
|
class: "kun-editor__sticker",
|
|
291
291
|
title: e.name,
|
|
292
|
-
onClick: (t) =>
|
|
292
|
+
onClick: (t) => N(e.src, e.name)
|
|
293
293
|
}, [a("img", {
|
|
294
294
|
src: e.src,
|
|
295
295
|
alt: e.name,
|
|
296
296
|
loading: "lazy"
|
|
297
|
-
}, null, 8,
|
|
298
|
-
], 512), [[
|
|
297
|
+
}, null, 8, ze)], 8, Re))), 128))])]))), 128)) : (p(), i("div", Be, v(D.value ? _.value.failed : _.value.empty), 1))], 512)), [[b, w.value === "sticker"]]) : r("", !0)
|
|
298
|
+
], 512), [[b, x.value]])], 512));
|
|
299
299
|
}
|
|
300
|
-
}),
|
|
300
|
+
}), He = {
|
|
301
301
|
class: "kun-editor__format-toolbar",
|
|
302
302
|
role: "toolbar"
|
|
303
|
-
},
|
|
303
|
+
}, Q = {
|
|
304
304
|
key: 0,
|
|
305
305
|
class: "kun-editor__toolbar-divider",
|
|
306
306
|
"aria-hidden": "true"
|
|
307
|
-
},
|
|
307
|
+
}, Ue = [
|
|
308
308
|
"title",
|
|
309
309
|
"aria-label",
|
|
310
310
|
"onClick"
|
|
311
|
-
],
|
|
311
|
+
], We = ["innerHTML"], Ge = ["title", "aria-label"], Ke = ["innerHTML"], qe = /* @__PURE__ */ s({
|
|
312
312
|
__name: "EditorToolbar",
|
|
313
313
|
setup(n) {
|
|
314
|
-
let [, s] =
|
|
315
|
-
s()?.action(
|
|
316
|
-
},
|
|
317
|
-
let e =
|
|
314
|
+
let [, s] = O(), c = l(q), u = t(() => c?.adapters.uploadImage), d = () => c?.adapters.notify, f = t(() => c?.features.sticker !== !1), m = t(() => (c?.locale ?? "zh-cn").toLowerCase().startsWith("en")), _ = (e, t) => {
|
|
315
|
+
s()?.action(R(e, t));
|
|
316
|
+
}, v = t(() => {
|
|
317
|
+
let e = m.value;
|
|
318
318
|
return {
|
|
319
319
|
bold: e ? "Bold" : "加粗",
|
|
320
320
|
italic: e ? "Italic" : "斜体",
|
|
@@ -335,96 +335,96 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
335
335
|
}), b = t(() => [
|
|
336
336
|
[
|
|
337
337
|
{
|
|
338
|
-
svg:
|
|
339
|
-
title:
|
|
340
|
-
run: () =>
|
|
338
|
+
svg: X.bold,
|
|
339
|
+
title: v.value.bold,
|
|
340
|
+
run: () => _(ue.key)
|
|
341
341
|
},
|
|
342
342
|
{
|
|
343
|
-
svg:
|
|
344
|
-
title:
|
|
345
|
-
run: () =>
|
|
343
|
+
svg: X.italic,
|
|
344
|
+
title: v.value.italic,
|
|
345
|
+
run: () => _(U.key)
|
|
346
346
|
},
|
|
347
347
|
{
|
|
348
|
-
svg:
|
|
349
|
-
title:
|
|
350
|
-
run: () =>
|
|
348
|
+
svg: X.strike,
|
|
349
|
+
title: v.value.strike,
|
|
350
|
+
run: () => _(me.key)
|
|
351
351
|
},
|
|
352
352
|
{
|
|
353
|
-
svg:
|
|
354
|
-
title:
|
|
355
|
-
run: () =>
|
|
353
|
+
svg: X.code,
|
|
354
|
+
title: v.value.code,
|
|
355
|
+
run: () => _(W.key)
|
|
356
356
|
}
|
|
357
357
|
],
|
|
358
358
|
[
|
|
359
359
|
{
|
|
360
|
-
svg:
|
|
361
|
-
title:
|
|
362
|
-
run: () =>
|
|
360
|
+
svg: X.h1,
|
|
361
|
+
title: v.value.h1,
|
|
362
|
+
run: () => _(G.key, 1)
|
|
363
363
|
},
|
|
364
364
|
{
|
|
365
|
-
svg:
|
|
366
|
-
title:
|
|
367
|
-
run: () =>
|
|
365
|
+
svg: X.h2,
|
|
366
|
+
title: v.value.h2,
|
|
367
|
+
run: () => _(G.key, 2)
|
|
368
368
|
},
|
|
369
369
|
{
|
|
370
|
-
svg:
|
|
371
|
-
title:
|
|
372
|
-
run: () =>
|
|
370
|
+
svg: X.h3,
|
|
371
|
+
title: v.value.h3,
|
|
372
|
+
run: () => _(G.key, 3)
|
|
373
373
|
}
|
|
374
374
|
],
|
|
375
375
|
[
|
|
376
376
|
{
|
|
377
|
-
svg:
|
|
378
|
-
title:
|
|
379
|
-
run: () =>
|
|
377
|
+
svg: X.bulletList,
|
|
378
|
+
title: v.value.bulletList,
|
|
379
|
+
run: () => _(fe.key)
|
|
380
380
|
},
|
|
381
381
|
{
|
|
382
|
-
svg:
|
|
383
|
-
title:
|
|
384
|
-
run: () =>
|
|
382
|
+
svg: X.orderedList,
|
|
383
|
+
title: v.value.orderedList,
|
|
384
|
+
run: () => _(pe.key)
|
|
385
385
|
},
|
|
386
386
|
{
|
|
387
|
-
svg:
|
|
388
|
-
title:
|
|
389
|
-
run: () =>
|
|
387
|
+
svg: X.quote,
|
|
388
|
+
title: v.value.quote,
|
|
389
|
+
run: () => _(de.key)
|
|
390
390
|
},
|
|
391
391
|
{
|
|
392
|
-
svg:
|
|
393
|
-
title:
|
|
394
|
-
run: () =>
|
|
392
|
+
svg: X.codeBlock,
|
|
393
|
+
title: v.value.codeBlock,
|
|
394
|
+
run: () => _(ce.key, "")
|
|
395
395
|
},
|
|
396
396
|
{
|
|
397
|
-
svg:
|
|
398
|
-
title:
|
|
399
|
-
run: () =>
|
|
397
|
+
svg: X.hr,
|
|
398
|
+
title: v.value.hr,
|
|
399
|
+
run: () => _(le.key)
|
|
400
400
|
}
|
|
401
401
|
],
|
|
402
402
|
[{
|
|
403
|
-
svg:
|
|
404
|
-
title:
|
|
405
|
-
run: () =>
|
|
403
|
+
svg: X.spoiler,
|
|
404
|
+
title: v.value.spoiler,
|
|
405
|
+
run: () => _(re.key)
|
|
406
406
|
}, {
|
|
407
|
-
svg:
|
|
408
|
-
title:
|
|
409
|
-
run: () =>
|
|
407
|
+
svg: X.latex,
|
|
408
|
+
title: v.value.latex,
|
|
409
|
+
run: () => _(oe.key)
|
|
410
410
|
}]
|
|
411
|
-
]), x =
|
|
411
|
+
]), x = h(null), S = () => x.value?.click(), C = async (e) => {
|
|
412
412
|
let t = e.target, n = t.files?.[0];
|
|
413
413
|
t.value = "";
|
|
414
414
|
let r = u.value;
|
|
415
415
|
if (!(!n || !r)) try {
|
|
416
416
|
let e = await r(n);
|
|
417
|
-
|
|
417
|
+
_(H.key, {
|
|
418
418
|
src: e,
|
|
419
419
|
title: n.name,
|
|
420
420
|
alt: n.name
|
|
421
421
|
});
|
|
422
422
|
} catch {
|
|
423
|
-
|
|
423
|
+
d()?.(m.value ? "Image upload failed" : "图片上传失败", "error");
|
|
424
424
|
}
|
|
425
425
|
};
|
|
426
|
-
return (t, n) => (
|
|
427
|
-
(
|
|
426
|
+
return (t, n) => (p(), i("div", He, [
|
|
427
|
+
(p(!0), i(e, null, g(b.value, (t, n) => (p(), i(e, { key: n }, [n > 0 ? (p(), i("span", Q)) : r("", !0), (p(!0), i(e, null, g(t, (e, t) => (p(), i("button", {
|
|
428
428
|
key: t,
|
|
429
429
|
type: "button",
|
|
430
430
|
class: "kun-editor__tool",
|
|
@@ -434,8 +434,8 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
434
434
|
}, [a("span", {
|
|
435
435
|
class: "kun-editor__icon",
|
|
436
436
|
innerHTML: e.svg
|
|
437
|
-
}, null, 8,
|
|
438
|
-
u.value ? (
|
|
437
|
+
}, null, 8, We)], 8, Ue))), 128))], 64))), 128)),
|
|
438
|
+
u.value ? (p(), i(e, { key: 0 }, [
|
|
439
439
|
n[0] ||= a("span", {
|
|
440
440
|
class: "kun-editor__toolbar-divider",
|
|
441
441
|
"aria-hidden": "true"
|
|
@@ -443,13 +443,13 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
443
443
|
a("button", {
|
|
444
444
|
type: "button",
|
|
445
445
|
class: "kun-editor__tool",
|
|
446
|
-
title:
|
|
447
|
-
"aria-label":
|
|
446
|
+
title: v.value.image,
|
|
447
|
+
"aria-label": v.value.image,
|
|
448
448
|
onClick: S
|
|
449
449
|
}, [a("span", {
|
|
450
450
|
class: "kun-editor__icon",
|
|
451
|
-
innerHTML:
|
|
452
|
-
}, null, 8,
|
|
451
|
+
innerHTML: y(X).image
|
|
452
|
+
}, null, 8, Ke)], 8, Ge),
|
|
453
453
|
a("input", {
|
|
454
454
|
ref_key: "fileInput",
|
|
455
455
|
ref: x,
|
|
@@ -459,13 +459,47 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
459
459
|
onChange: C
|
|
460
460
|
}, null, 544)
|
|
461
461
|
], 64)) : r("", !0),
|
|
462
|
-
|
|
462
|
+
f.value ? (p(), i(e, { key: 1 }, [n[1] ||= a("span", {
|
|
463
463
|
class: "kun-editor__toolbar-divider",
|
|
464
464
|
"aria-hidden": "true"
|
|
465
|
-
}, null, -1), o(
|
|
465
|
+
}, null, -1), o(Ve)], 64)) : r("", !0)
|
|
466
466
|
]));
|
|
467
467
|
}
|
|
468
|
-
}),
|
|
468
|
+
}), Je = /* @__PURE__ */ s({
|
|
469
|
+
__name: "ToolbarHost",
|
|
470
|
+
setup(e) {
|
|
471
|
+
let [, t] = O(), n = l(q, void 0), r = (e, n) => {
|
|
472
|
+
t()?.action(R(e, n));
|
|
473
|
+
}, i = () => {
|
|
474
|
+
t()?.action((e) => e.get(P).focus());
|
|
475
|
+
}, a = {
|
|
476
|
+
run: r,
|
|
477
|
+
insertText: (e) => {
|
|
478
|
+
t()?.action((t) => {
|
|
479
|
+
let n = t.get(P);
|
|
480
|
+
n.dispatch(n.state.tr.insertText(e));
|
|
481
|
+
}), i();
|
|
482
|
+
},
|
|
483
|
+
insertQuote: (e) => {
|
|
484
|
+
r(V.key, e), i();
|
|
485
|
+
},
|
|
486
|
+
insertMention: (e) => {
|
|
487
|
+
r(B.key, e), i();
|
|
488
|
+
},
|
|
489
|
+
focus: i,
|
|
490
|
+
get adapters() {
|
|
491
|
+
return n?.adapters ?? {};
|
|
492
|
+
},
|
|
493
|
+
get features() {
|
|
494
|
+
return n?.features ?? {};
|
|
495
|
+
},
|
|
496
|
+
get locale() {
|
|
497
|
+
return n?.locale ?? "zh-cn";
|
|
498
|
+
}
|
|
499
|
+
};
|
|
500
|
+
return (e, t) => _(e.$slots, "default", u(c(a)));
|
|
501
|
+
}
|
|
502
|
+
}), Ye = /* @__PURE__ */ s({
|
|
469
503
|
__name: "MarkdownSource",
|
|
470
504
|
props: {
|
|
471
505
|
modelValue: {},
|
|
@@ -473,41 +507,41 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
473
507
|
},
|
|
474
508
|
emits: ["update:modelValue"],
|
|
475
509
|
setup(e, { emit: t }) {
|
|
476
|
-
let n = e, r = t, a =
|
|
510
|
+
let n = e, r = t, a = h(null), o = null, s = (e) => he.create({
|
|
477
511
|
doc: e,
|
|
478
512
|
extensions: [
|
|
479
513
|
ie(),
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
514
|
+
K.lineWrapping,
|
|
515
|
+
_e,
|
|
516
|
+
ge(),
|
|
517
|
+
K.editable.of(!n.readonly),
|
|
518
|
+
K.updateListener.of((e) => {
|
|
485
519
|
e.docChanged && r("update:modelValue", e.state.doc.toString());
|
|
486
520
|
})
|
|
487
521
|
]
|
|
488
522
|
});
|
|
489
|
-
return
|
|
490
|
-
a.value && (o = new
|
|
523
|
+
return f(() => {
|
|
524
|
+
a.value && (o = new K({
|
|
491
525
|
state: s(n.modelValue),
|
|
492
526
|
parent: a.value
|
|
493
527
|
}));
|
|
494
|
-
}),
|
|
528
|
+
}), d(() => {
|
|
495
529
|
o?.destroy(), o = null;
|
|
496
|
-
}),
|
|
530
|
+
}), x(() => n.modelValue, (e) => {
|
|
497
531
|
o && o.state.doc.toString() !== e && o.setState(s(e));
|
|
498
|
-
}), (e, t) => (
|
|
532
|
+
}), (e, t) => (p(), i("div", {
|
|
499
533
|
ref_key: "host",
|
|
500
534
|
ref: a,
|
|
501
535
|
class: "kun-editor__source"
|
|
502
536
|
}, null, 512));
|
|
503
537
|
}
|
|
504
|
-
}),
|
|
538
|
+
}), Xe = {
|
|
505
539
|
class: "kun-editor",
|
|
506
540
|
"data-kun-editor": ""
|
|
507
|
-
},
|
|
541
|
+
}, Ze = {
|
|
508
542
|
class: "kun-editor__toolbar",
|
|
509
543
|
role: "tablist"
|
|
510
|
-
},
|
|
544
|
+
}, Qe = ["aria-selected", "data-active"], $e = ["aria-selected", "data-active"], et = { class: "kun-editor__wysiwyg" }, $ = /* @__PURE__ */ s({
|
|
511
545
|
__name: "KunEditor",
|
|
512
546
|
props: {
|
|
513
547
|
modelValue: {},
|
|
@@ -520,76 +554,79 @@ var J = Symbol("kun-editor-context"), me = [
|
|
|
520
554
|
}
|
|
521
555
|
},
|
|
522
556
|
emits: ["update:modelValue"],
|
|
523
|
-
setup(e, { expose: s, emit:
|
|
524
|
-
let
|
|
525
|
-
|
|
557
|
+
setup(e, { expose: s, emit: l }) {
|
|
558
|
+
let d = e, f = l;
|
|
559
|
+
m(q, {
|
|
526
560
|
get adapters() {
|
|
527
|
-
return
|
|
561
|
+
return d.adapters;
|
|
528
562
|
},
|
|
529
563
|
get features() {
|
|
530
|
-
return
|
|
564
|
+
return d.features;
|
|
531
565
|
},
|
|
532
566
|
get locale() {
|
|
533
|
-
return
|
|
567
|
+
return d.locale;
|
|
534
568
|
}
|
|
535
569
|
});
|
|
536
|
-
let
|
|
570
|
+
let g = h("wysiwyg"), x = t(() => d.locale.toLowerCase().startsWith("en")), w = t(() => x.value ? {
|
|
537
571
|
wysiwyg: "Preview",
|
|
538
572
|
source: "Markdown"
|
|
539
573
|
} : {
|
|
540
574
|
wysiwyg: "预览",
|
|
541
575
|
source: "Markdown"
|
|
542
|
-
}),
|
|
576
|
+
}), T = (e) => f("update:modelValue", e), D = h(null);
|
|
543
577
|
return s({
|
|
544
|
-
insertQuote: (e) =>
|
|
545
|
-
insertMention: (e) =>
|
|
546
|
-
focus: () =>
|
|
547
|
-
}), (t, s) => (
|
|
548
|
-
a("div",
|
|
578
|
+
insertQuote: (e) => D.value?.insertQuote(e),
|
|
579
|
+
insertMention: (e) => D.value?.insertMention(e),
|
|
580
|
+
focus: () => D.value?.focus()
|
|
581
|
+
}), (t, s) => (p(), i("div", Xe, [
|
|
582
|
+
a("div", Ze, [a("button", {
|
|
549
583
|
type: "button",
|
|
550
584
|
class: "kun-editor__tab",
|
|
551
|
-
"aria-selected":
|
|
552
|
-
"data-active":
|
|
553
|
-
onClick: s[0] ||= (e) =>
|
|
554
|
-
},
|
|
585
|
+
"aria-selected": g.value === "wysiwyg",
|
|
586
|
+
"data-active": g.value === "wysiwyg",
|
|
587
|
+
onClick: s[0] ||= (e) => g.value = "wysiwyg"
|
|
588
|
+
}, v(w.value.wysiwyg), 9, Qe), a("button", {
|
|
555
589
|
type: "button",
|
|
556
590
|
class: "kun-editor__tab",
|
|
557
|
-
"aria-selected":
|
|
558
|
-
"data-active":
|
|
559
|
-
onClick: s[1] ||= (e) =>
|
|
560
|
-
},
|
|
561
|
-
o(
|
|
562
|
-
default:
|
|
563
|
-
default:
|
|
591
|
+
"aria-selected": g.value === "source",
|
|
592
|
+
"data-active": g.value === "source",
|
|
593
|
+
onClick: s[1] ||= (e) => g.value = "source"
|
|
594
|
+
}, v(w.value.source), 9, $e)]),
|
|
595
|
+
o(y(E), null, {
|
|
596
|
+
default: S(() => [o(y(k), null, {
|
|
597
|
+
default: S(() => [C(a("div", null, [o(Je, null, {
|
|
598
|
+
default: S((e) => [_(t.$slots, "toolbar", u(c(e)), () => [o(qe)])]),
|
|
599
|
+
_: 3
|
|
600
|
+
})], 512), [[b, g.value === "wysiwyg" && !e.readonly]]), C(a("div", et, [o(Ee, {
|
|
564
601
|
ref_key: "inner",
|
|
565
|
-
ref:
|
|
602
|
+
ref: D,
|
|
566
603
|
"model-value": e.modelValue,
|
|
567
604
|
adapters: e.adapters,
|
|
568
605
|
features: e.features,
|
|
569
606
|
locale: e.locale,
|
|
570
607
|
readonly: e.readonly,
|
|
571
|
-
"onUpdate:modelValue":
|
|
608
|
+
"onUpdate:modelValue": T
|
|
572
609
|
}, null, 8, [
|
|
573
610
|
"model-value",
|
|
574
611
|
"adapters",
|
|
575
612
|
"features",
|
|
576
613
|
"locale",
|
|
577
614
|
"readonly"
|
|
578
|
-
])], 512), [[
|
|
579
|
-
_:
|
|
615
|
+
])], 512), [[b, g.value === "wysiwyg"]])]),
|
|
616
|
+
_: 3
|
|
580
617
|
})]),
|
|
581
|
-
_:
|
|
618
|
+
_: 3
|
|
582
619
|
}),
|
|
583
|
-
|
|
620
|
+
g.value === "source" ? (p(), n(Ye, {
|
|
584
621
|
key: 0,
|
|
585
622
|
"model-value": e.modelValue,
|
|
586
623
|
readonly: e.readonly,
|
|
587
|
-
"onUpdate:modelValue":
|
|
624
|
+
"onUpdate:modelValue": T
|
|
588
625
|
}, null, 8, ["model-value", "readonly"])) : r("", !0)
|
|
589
626
|
]));
|
|
590
627
|
}
|
|
591
|
-
}),
|
|
628
|
+
}), tt = { install(e) {
|
|
592
629
|
e.component("KunEditor", $);
|
|
593
630
|
} };
|
|
594
631
|
//#endregion
|
|
595
|
-
export { $ as KunEditor,
|
|
632
|
+
export { Z as EMOJI, $ as KunEditor, tt as KunEditorPlugin };
|
package/dist/types.d.ts
CHANGED
|
@@ -1,3 +1,29 @@
|
|
|
1
|
+
import type { CmdKey } from '@milkdown/kit/core';
|
|
2
|
+
import type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale } from '@kungal/editor-core';
|
|
3
|
+
export interface KunEditorToolbarApi {
|
|
4
|
+
/** Run a Milkdown command (import its key from the preset/commonmark/gfm). */
|
|
5
|
+
run: <T>(key: CmdKey<T>, payload?: T) => void;
|
|
6
|
+
/** Insert plain text at the cursor (e.g. an emoji). */
|
|
7
|
+
insertText: (text: string) => void;
|
|
8
|
+
/** Insert a reference atom at the cursor (requires the quote feature). */
|
|
9
|
+
insertQuote: (payload: {
|
|
10
|
+
refId: string;
|
|
11
|
+
label: string;
|
|
12
|
+
}) => void;
|
|
13
|
+
/** Insert an @mention atom at the cursor. */
|
|
14
|
+
insertMention: (payload: {
|
|
15
|
+
userId: number;
|
|
16
|
+
name: string;
|
|
17
|
+
}) => void;
|
|
18
|
+
/** Focus the WYSIWYG editor. */
|
|
19
|
+
focus: () => void;
|
|
20
|
+
/** The host policy bundle (uploadImage / stickerSource / notify / …). */
|
|
21
|
+
readonly adapters: KunEditorAdapters;
|
|
22
|
+
/** Enabled features — so a toolbar can gate its buttons (e.g. the picker). */
|
|
23
|
+
readonly features: KunEditorFeatures;
|
|
24
|
+
/** UI language, for localized labels. */
|
|
25
|
+
readonly locale: KunEditorLocale;
|
|
26
|
+
}
|
|
1
27
|
export interface KunEditorExpose {
|
|
2
28
|
/**
|
|
3
29
|
* Insert a reference atom at the cursor (`[label](kungal-reply:refId)`), then
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAChD,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAM5B,MAAM,WAAW,mBAAmB;IAClC,8EAA8E;IAC9E,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC,KAAK,IAAI,CAAA;IAC7C,uDAAuD;IACvD,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,0EAA0E;IAC1E,WAAW,EAAE,CAAC,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAChE,6CAA6C;IAC7C,aAAa,EAAE,CAAC,OAAO,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAClE,gCAAgC;IAChC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,yEAAyE;IACzE,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,8EAA8E;IAC9E,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,yCAAyC;IACzC,QAAQ,CAAC,MAAM,EAAE,eAAe,CAAA;CACjC;AASD,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,WAAW,CAAC,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;IAC5D;;;OAGG;IACH,aAAa,CAAC,OAAO,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;IAC9D,gCAAgC;IAChC,KAAK,IAAI,IAAI,CAAA;CACd"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kungal/editor-vue",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.0",
|
|
4
4
|
"description": "KunEditor Vue 3 layer — the <KunEditor> component (dual WYSIWYG / markdown-source), toolbar and plugin views. Consumes @kungal/editor-core; pairs with @kungal/ui-vue.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"keywords": [
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
42
|
"@prosemirror-adapter/vue": "^0.4.6",
|
|
43
|
-
"@kungal/editor-core": "0.
|
|
43
|
+
"@kungal/editor-core": "0.13.0"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|
|
46
46
|
"@codemirror/lang-markdown": "^6.0.0",
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
"vite": "^8.0.16",
|
|
81
81
|
"vue": "^3.5.35",
|
|
82
82
|
"vue-tsc": "^3.3.3",
|
|
83
|
-
"@kungal/editor-core": "0.
|
|
83
|
+
"@kungal/editor-core": "0.13.0"
|
|
84
84
|
},
|
|
85
85
|
"scripts": {
|
|
86
86
|
"build": "vite build && vue-tsc -p tsconfig.build.json",
|