@kungal/editor-vue 0.8.0 → 0.10.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 CHANGED
@@ -1,5 +1,40 @@
1
1
  # @kungal/editor-vue
2
2
 
3
+ ## 0.10.0
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [ebe6c61]
8
+ - @kungal/editor-core@0.10.0
9
+
10
+ ## 0.9.0
11
+
12
+ ### Minor Changes
13
+
14
+ - 8b86a68: Add an imperative handle to `<KunEditor>` for cursor-level inserts.
15
+
16
+ A `<KunEditor>` template ref now exposes `KunEditorExpose`:
17
+
18
+ - `insertQuote({ refId, label })` — insert a reference atom
19
+ (`[label](kungal-reply:refId)`) at the caret (requires `features.quote`)
20
+ - `insertMention({ userId, name })` — insert an @mention atom at the caret
21
+ - `focus()` — focus the WYSIWYG editor
22
+
23
+ ```ts
24
+ const editor = ref<InstanceType<typeof KunEditor>>();
25
+ editor.value?.insertMention({ userId: 1, name: "Alice" });
26
+ editor.value?.insertQuote({ refId: "101", label: "#1" });
27
+ ```
28
+
29
+ This is what the forum's per-floor 「引用」 needs — a live, cursor-level insert of
30
+ `@author #floor` (each command inserts with a trailing space), rather than
31
+ editing the markdown string. Works in either view (the WYSIWYG editor stays
32
+ mounted in source mode too). Exported type: `KunEditorExpose`.
33
+
34
+ ### Patch Changes
35
+
36
+ - @kungal/editor-core@0.9.0
37
+
3
38
  ## 0.8.0
4
39
 
5
40
  ### Minor Changes
@@ -1,4 +1,5 @@
1
1
  import type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale } from '@kungal/editor-core';
2
+ import type { KunEditorExpose } from '../types';
2
3
  type __VLS_Props = {
3
4
  /** Bound markdown (v-model). */
4
5
  modelValue: string;
@@ -11,7 +12,7 @@ type __VLS_Props = {
11
12
  /** Read-only render (no editing). */
12
13
  readonly?: boolean;
13
14
  };
14
- declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
15
+ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, KunEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
15
16
  "update:modelValue": (markdown: string) => any;
16
17
  }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
17
18
  "onUpdate:modelValue"?: ((markdown: string) => any) | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"KunEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/KunEditor.vue"],"names":[],"mappings":"AA6JA,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAM5B,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;AAuMJ,QAAA,MAAM,YAAY;;;;;cA9MH,iBAAiB;cAEjB,iBAAiB;YAEnB,eAAe;cAEb,OAAO;6EA4MpB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
1
+ {"version":3,"file":"KunEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/KunEditor.vue"],"names":[],"mappings":"AAkKA,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAK5B,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;AAwNJ,QAAA,MAAM,YAAY;;;;;cA/NH,iBAAiB;cAEjB,iBAAiB;YAEnB,eAAe;cAEb,OAAO;6EA8NpB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
@@ -1,4 +1,5 @@
1
1
  import type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale } from '@kungal/editor-core';
2
+ import type { KunEditorExpose } from '../types';
2
3
  type __VLS_Props = {
3
4
  modelValue: string;
4
5
  adapters: KunEditorAdapters;
@@ -6,7 +7,7 @@ type __VLS_Props = {
6
7
  locale: KunEditorLocale;
7
8
  readonly: boolean;
8
9
  };
9
- declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
10
+ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, KunEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
10
11
  "update:modelValue": (markdown: string) => any;
11
12
  }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
12
13
  "onUpdate:modelValue"?: ((markdown: string) => any) | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"MilkdownEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/MilkdownEditor.vue"],"names":[],"mappings":"AAkIA,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAI5B,KAAK,WAAW,GAAG;IACjB,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,MAAM,EAAE,eAAe,CAAA;IACvB,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAC;AA2GF,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
1
+ {"version":3,"file":"MilkdownEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/MilkdownEditor.vue"],"names":[],"mappings":"AAwKA,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAG5B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/C,KAAK,WAAW,GAAG;IACjB,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,MAAM,EAAE,eAAe,CAAA;IACvB,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAC;AA6HF,QAAA,MAAM,YAAY;;;;kFAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
package/dist/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import type { Plugin } from 'vue';
2
2
  import KunEditor from './components/KunEditor.vue';
3
3
  export { KunEditor };
4
+ export type { KunEditorExpose } from './types';
4
5
  export type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale, UploadImage, SearchMentionUsers, StickerSource, Notify, NotifyLevel, MentionUser, StickerItem, StickerPack } from '@kungal/editor-core';
5
6
  /** Vue plugin: `app.use(KunEditorPlugin)` to register <KunEditor> globally. */
6
7
  export declare const KunEditorPlugin: Plugin;
@@ -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,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,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
@@ -3,34 +3,34 @@ import { Milkdown as S, MilkdownProvider as C, useEditor as w, useInstance as T
3
3
  import { ProsemirrorAdapterProvider as E, usePluginViewContext as D, usePluginViewFactory as O } from "@prosemirror-adapter/vue";
4
4
  import { Editor as k, defaultValueCtx as A, editorViewCtx as j, editorViewOptionsCtx as M, rootCtx as N } from "@milkdown/kit/core";
5
5
  import { listenerCtx as P } from "@milkdown/kit/plugin/listener";
6
- import { SlashProvider as ee, slashFactory as F } from "@milkdown/kit/plugin/slash";
7
- import { callCommand as I, replaceAll as L } from "@milkdown/kit/utils";
8
- import { createKunEditorPlugins as R, insertKunSpoilerCommand as te, kunCM as ne, mentionId as re, toggleLatexCommand as ie } from "@kungal/editor-core/preset";
9
- import { TextSelection as ae } from "@milkdown/kit/prose/state";
10
- import { createCodeBlockCommand as oe, insertHrCommand as se, insertImageCommand as z, toggleEmphasisCommand as B, toggleInlineCodeCommand as V, toggleStrongCommand as H, wrapInBlockquoteCommand as U, wrapInBulletListCommand as W, wrapInHeadingCommand as G, wrapInOrderedListCommand as K } from "@milkdown/kit/preset/commonmark";
11
- import { toggleStrikethroughCommand as ce } from "@milkdown/kit/preset/gfm";
12
- import { EditorState as le } from "@codemirror/state";
6
+ import { SlashProvider as F, slashFactory as I } from "@milkdown/kit/plugin/slash";
7
+ import { callCommand as L, replaceAll as R } from "@milkdown/kit/utils";
8
+ import { createKunEditorPlugins as ee, insertKunSpoilerCommand as te, insertMentionCommand as ne, insertQuoteCommand as re, kunCM as ie, mentionId as ae, toggleLatexCommand as oe } from "@kungal/editor-core/preset";
9
+ import { TextSelection as se } from "@milkdown/kit/prose/state";
10
+ import { createCodeBlockCommand as ce, insertHrCommand as z, insertImageCommand as B, toggleEmphasisCommand as V, toggleInlineCodeCommand as H, toggleStrongCommand as U, wrapInBlockquoteCommand as W, wrapInBulletListCommand as G, wrapInHeadingCommand as K, wrapInOrderedListCommand as le } from "@milkdown/kit/preset/commonmark";
11
+ import { toggleStrikethroughCommand as ue } from "@milkdown/kit/preset/gfm";
12
+ import { EditorState as de } from "@codemirror/state";
13
13
  import { EditorView as q } from "@codemirror/view";
14
- import { markdown as ue } from "@codemirror/lang-markdown";
15
- import { basicSetup as de } from "codemirror";
14
+ import { markdown as fe } from "@codemirror/lang-markdown";
15
+ import { basicSetup as pe } from "codemirror";
16
16
  //#region src/context.ts
17
- var J = Symbol("kun-editor-context"), fe = [
17
+ var J = Symbol("kun-editor-context"), me = [
18
18
  "data-active",
19
19
  "onMousedown",
20
20
  "onMouseenter"
21
- ], pe = ["src", "alt"], me = {
21
+ ], he = ["src", "alt"], ge = {
22
22
  key: 1,
23
23
  class: "kun-mention-dropdown__avatar kun-mention-dropdown__avatar--fallback"
24
- }, he = { class: "kun-mention-dropdown__name" }, ge = {
24
+ }, _e = { class: "kun-mention-dropdown__name" }, ve = {
25
25
  key: 1,
26
26
  class: "kun-mention-dropdown__hint"
27
- }, _e = {
27
+ }, ye = {
28
28
  key: 2,
29
29
  class: "kun-mention-dropdown__hint"
30
- }, ve = {
30
+ }, be = {
31
31
  key: 3,
32
32
  class: "kun-mention-dropdown__hint"
33
- }, ye = /* @__PURE__ */ s({
33
+ }, xe = /* @__PURE__ */ s({
34
34
  __name: "MentionDropdown",
35
35
  setup(n) {
36
36
  let r = /(?:^|\s)@([^\s@]{0,30})$/, o = c(J), s = o?.adapters.searchMentionUsers, f = t(() => (o?.locale ?? "zh-cn").toLowerCase().startsWith("en")), g = t(() => f.value ? {
@@ -62,7 +62,7 @@ var J = Symbol("kun-editor-context"), fe = [
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
- }, F = (e) => {
65
+ }, I = (e) => {
66
66
  let t = P(e);
67
67
  if (t === null) return !1;
68
68
  let n = e.state.selection.$from.pos;
@@ -70,17 +70,17 @@ var J = Symbol("kun-editor-context"), fe = [
70
70
  from: n - (t.length + 1),
71
71
  to: n
72
72
  }, t !== w.value && (w.value = t, N(t)), !0;
73
- }, I = (e) => {
73
+ }, L = (e) => {
74
74
  let t = _.value;
75
75
  if (!t || !k) return;
76
- let n = t.state.schema.nodes[re];
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
81
  }), { from: i, to: a } = k, o = t.state.tr.replaceWith(i, a, r), s = i + r.nodeSize;
82
- o.insertText(" ", s), o.setSelection(ae.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(), S.hide();
83
- }, L = (e) => {
82
+ o.insertText(" ", s), o.setSelection(se.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(), S.hide();
83
+ }, R = (e) => {
84
84
  if (!C.value || !T.value.length) {
85
85
  C.value && e.key === "Escape" && (e.preventDefault(), S.hide());
86
86
  return;
@@ -96,7 +96,7 @@ var J = Symbol("kun-editor-context"), fe = [
96
96
  case "Enter":
97
97
  case "Tab": {
98
98
  let t = T.value[E.value];
99
- t && (e.preventDefault(), e.stopPropagation(), I(t));
99
+ t && (e.preventDefault(), e.stopPropagation(), L(t));
100
100
  break;
101
101
  }
102
102
  case "Escape":
@@ -105,20 +105,20 @@ var J = Symbol("kun-editor-context"), fe = [
105
105
  }
106
106
  };
107
107
  return u(() => {
108
- S = new ee({
108
+ S = new F({
109
109
  content: b.value,
110
110
  trigger: "@",
111
- shouldShow: F,
111
+ shouldShow: I,
112
112
  debounce: 0
113
113
  }), S.onShow = () => {
114
114
  C.value = !0;
115
115
  }, S.onHide = () => {
116
116
  C.value = !1, M();
117
- }, S.update(_.value, y.value), window.addEventListener("keydown", L, !0);
117
+ }, S.update(_.value, y.value), window.addEventListener("keydown", R, !0);
118
118
  }), v([_, y], () => {
119
119
  S?.update(_.value, y.value);
120
120
  }), l(() => {
121
- j && clearTimeout(j), window.removeEventListener("keydown", L, !0), S?.destroy();
121
+ j && clearTimeout(j), window.removeEventListener("keydown", R, !0), S?.destroy();
122
122
  }), (t, n) => (d(), i("div", {
123
123
  ref_key: "divRef",
124
124
  ref: b,
@@ -129,16 +129,16 @@ var J = Symbol("kun-editor-context"), fe = [
129
129
  type: "button",
130
130
  class: "kun-mention-dropdown__item",
131
131
  "data-active": t === E.value,
132
- onMousedown: x((t) => I(e), ["prevent"]),
132
+ onMousedown: x((t) => L(e), ["prevent"]),
133
133
  onMouseenter: (e) => E.value = t
134
134
  }, [e.avatar ? (d(), 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, pe)) : (d(), i("span", me, h(e.name.charAt(0)), 1)), a("span", he, h(e.name), 1)], 40, fe))), 128)) : O.value ? (d(), i("div", ge, h(g.value.searching), 1)) : w.value ? (d(), i("div", _e, h(g.value.empty), 1)) : (d(), i("div", ve, h(g.value.prompt), 1))], 512));
139
+ }, null, 8, he)) : (d(), i("span", ge, h(e.name.charAt(0)), 1)), a("span", _e, h(e.name), 1)], 40, me))), 128)) : O.value ? (d(), i("div", ve, h(g.value.searching), 1)) : w.value ? (d(), i("div", ye, h(g.value.empty), 1)) : (d(), i("div", be, h(g.value.prompt), 1))], 512));
140
140
  }
141
- }), be = /* @__PURE__ */ s({
141
+ }), Se = /* @__PURE__ */ s({
142
142
  __name: "MilkdownEditor",
143
143
  props: {
144
144
  modelValue: {},
@@ -148,20 +148,32 @@ var J = Symbol("kun-editor-context"), fe = [
148
148
  readonly: { type: Boolean }
149
149
  },
150
150
  emits: ["update:modelValue"],
151
- setup(e, { emit: t }) {
152
- let r = e, i = t, a = r.modelValue, o = O(), s = F("kunMention"), c = r.features.mention !== !1 && !!r.adapters.searchMentionUsers && !!o, l = w((e) => {
151
+ setup(e, { expose: t, emit: r }) {
152
+ let i = e, a = r, o = i.modelValue, s = O(), c = I("kunMention"), l = i.features.mention !== !1 && !!i.adapters.searchMentionUsers && !!s, u = w((e) => {
153
153
  let t = k.make().config((t) => {
154
- t.set(N, e), t.set(A, r.modelValue), t.get(P).markdownUpdated((e, t, n) => {
155
- t !== n && (a = t, i("update:modelValue", t));
154
+ t.set(N, e), t.set(A, i.modelValue), t.get(P).markdownUpdated((e, t, n) => {
155
+ t !== n && (o = t, a("update:modelValue", t));
156
156
  }), t.update(M, (e) => ({
157
157
  ...e,
158
- editable: () => !r.readonly
159
- })), c && t.set(s.key, { view: o({ component: ye }) });
160
- }).use(R(r.adapters, r.features, { locale: r.locale }));
161
- return c && t.use(s), t;
158
+ editable: () => !i.readonly
159
+ })), l && t.set(c.key, { view: s({ component: xe }) });
160
+ }).use(ee(i.adapters, i.features, { locale: i.locale }));
161
+ return l && t.use(c), t;
162
162
  });
163
- return v(() => r.modelValue, (e) => {
164
- e !== a && (a = e, l.get()?.action(L(e)));
163
+ v(() => i.modelValue, (e) => {
164
+ e !== o && (o = e, u.get()?.action(R(e)));
165
+ });
166
+ let f = () => {
167
+ u.get()?.action((e) => e.get(j).focus());
168
+ };
169
+ return t({
170
+ insertQuote: (e) => {
171
+ u.get()?.action(L(re.key, e)), f();
172
+ },
173
+ insertMention: (e) => {
174
+ u.get()?.action(L(ne.key, e)), f();
175
+ },
176
+ focus: f
165
177
  }), (e, t) => (d(), n(g(S)));
166
178
  }
167
179
  }), Y = (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>`, X = (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>`, Z = {
@@ -181,21 +193,21 @@ var J = Symbol("kun-editor-context"), fe = [
181
193
  spoiler: Y("<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\"/>"),
182
194
  latex: X("Σ", 15),
183
195
  smile: Y("<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\"/>")
184
- }, xe = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), Se = [
196
+ }, Ce = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), we = [
185
197
  "title",
186
198
  "aria-label",
187
199
  "aria-expanded"
188
- ], Ce = ["innerHTML"], we = { class: "kun-editor__picker-panel" }, Te = {
200
+ ], Te = ["innerHTML"], Ee = { class: "kun-editor__picker-panel" }, De = {
189
201
  key: 0,
190
202
  class: "kun-editor__picker-tabs",
191
203
  role: "tablist"
192
- }, Ee = ["data-active"], De = ["data-active"], Oe = { class: "kun-editor__emoji-grid" }, ke = ["onClick"], Ae = {
204
+ }, Oe = ["data-active"], ke = ["data-active"], Ae = { class: "kun-editor__emoji-grid" }, je = ["onClick"], Me = {
193
205
  key: 1,
194
206
  class: "kun-editor__sticker-body"
195
- }, je = { class: "kun-editor__pack-name" }, Me = { class: "kun-editor__sticker-grid" }, Ne = ["title", "onClick"], Pe = ["src", "alt"], Fe = {
207
+ }, Ne = { class: "kun-editor__pack-name" }, Pe = { class: "kun-editor__sticker-grid" }, Fe = ["title", "onClick"], Ie = ["src", "alt"], Le = {
196
208
  key: 1,
197
209
  class: "kun-editor__picker-hint"
198
- }, Ie = /* @__PURE__ */ s({
210
+ }, Re = /* @__PURE__ */ s({
199
211
  __name: "StickerPicker",
200
212
  setup(n) {
201
213
  let [, o] = T(), s = c(J), f = s?.adapters.stickerSource, v = !!f, y = t(() => (s?.locale ?? "zh-cn").toLowerCase().startsWith("en")), x = t(() => y.value ? {
@@ -231,7 +243,7 @@ var J = Symbol("kun-editor-context"), fe = [
231
243
  n.dispatch(r.tr.insertText(e, r.selection.from));
232
244
  });
233
245
  }, P = (e, t) => {
234
- o()?.action(I(z.key, {
246
+ o()?.action(L(B.key, {
235
247
  src: e,
236
248
  title: t,
237
249
  alt: t
@@ -251,28 +263,28 @@ var J = Symbol("kun-editor-context"), fe = [
251
263
  }, [a("span", {
252
264
  class: "kun-editor__icon",
253
265
  innerHTML: g(Z).smile
254
- }, null, 8, Ce)], 8, Se), b(a("div", we, [
255
- v ? (d(), i("div", Te, [a("button", {
266
+ }, null, 8, Te)], 8, we), b(a("div", Ee, [
267
+ v ? (d(), i("div", De, [a("button", {
256
268
  type: "button",
257
269
  class: "kun-editor__picker-tab",
258
270
  "data-active": w.value === "emoji",
259
271
  onClick: n[0] ||= (e) => w.value = "emoji"
260
- }, h(x.value.emoji), 9, Ee), a("button", {
272
+ }, h(x.value.emoji), 9, Oe), a("button", {
261
273
  type: "button",
262
274
  class: "kun-editor__picker-tab",
263
275
  "data-active": w.value === "sticker",
264
276
  onClick: n[1] ||= (e) => w.value = "sticker"
265
- }, h(x.value.sticker), 9, De)])) : r("", !0),
266
- b(a("div", Oe, [(d(!0), i(e, null, m(g(xe), (e, t) => (d(), i("button", {
277
+ }, h(x.value.sticker), 9, ke)])) : r("", !0),
278
+ b(a("div", Ae, [(d(!0), i(e, null, m(g(Ce), (e, t) => (d(), i("button", {
267
279
  key: t,
268
280
  type: "button",
269
281
  class: "kun-editor__emoji",
270
282
  onClick: (t) => N(e)
271
- }, h(e), 9, ke))), 128))], 512), [[_, !v || w.value === "emoji"]]),
272
- v ? b((d(), i("div", Ae, [E.value.length ? (d(!0), i(e, { key: 0 }, m(E.value, (t) => (d(), i("div", {
283
+ }, h(e), 9, je))), 128))], 512), [[_, !v || w.value === "emoji"]]),
284
+ v ? b((d(), i("div", Me, [E.value.length ? (d(!0), i(e, { key: 0 }, m(E.value, (t) => (d(), i("div", {
273
285
  key: t.name,
274
286
  class: "kun-editor__pack"
275
- }, [a("div", je, h(t.name), 1), a("div", Me, [(d(!0), i(e, null, m(t.stickers, (e, t) => (d(), i("button", {
287
+ }, [a("div", Ne, h(t.name), 1), a("div", Pe, [(d(!0), i(e, null, m(t.stickers, (e, t) => (d(), i("button", {
276
288
  key: t,
277
289
  type: "button",
278
290
  class: "kun-editor__sticker",
@@ -282,25 +294,25 @@ var J = Symbol("kun-editor-context"), fe = [
282
294
  src: e.src,
283
295
  alt: e.name,
284
296
  loading: "lazy"
285
- }, null, 8, Pe)], 8, Ne))), 128))])]))), 128)) : (d(), i("div", Fe, h(O.value ? x.value.failed : x.value.empty), 1))], 512)), [[_, w.value === "sticker"]]) : r("", !0)
297
+ }, null, 8, Ie)], 8, Fe))), 128))])]))), 128)) : (d(), i("div", Le, h(O.value ? x.value.failed : x.value.empty), 1))], 512)), [[_, w.value === "sticker"]]) : r("", !0)
286
298
  ], 512), [[_, S.value]])], 512));
287
299
  }
288
- }), Le = {
300
+ }), ze = {
289
301
  class: "kun-editor__format-toolbar",
290
302
  role: "toolbar"
291
- }, Re = {
303
+ }, Be = {
292
304
  key: 0,
293
305
  class: "kun-editor__toolbar-divider",
294
306
  "aria-hidden": "true"
295
- }, ze = [
307
+ }, Ve = [
296
308
  "title",
297
309
  "aria-label",
298
310
  "onClick"
299
- ], Be = ["innerHTML"], Ve = ["title", "aria-label"], He = ["innerHTML"], Q = /* @__PURE__ */ s({
311
+ ], He = ["innerHTML"], Q = ["title", "aria-label"], Ue = ["innerHTML"], We = /* @__PURE__ */ s({
300
312
  __name: "EditorToolbar",
301
313
  setup(n) {
302
314
  let [, s] = T(), l = c(J), u = t(() => l?.adapters.uploadImage), f = () => l?.adapters.notify, h = t(() => l?.features.sticker !== !1), _ = t(() => (l?.locale ?? "zh-cn").toLowerCase().startsWith("en")), v = (e, t) => {
303
- s()?.action(I(e, t));
315
+ s()?.action(L(e, t));
304
316
  }, y = t(() => {
305
317
  let e = _.value;
306
318
  return {
@@ -325,66 +337,66 @@ var J = Symbol("kun-editor-context"), fe = [
325
337
  {
326
338
  svg: Z.bold,
327
339
  title: y.value.bold,
328
- run: () => v(H.key)
340
+ run: () => v(U.key)
329
341
  },
330
342
  {
331
343
  svg: Z.italic,
332
344
  title: y.value.italic,
333
- run: () => v(B.key)
345
+ run: () => v(V.key)
334
346
  },
335
347
  {
336
348
  svg: Z.strike,
337
349
  title: y.value.strike,
338
- run: () => v(ce.key)
350
+ run: () => v(ue.key)
339
351
  },
340
352
  {
341
353
  svg: Z.code,
342
354
  title: y.value.code,
343
- run: () => v(V.key)
355
+ run: () => v(H.key)
344
356
  }
345
357
  ],
346
358
  [
347
359
  {
348
360
  svg: Z.h1,
349
361
  title: y.value.h1,
350
- run: () => v(G.key, 1)
362
+ run: () => v(K.key, 1)
351
363
  },
352
364
  {
353
365
  svg: Z.h2,
354
366
  title: y.value.h2,
355
- run: () => v(G.key, 2)
367
+ run: () => v(K.key, 2)
356
368
  },
357
369
  {
358
370
  svg: Z.h3,
359
371
  title: y.value.h3,
360
- run: () => v(G.key, 3)
372
+ run: () => v(K.key, 3)
361
373
  }
362
374
  ],
363
375
  [
364
376
  {
365
377
  svg: Z.bulletList,
366
378
  title: y.value.bulletList,
367
- run: () => v(W.key)
379
+ run: () => v(G.key)
368
380
  },
369
381
  {
370
382
  svg: Z.orderedList,
371
383
  title: y.value.orderedList,
372
- run: () => v(K.key)
384
+ run: () => v(le.key)
373
385
  },
374
386
  {
375
387
  svg: Z.quote,
376
388
  title: y.value.quote,
377
- run: () => v(U.key)
389
+ run: () => v(W.key)
378
390
  },
379
391
  {
380
392
  svg: Z.codeBlock,
381
393
  title: y.value.codeBlock,
382
- run: () => v(oe.key, "")
394
+ run: () => v(ce.key, "")
383
395
  },
384
396
  {
385
397
  svg: Z.hr,
386
398
  title: y.value.hr,
387
- run: () => v(se.key)
399
+ run: () => v(z.key)
388
400
  }
389
401
  ],
390
402
  [{
@@ -394,7 +406,7 @@ var J = Symbol("kun-editor-context"), fe = [
394
406
  }, {
395
407
  svg: Z.latex,
396
408
  title: y.value.latex,
397
- run: () => v(ie.key)
409
+ run: () => v(oe.key)
398
410
  }]
399
411
  ]), x = p(null), S = () => x.value?.click(), C = async (e) => {
400
412
  let t = e.target, n = t.files?.[0];
@@ -402,7 +414,7 @@ var J = Symbol("kun-editor-context"), fe = [
402
414
  let r = u.value;
403
415
  if (!(!n || !r)) try {
404
416
  let e = await r(n);
405
- v(z.key, {
417
+ v(B.key, {
406
418
  src: e,
407
419
  title: n.name,
408
420
  alt: n.name
@@ -411,8 +423,8 @@ var J = Symbol("kun-editor-context"), fe = [
411
423
  f()?.(_.value ? "Image upload failed" : "图片上传失败", "error");
412
424
  }
413
425
  };
414
- return (t, n) => (d(), i("div", Le, [
415
- (d(!0), i(e, null, m(b.value, (t, n) => (d(), i(e, { key: n }, [n > 0 ? (d(), i("span", Re)) : r("", !0), (d(!0), i(e, null, m(t, (e, t) => (d(), i("button", {
426
+ return (t, n) => (d(), i("div", ze, [
427
+ (d(!0), i(e, null, m(b.value, (t, n) => (d(), i(e, { key: n }, [n > 0 ? (d(), i("span", Be)) : r("", !0), (d(!0), i(e, null, m(t, (e, t) => (d(), i("button", {
416
428
  key: t,
417
429
  type: "button",
418
430
  class: "kun-editor__tool",
@@ -422,7 +434,7 @@ var J = Symbol("kun-editor-context"), fe = [
422
434
  }, [a("span", {
423
435
  class: "kun-editor__icon",
424
436
  innerHTML: e.svg
425
- }, null, 8, Be)], 8, ze))), 128))], 64))), 128)),
437
+ }, null, 8, He)], 8, Ve))), 128))], 64))), 128)),
426
438
  u.value ? (d(), i(e, { key: 0 }, [
427
439
  n[0] ||= a("span", {
428
440
  class: "kun-editor__toolbar-divider",
@@ -437,7 +449,7 @@ var J = Symbol("kun-editor-context"), fe = [
437
449
  }, [a("span", {
438
450
  class: "kun-editor__icon",
439
451
  innerHTML: g(Z).image
440
- }, null, 8, He)], 8, Ve),
452
+ }, null, 8, Ue)], 8, Q),
441
453
  a("input", {
442
454
  ref_key: "fileInput",
443
455
  ref: x,
@@ -450,10 +462,10 @@ var J = Symbol("kun-editor-context"), fe = [
450
462
  h.value ? (d(), i(e, { key: 1 }, [n[1] ||= a("span", {
451
463
  class: "kun-editor__toolbar-divider",
452
464
  "aria-hidden": "true"
453
- }, null, -1), o(Ie)], 64)) : r("", !0)
465
+ }, null, -1), o(Re)], 64)) : r("", !0)
454
466
  ]));
455
467
  }
456
- }), Ue = /* @__PURE__ */ s({
468
+ }), Ge = /* @__PURE__ */ s({
457
469
  __name: "MarkdownSource",
458
470
  props: {
459
471
  modelValue: {},
@@ -461,13 +473,13 @@ var J = Symbol("kun-editor-context"), fe = [
461
473
  },
462
474
  emits: ["update:modelValue"],
463
475
  setup(e, { emit: t }) {
464
- let n = e, r = t, a = p(null), o = null, s = (e) => le.create({
476
+ let n = e, r = t, a = p(null), o = null, s = (e) => de.create({
465
477
  doc: e,
466
478
  extensions: [
467
- ne(),
479
+ ie(),
468
480
  q.lineWrapping,
469
- de,
470
- ue(),
481
+ pe,
482
+ fe(),
471
483
  q.editable.of(!n.readonly),
472
484
  q.updateListener.of((e) => {
473
485
  e.docChanged && r("update:modelValue", e.state.doc.toString());
@@ -489,13 +501,13 @@ var J = Symbol("kun-editor-context"), fe = [
489
501
  class: "kun-editor__source"
490
502
  }, null, 512));
491
503
  }
492
- }), We = {
504
+ }), Ke = {
493
505
  class: "kun-editor",
494
506
  "data-kun-editor": ""
495
- }, Ge = {
507
+ }, qe = {
496
508
  class: "kun-editor__toolbar",
497
509
  role: "tablist"
498
- }, Ke = ["aria-selected", "data-active"], qe = ["aria-selected", "data-active"], Je = { class: "kun-editor__wysiwyg" }, $ = /* @__PURE__ */ s({
510
+ }, Je = ["aria-selected", "data-active"], Ye = ["aria-selected", "data-active"], Xe = { class: "kun-editor__wysiwyg" }, $ = /* @__PURE__ */ s({
499
511
  __name: "KunEditor",
500
512
  props: {
501
513
  modelValue: {},
@@ -508,70 +520,76 @@ var J = Symbol("kun-editor-context"), fe = [
508
520
  }
509
521
  },
510
522
  emits: ["update:modelValue"],
511
- setup(e, { emit: s }) {
512
- let c = e, l = s;
523
+ setup(e, { expose: s, emit: c }) {
524
+ let l = e, u = c;
513
525
  f(J, {
514
526
  get adapters() {
515
- return c.adapters;
527
+ return l.adapters;
516
528
  },
517
529
  get features() {
518
- return c.features;
530
+ return l.features;
519
531
  },
520
532
  get locale() {
521
- return c.locale;
533
+ return l.locale;
522
534
  }
523
535
  });
524
- let u = p("wysiwyg"), m = t(() => c.locale.toLowerCase().startsWith("en")), v = t(() => m.value ? {
536
+ let m = p("wysiwyg"), v = t(() => l.locale.toLowerCase().startsWith("en")), x = t(() => v.value ? {
525
537
  wysiwyg: "Preview",
526
538
  source: "Markdown"
527
539
  } : {
528
540
  wysiwyg: "预览",
529
541
  source: "Markdown"
530
- }), x = (e) => l("update:modelValue", e);
531
- return (t, s) => (d(), i("div", We, [
532
- a("div", Ge, [a("button", {
542
+ }), S = (e) => u("update:modelValue", e), w = p(null);
543
+ return s({
544
+ insertQuote: (e) => w.value?.insertQuote(e),
545
+ insertMention: (e) => w.value?.insertMention(e),
546
+ focus: () => w.value?.focus()
547
+ }), (t, s) => (d(), i("div", Ke, [
548
+ a("div", qe, [a("button", {
533
549
  type: "button",
534
550
  class: "kun-editor__tab",
535
- "aria-selected": u.value === "wysiwyg",
536
- "data-active": u.value === "wysiwyg",
537
- onClick: s[0] ||= (e) => u.value = "wysiwyg"
538
- }, h(v.value.wysiwyg), 9, Ke), a("button", {
551
+ "aria-selected": m.value === "wysiwyg",
552
+ "data-active": m.value === "wysiwyg",
553
+ onClick: s[0] ||= (e) => m.value = "wysiwyg"
554
+ }, h(x.value.wysiwyg), 9, Je), a("button", {
539
555
  type: "button",
540
556
  class: "kun-editor__tab",
541
- "aria-selected": u.value === "source",
542
- "data-active": u.value === "source",
543
- onClick: s[1] ||= (e) => u.value = "source"
544
- }, h(v.value.source), 9, qe)]),
557
+ "aria-selected": m.value === "source",
558
+ "data-active": m.value === "source",
559
+ onClick: s[1] ||= (e) => m.value = "source"
560
+ }, h(x.value.source), 9, Ye)]),
545
561
  o(g(C), null, {
546
562
  default: y(() => [o(g(E), null, {
547
- default: y(() => [b(o(Q, null, null, 512), [[_, u.value === "wysiwyg" && !e.readonly]]), b(a("div", Je, [o(be, {
563
+ default: y(() => [b(o(We, null, null, 512), [[_, m.value === "wysiwyg" && !e.readonly]]), b(a("div", Xe, [o(Se, {
564
+ ref_key: "inner",
565
+ ref: w,
548
566
  "model-value": e.modelValue,
549
567
  adapters: e.adapters,
550
568
  features: e.features,
551
569
  locale: e.locale,
552
570
  readonly: e.readonly,
553
- "onUpdate:modelValue": x
571
+ "onUpdate:modelValue": S
554
572
  }, null, 8, [
555
573
  "model-value",
556
574
  "adapters",
557
575
  "features",
558
576
  "locale",
559
577
  "readonly"
560
- ])], 512), [[_, u.value === "wysiwyg"]])]),
578
+ ])], 512), [[_, m.value === "wysiwyg"]])]),
561
579
  _: 1
562
580
  })]),
563
581
  _: 1
564
582
  }),
565
- u.value === "source" ? (d(), n(Ue, {
583
+ m.value === "source" ? (d(), n(Ge, {
566
584
  key: 0,
567
585
  "model-value": e.modelValue,
568
586
  readonly: e.readonly,
569
- "onUpdate:modelValue": x
587
+ "onUpdate:modelValue": S
570
588
  }, null, 8, ["model-value", "readonly"])) : r("", !0)
571
589
  ]));
572
590
  }
573
- }), Ye = { install(e) {
591
+ }), Ze = { install(e) {
574
592
  e.component("KunEditor", $);
575
593
  } };
576
594
  //#endregion
577
- export { $ as KunEditor, Ye as KunEditorPlugin };
595
+ export { $ as KunEditor, Ze as KunEditorPlugin };
@@ -0,0 +1,21 @@
1
+ export interface KunEditorExpose {
2
+ /**
3
+ * Insert a reference atom at the cursor (`[label](kungal-reply:refId)`), then
4
+ * focus. Requires the `quote` feature to be enabled.
5
+ */
6
+ insertQuote(payload: {
7
+ refId: string;
8
+ label: string;
9
+ }): void;
10
+ /**
11
+ * Insert an @mention atom at the cursor (`[@name](kungal-user:id)`), then
12
+ * focus. Requires the `mention` feature (on by default).
13
+ */
14
+ insertMention(payload: {
15
+ userId: number;
16
+ name: string;
17
+ }): void;
18
+ /** Focus the WYSIWYG editor. */
19
+ focus(): void;
20
+ }
21
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAOA,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.8.0",
3
+ "version": "0.10.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.8.0"
43
+ "@kungal/editor-core": "0.10.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.8.0"
83
+ "@kungal/editor-core": "0.10.0"
84
84
  },
85
85
  "scripts": {
86
86
  "build": "vite build && vue-tsc -p tsconfig.build.json",