@kungal/editor-vue 0.20.0 → 0.22.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 +59 -0
- package/dist/components/KunEditor.vue.d.ts +3 -0
- package/dist/components/KunEditor.vue.d.ts.map +1 -1
- package/dist/components/MilkdownEditor.vue.d.ts +1 -0
- package/dist/components/MilkdownEditor.vue.d.ts.map +1 -1
- package/dist/components/SelectionTooltip.vue.d.ts +4 -0
- package/dist/components/SelectionTooltip.vue.d.ts.map +1 -0
- package/dist/components/ToolbarHost.vue.d.ts.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +200 -132
- package/dist/types.d.ts +1 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,64 @@
|
|
|
1
1
|
# @kungal/editor-vue
|
|
2
2
|
|
|
3
|
+
## 0.22.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- fbbb761: Add a selection bubble toolbar (floating format menu on text selection).
|
|
8
|
+
|
|
9
|
+
Selecting text now shows a floating inline-format menu (bold / italic /
|
|
10
|
+
strikethrough / inline code) over the selection — the Medium/Notion pattern. It's
|
|
11
|
+
built the Milkdown v7 way: a tooltip plugin view (`@milkdown/kit/plugin/tooltip`'s
|
|
12
|
+
`tooltipFactory` + `TooltipProvider`, rendered via `@prosemirror-adapter/vue` —
|
|
13
|
+
the same plugin-view mechanism as the @mention dropdown). `TooltipProvider`
|
|
14
|
+
handles show/hide/positioning (floating-ui): shown only on a non-empty text
|
|
15
|
+
selection while focused, and never when read-only (so it's inert in the split
|
|
16
|
+
preview). Buttons run the same toggle commands as the fixed toolbar.
|
|
17
|
+
|
|
18
|
+
- `<KunEditor>` gains a `selectionToolbar` prop (default `true`; set `false` to
|
|
19
|
+
disable).
|
|
20
|
+
- Headless: the bubble is class hooks only (`.kun-editor__bubble` /
|
|
21
|
+
`.kun-editor__bubble-btn`, with `[data-show]`), like the @mention dropdown —
|
|
22
|
+
styled by the reference `kun-editor.css`. editor-vue still ships zero CSS.
|
|
23
|
+
|
|
24
|
+
Verified in the docs production build: selecting text shows the positioned bubble;
|
|
25
|
+
clicking bold marks the selection (`**…**`); collapsing the selection hides it; 0
|
|
26
|
+
console errors.
|
|
27
|
+
|
|
28
|
+
### Patch Changes
|
|
29
|
+
|
|
30
|
+
- @kungal/editor-core@0.22.0
|
|
31
|
+
|
|
32
|
+
## 0.21.0
|
|
33
|
+
|
|
34
|
+
### Minor Changes
|
|
35
|
+
|
|
36
|
+
- 9556a51: `<KunEditorToolbar>` gains an `items` prop to reorder / subset the buttons.
|
|
37
|
+
|
|
38
|
+
Previously the toolbar's button order was fixed, so a host that wanted a different
|
|
39
|
+
order had to rebuild a whole custom toolbar via the `#toolbar` slot — which drifts
|
|
40
|
+
from the default toolbar used elsewhere (e.g. a topic-edit page vs reply/comment).
|
|
41
|
+
|
|
42
|
+
Now pass `:items` — an ordered `KunToolbarItem[]` (`'heading' | 'bold' | 'italic'
|
|
43
|
+
| 'strike' | 'code' | 'bulletList' | 'orderedList' | 'quote' | 'codeBlock' | 'hr'
|
|
44
|
+
| 'spoiler' | 'image' | 'picker' | '|'`, where `'|'` is a divider):
|
|
45
|
+
|
|
46
|
+
```vue
|
|
47
|
+
<KunEditorToolbar
|
|
48
|
+
v-bind="api"
|
|
49
|
+
:items="['picker', '|', 'bold', 'italic', '|', 'image', '|', 'heading']"
|
|
50
|
+
/>
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Apply the same array to every editor for a consistent site-wide order without
|
|
54
|
+
rebuilding a toolbar. Defaults to the standard layout. `image`/`picker` are still
|
|
55
|
+
auto-dropped without their adapter/feature, and dividers collapse around removed
|
|
56
|
+
items. `KunToolbarItem` is exported from `@kungal/editor-vue`.
|
|
57
|
+
|
|
58
|
+
### Patch Changes
|
|
59
|
+
|
|
60
|
+
- @kungal/editor-core@0.21.0
|
|
61
|
+
|
|
3
62
|
## 0.20.0
|
|
4
63
|
|
|
5
64
|
### Minor Changes
|
|
@@ -16,6 +16,8 @@ type __VLS_Props = {
|
|
|
16
16
|
/** Sync scrolling between the split panes. Default `true`; set `false` to
|
|
17
17
|
* disable (or toggle it at runtime via the view-switch API). */
|
|
18
18
|
scrollSync?: boolean;
|
|
19
|
+
/** Show a floating format toolbar on text selection. Default `true`. */
|
|
20
|
+
selectionToolbar?: boolean;
|
|
19
21
|
};
|
|
20
22
|
type ViewMode = 'wysiwyg' | 'source' | 'split';
|
|
21
23
|
declare var __VLS_1: {
|
|
@@ -64,6 +66,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, KunEditorEx
|
|
|
64
66
|
locale: KunEditorLocale;
|
|
65
67
|
readonly: boolean;
|
|
66
68
|
placeholder: string;
|
|
69
|
+
selectionToolbar: boolean;
|
|
67
70
|
scrollSync: boolean;
|
|
68
71
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
69
72
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -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":"AAiUA,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;IAClB,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;oEACgE;IAChE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,wEAAwE;IACxE,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,CAAC;AAuCJ,KAAK,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;AAyW9C,QAAA,IAAI,OAAO;;iBAvWS,QAAQ;;;;;;;;;;;;CAuWP,EAAE,QAAQ;iEAjb/B,CA1S+C;;;;;;;;;;;;;;;CA2tBiB,CAAE;AAClE,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAClD;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAQhD,QAAA,MAAM,UAAU;;;;;cAzaD,iBAAiB;cAEjB,iBAAiB;YAEnB,eAAe;cAEb,OAAO;iBAEJ,MAAM;sBAKD,OAAO;gBAFb,OAAO;6EAmatB,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"}
|
|
@@ -7,6 +7,7 @@ type __VLS_Props = {
|
|
|
7
7
|
locale: KunEditorLocale;
|
|
8
8
|
readonly: boolean;
|
|
9
9
|
placeholder: string;
|
|
10
|
+
selectionToolbar: boolean;
|
|
10
11
|
};
|
|
11
12
|
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, KunEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
12
13
|
"update:modelValue": (markdown: string) => any;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MilkdownEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/MilkdownEditor.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MilkdownEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/MilkdownEditor.vue"],"names":[],"mappings":"AA4MA,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAA;AAI5B,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;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,gBAAgB,EAAE,OAAO,CAAA;CAC1B,CAAC;AA4JF,QAAA,MAAM,YAAY;;;;kFAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
declare const _default: typeof __VLS_export;
|
|
3
|
+
export default _default;
|
|
4
|
+
//# sourceMappingURL=SelectionTooltip.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SelectionTooltip.vue.d.ts","sourceRoot":"","sources":["../../src/components/SelectionTooltip.vue"],"names":[],"mappings":"AAyMA,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarHost.vue.d.ts","sourceRoot":"","sources":["../../src/components/ToolbarHost.vue"],"names":[],"mappings":"AAyFA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAuFhD,QAAA,IAAI,OAAO;oCAxFX,
|
|
1
|
+
{"version":3,"file":"ToolbarHost.vue.d.ts","sourceRoot":"","sources":["../../src/components/ToolbarHost.vue"],"names":[],"mappings":"AAyFA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAuFhD,QAAA,IAAI,OAAO;oCAxFX,CA9DM;;;;;;;;;;;;;;;CAsJgB,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
|
@@ -3,6 +3,7 @@ import KunEditor from './components/KunEditor.vue';
|
|
|
3
3
|
export { KunEditor };
|
|
4
4
|
export type { KunEditorExpose } from './types';
|
|
5
5
|
export type { KunEditorToolbarApi } from './types';
|
|
6
|
+
export type { KunToolbarItem } from './types';
|
|
6
7
|
export type { KunEditorViewSwitchApi } from './types';
|
|
7
8
|
export { EMOJI } from './emoji';
|
|
8
9
|
export type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale, UploadImage, SearchMentionUsers, StickerSource, Notify, NotifyLevel, MentionUser, StickerItem, StickerPack } from '@kungal/editor-core';
|
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,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAGlD,YAAY,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAGrD,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"}
|
|
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,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAG7C,YAAY,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAGrD,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
|
@@ -4,36 +4,37 @@ import { ProsemirrorAdapterProvider as A, usePluginViewContext as j, usePluginVi
|
|
|
4
4
|
import { Editor as N, defaultValueCtx as P, editorViewCtx as F, editorViewOptionsCtx as I, rootCtx as L } from "@milkdown/kit/core";
|
|
5
5
|
import { listenerCtx as R } from "@milkdown/kit/plugin/listener";
|
|
6
6
|
import { SlashProvider as z, slashFactory as B } from "@milkdown/kit/plugin/slash";
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import {
|
|
7
|
+
import { TooltipProvider as V, tooltipFactory as H } from "@milkdown/kit/plugin/tooltip";
|
|
8
|
+
import { callCommand as U, replaceAll as W } from "@milkdown/kit/utils";
|
|
9
|
+
import { createKunEditorPlugins as ee, insertKunSpoilerCommand as te, insertMentionCommand as G, insertQuoteCommand as K, kunCM as ne, mentionId as re, setHeadingCommand as ie, startImageUpload as q } from "@kungal/editor-core/preset";
|
|
10
|
+
import { TextSelection as ae } from "@milkdown/kit/prose/state";
|
|
11
|
+
import { createCodeBlockCommand as oe, insertHrCommand as se, insertImageCommand as ce, toggleEmphasisCommand as J, toggleInlineCodeCommand as le, toggleStrongCommand as ue, wrapInBlockquoteCommand as de, wrapInBulletListCommand as fe, wrapInOrderedListCommand as pe } from "@milkdown/kit/preset/commonmark";
|
|
12
|
+
import { toggleStrikethroughCommand as me } from "@milkdown/kit/preset/gfm";
|
|
13
|
+
import { EditorState as he } from "@codemirror/state";
|
|
14
|
+
import { EditorView as Y } from "@codemirror/view";
|
|
15
|
+
import { markdown as ge } from "@codemirror/lang-markdown";
|
|
16
|
+
import { basicSetup as _e } from "codemirror";
|
|
16
17
|
//#region src/context.ts
|
|
17
|
-
var
|
|
18
|
+
var X = Symbol("kun-editor-context"), ve = [
|
|
18
19
|
"data-active",
|
|
19
20
|
"onMousedown",
|
|
20
21
|
"onMouseenter"
|
|
21
|
-
],
|
|
22
|
+
], ye = ["src", "alt"], be = {
|
|
22
23
|
key: 1,
|
|
23
24
|
class: "kun-mention-dropdown__avatar kun-mention-dropdown__avatar--fallback"
|
|
24
|
-
},
|
|
25
|
+
}, xe = { class: "kun-mention-dropdown__name" }, Se = {
|
|
25
26
|
key: 1,
|
|
26
27
|
class: "kun-mention-dropdown__hint"
|
|
27
|
-
},
|
|
28
|
+
}, Ce = {
|
|
28
29
|
key: 2,
|
|
29
30
|
class: "kun-mention-dropdown__hint"
|
|
30
|
-
},
|
|
31
|
+
}, we = {
|
|
31
32
|
key: 3,
|
|
32
33
|
class: "kun-mention-dropdown__hint"
|
|
33
|
-
},
|
|
34
|
+
}, Te = /* @__PURE__ */ s({
|
|
34
35
|
__name: "MentionDropdown",
|
|
35
36
|
setup(n) {
|
|
36
|
-
let r = /(?:^|\s)@([^\s@]{0,30})$/, o = l(
|
|
37
|
+
let r = /(?:^|\s)@([^\s@]{0,30})$/, o = l(X), s = o?.adapters.searchMentionUsers, c = t(() => (o?.locale ?? "zh-cn").toLowerCase().startsWith("en")), u = t(() => c.value ? {
|
|
37
38
|
searching: "Searching…",
|
|
38
39
|
empty: "No matching users",
|
|
39
40
|
prompt: "Type a username to search"
|
|
@@ -73,13 +74,13 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
73
74
|
}, I = (e) => {
|
|
74
75
|
let t = d.value;
|
|
75
76
|
if (!t || !O) return;
|
|
76
|
-
let n = t.state.schema.nodes[
|
|
77
|
+
let n = t.state.schema.nodes[re];
|
|
77
78
|
if (!n) return;
|
|
78
79
|
let r = n.create({
|
|
79
80
|
userId: e.id,
|
|
80
81
|
name: e.name
|
|
81
82
|
}), { from: i, to: a } = O, o = t.state.tr.replaceWith(i, a, r), s = i + r.nodeSize;
|
|
82
|
-
o.insertText(" ", s), o.setSelection(
|
|
83
|
+
o.insertText(" ", s), o.setSelection(ae.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(), b.hide();
|
|
83
84
|
}, L = (e) => {
|
|
84
85
|
if (!x.value || !w.value.length) {
|
|
85
86
|
x.value && e.key === "Escape" && (e.preventDefault(), b.hide());
|
|
@@ -136,9 +137,86 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
136
137
|
src: e.avatar,
|
|
137
138
|
alt: e.name,
|
|
138
139
|
class: "kun-mention-dropdown__avatar"
|
|
139
|
-
}, null, 8,
|
|
140
|
+
}, null, 8, ye)) : (m(), i("span", be, y(e.name.charAt(0)), 1)), a("span", xe, y(e.name), 1)], 40, ve))), 128)) : D.value ? (m(), i("div", Se, y(u.value.searching), 1)) : C.value ? (m(), i("div", Ce, y(u.value.empty), 1)) : (m(), i("div", we, y(u.value.prompt), 1))], 512));
|
|
140
141
|
}
|
|
141
|
-
}),
|
|
142
|
+
}), Z = (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>`, Q = (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>`, $ = {
|
|
143
|
+
bold: Z("<path d=\"M6 4h8a4 4 0 0 1 0 8H6z\"/><path d=\"M6 12h9a4 4 0 0 1 0 8H6z\"/>"),
|
|
144
|
+
italic: Z("<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\"/>"),
|
|
145
|
+
strike: Z("<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\"/>"),
|
|
146
|
+
code: Z("<path d=\"m18 16 4-4-4-4\"/><path d=\"m6 8-4 4 4 4\"/><path d=\"m14.5 4-5 16\"/>"),
|
|
147
|
+
h1: Q("H1", 11),
|
|
148
|
+
h2: Q("H2", 11),
|
|
149
|
+
h3: Q("H3", 11),
|
|
150
|
+
bulletList: Z("<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\"/>"),
|
|
151
|
+
orderedList: Z("<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\"/>"),
|
|
152
|
+
quote: Z("<path d=\"M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z\" fill=\"currentColor\" stroke=\"none\"/>"),
|
|
153
|
+
codeBlock: Z("<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\"/>"),
|
|
154
|
+
hr: Z("<line x1=\"4\" y1=\"12\" x2=\"20\" y2=\"12\"/>"),
|
|
155
|
+
image: Z("<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\"/>"),
|
|
156
|
+
spoiler: Z("<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\"/>"),
|
|
157
|
+
latex: Q("Σ", 15),
|
|
158
|
+
smile: Z("<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\"/>")
|
|
159
|
+
}, Ee = [
|
|
160
|
+
"title",
|
|
161
|
+
"aria-label",
|
|
162
|
+
"onMousedown"
|
|
163
|
+
], De = ["innerHTML"], Oe = /* @__PURE__ */ s({
|
|
164
|
+
__name: "SelectionTooltip",
|
|
165
|
+
setup(n) {
|
|
166
|
+
let { view: r, prevState: o } = j(), [, s] = k(), c = l(X), u = t(() => (c?.locale ?? "zh-cn").toLowerCase().startsWith("en")), d = g(null), h, v = (e, t) => {
|
|
167
|
+
s()?.action(U(e, t));
|
|
168
|
+
}, y = t(() => {
|
|
169
|
+
let e = u.value;
|
|
170
|
+
return [
|
|
171
|
+
{
|
|
172
|
+
svg: $.bold,
|
|
173
|
+
title: e ? "Bold" : "加粗",
|
|
174
|
+
run: () => v(ue.key)
|
|
175
|
+
},
|
|
176
|
+
{
|
|
177
|
+
svg: $.italic,
|
|
178
|
+
title: e ? "Italic" : "斜体",
|
|
179
|
+
run: () => v(J.key)
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
svg: $.strike,
|
|
183
|
+
title: e ? "Strikethrough" : "删除线",
|
|
184
|
+
run: () => v(me.key)
|
|
185
|
+
},
|
|
186
|
+
{
|
|
187
|
+
svg: $.code,
|
|
188
|
+
title: e ? "Inline code" : "行内代码",
|
|
189
|
+
run: () => v(le.key)
|
|
190
|
+
}
|
|
191
|
+
];
|
|
192
|
+
});
|
|
193
|
+
return p(() => {
|
|
194
|
+
h = new V({
|
|
195
|
+
content: d.value,
|
|
196
|
+
offset: 8
|
|
197
|
+
}), h.update(r.value, o.value);
|
|
198
|
+
}), S([r, o], () => {
|
|
199
|
+
h?.update(r.value, o.value);
|
|
200
|
+
}), f(() => {
|
|
201
|
+
h?.destroy();
|
|
202
|
+
}), (t, n) => (m(), i("div", {
|
|
203
|
+
ref_key: "divRef",
|
|
204
|
+
ref: d,
|
|
205
|
+
class: "kun-editor__bubble",
|
|
206
|
+
"data-show": "false"
|
|
207
|
+
}, [(m(!0), i(e, null, _(y.value, (e, t) => (m(), i("button", {
|
|
208
|
+
key: t,
|
|
209
|
+
type: "button",
|
|
210
|
+
class: "kun-editor__bubble-btn",
|
|
211
|
+
title: e.title,
|
|
212
|
+
"aria-label": e.title,
|
|
213
|
+
onMousedown: T((t) => e.run(), ["prevent"])
|
|
214
|
+
}, [a("span", {
|
|
215
|
+
class: "kun-editor__icon",
|
|
216
|
+
innerHTML: e.svg
|
|
217
|
+
}, null, 8, De)], 40, Ee))), 128))], 512));
|
|
218
|
+
}
|
|
219
|
+
}), ke = /* @__PURE__ */ s({
|
|
142
220
|
__name: "MilkdownEditor",
|
|
143
221
|
props: {
|
|
144
222
|
modelValue: {},
|
|
@@ -146,80 +224,64 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
146
224
|
features: {},
|
|
147
225
|
locale: {},
|
|
148
226
|
readonly: { type: Boolean },
|
|
149
|
-
placeholder: {}
|
|
227
|
+
placeholder: {},
|
|
228
|
+
selectionToolbar: { type: Boolean }
|
|
150
229
|
},
|
|
151
230
|
emits: ["update:modelValue"],
|
|
152
231
|
setup(e, { expose: t, emit: r }) {
|
|
153
|
-
let i = e, a = r, o = i.modelValue, s = M(), c = B("kunMention"), l = i.features.mention !== !1 && !!i.adapters.searchMentionUsers && !!s, u = O((e) => {
|
|
232
|
+
let i = e, a = r, o = i.modelValue, s = M(), c = B("kunMention"), l = i.features.mention !== !1 && !!i.adapters.searchMentionUsers && !!s, u = H("kunSelectionTooltip"), d = i.selectionToolbar && !!s, f = O((e) => {
|
|
154
233
|
let t = N.make().config((t) => {
|
|
155
234
|
t.set(L, e), t.set(P, i.modelValue), t.get(R).markdownUpdated((e, t, n) => {
|
|
156
235
|
t !== n && (o = t, a("update:modelValue", t));
|
|
157
236
|
}), t.update(I, (e) => ({
|
|
158
237
|
...e,
|
|
159
238
|
editable: () => !i.readonly
|
|
160
|
-
})), l && t.set(c.key, { view: s({ component:
|
|
161
|
-
}).use(
|
|
239
|
+
})), l && t.set(c.key, { view: s({ component: Te }) }), d && t.set(u.key, { view: s({ component: Oe }) });
|
|
240
|
+
}).use(ee(i.adapters, i.features, {
|
|
162
241
|
locale: i.locale,
|
|
163
242
|
placeholder: i.placeholder
|
|
164
243
|
}));
|
|
165
|
-
return l && t.use(c), t;
|
|
244
|
+
return l && t.use(c), d && t.use(u), t;
|
|
166
245
|
});
|
|
167
246
|
S(() => i.modelValue, (e) => {
|
|
168
|
-
e !== o && (o = e,
|
|
247
|
+
e !== o && (o = e, f.get()?.action(W(e)));
|
|
169
248
|
}), S(() => i.readonly, () => {
|
|
170
|
-
|
|
249
|
+
f.get()?.action((e) => {
|
|
171
250
|
let t = e.get(F);
|
|
172
251
|
t.dispatch(t.state.tr);
|
|
173
252
|
});
|
|
174
253
|
});
|
|
175
|
-
let
|
|
176
|
-
|
|
254
|
+
let p = () => {
|
|
255
|
+
f.get()?.action((e) => e.get(F).focus());
|
|
177
256
|
};
|
|
178
257
|
return t({
|
|
179
258
|
insertQuote: (e) => {
|
|
180
|
-
|
|
259
|
+
f.get()?.action(U(K.key, e)), p();
|
|
181
260
|
},
|
|
182
261
|
insertMention: (e) => {
|
|
183
|
-
|
|
262
|
+
f.get()?.action(U(G.key, e)), p();
|
|
184
263
|
},
|
|
185
|
-
focus:
|
|
264
|
+
focus: p
|
|
186
265
|
}), (e, t) => (m(), n(b(E)));
|
|
187
266
|
}
|
|
188
|
-
}),
|
|
189
|
-
bold: X("<path d=\"M6 4h8a4 4 0 0 1 0 8H6z\"/><path d=\"M6 12h9a4 4 0 0 1 0 8H6z\"/>"),
|
|
190
|
-
italic: X("<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\"/>"),
|
|
191
|
-
strike: X("<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\"/>"),
|
|
192
|
-
code: X("<path d=\"m18 16 4-4-4-4\"/><path d=\"m6 8-4 4 4 4\"/><path d=\"m14.5 4-5 16\"/>"),
|
|
193
|
-
h1: Z("H1", 11),
|
|
194
|
-
h2: Z("H2", 11),
|
|
195
|
-
h3: Z("H3", 11),
|
|
196
|
-
bulletList: X("<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\"/>"),
|
|
197
|
-
orderedList: X("<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\"/>"),
|
|
198
|
-
quote: X("<path d=\"M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z\" fill=\"currentColor\" stroke=\"none\"/>"),
|
|
199
|
-
codeBlock: X("<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\"/>"),
|
|
200
|
-
hr: X("<line x1=\"4\" y1=\"12\" x2=\"20\" y2=\"12\"/>"),
|
|
201
|
-
image: X("<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\"/>"),
|
|
202
|
-
spoiler: X("<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\"/>"),
|
|
203
|
-
latex: Z("Σ", 15),
|
|
204
|
-
smile: X("<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\"/>")
|
|
205
|
-
}, $ = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), Ee = [
|
|
267
|
+
}), Ae = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), je = [
|
|
206
268
|
"title",
|
|
207
269
|
"aria-label",
|
|
208
270
|
"aria-expanded"
|
|
209
|
-
],
|
|
271
|
+
], Me = ["innerHTML"], Ne = { class: "kun-editor__picker-panel" }, Pe = {
|
|
210
272
|
key: 0,
|
|
211
273
|
class: "kun-editor__picker-tabs",
|
|
212
274
|
role: "tablist"
|
|
213
|
-
},
|
|
275
|
+
}, Fe = ["data-active"], Ie = ["data-active"], Le = { class: "kun-editor__emoji-grid" }, Re = ["onClick"], ze = {
|
|
214
276
|
key: 1,
|
|
215
277
|
class: "kun-editor__sticker-body"
|
|
216
|
-
},
|
|
278
|
+
}, Be = { class: "kun-editor__pack-name" }, Ve = { class: "kun-editor__sticker-grid" }, He = ["title", "onClick"], Ue = ["src", "alt"], We = {
|
|
217
279
|
key: 1,
|
|
218
280
|
class: "kun-editor__picker-hint"
|
|
219
|
-
},
|
|
281
|
+
}, Ge = /* @__PURE__ */ s({
|
|
220
282
|
__name: "StickerPicker",
|
|
221
283
|
setup(n) {
|
|
222
|
-
let [, o] = k(), s = l(
|
|
284
|
+
let [, o] = k(), s = l(X), c = s?.adapters.stickerSource, u = !!c, d = t(() => (s?.locale ?? "zh-cn").toLowerCase().startsWith("en")), h = t(() => d.value ? {
|
|
223
285
|
trigger: "Emoji & stickers",
|
|
224
286
|
emoji: "Emoji",
|
|
225
287
|
sticker: "Stickers",
|
|
@@ -252,7 +314,7 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
252
314
|
n.dispatch(r.tr.insertText(e, r.selection.from));
|
|
253
315
|
});
|
|
254
316
|
}, N = (e, t) => {
|
|
255
|
-
o()?.action(
|
|
317
|
+
o()?.action(U(ce.key, {
|
|
256
318
|
src: e,
|
|
257
319
|
title: t,
|
|
258
320
|
alt: t
|
|
@@ -271,29 +333,29 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
271
333
|
onClick: A
|
|
272
334
|
}, [a("span", {
|
|
273
335
|
class: "kun-editor__icon",
|
|
274
|
-
innerHTML: b(
|
|
275
|
-
}, null, 8,
|
|
276
|
-
u ? (m(), i("div",
|
|
336
|
+
innerHTML: b($).smile
|
|
337
|
+
}, null, 8, Me)], 8, je), w(a("div", Ne, [
|
|
338
|
+
u ? (m(), i("div", Pe, [a("button", {
|
|
277
339
|
type: "button",
|
|
278
340
|
class: "kun-editor__picker-tab",
|
|
279
341
|
"data-active": C.value === "emoji",
|
|
280
342
|
onClick: n[0] ||= (e) => C.value = "emoji"
|
|
281
|
-
}, y(h.value.emoji), 9,
|
|
343
|
+
}, y(h.value.emoji), 9, Fe), a("button", {
|
|
282
344
|
type: "button",
|
|
283
345
|
class: "kun-editor__picker-tab",
|
|
284
346
|
"data-active": C.value === "sticker",
|
|
285
347
|
onClick: n[1] ||= (e) => C.value = "sticker"
|
|
286
|
-
}, y(h.value.sticker), 9,
|
|
287
|
-
w(a("div",
|
|
348
|
+
}, y(h.value.sticker), 9, Ie)])) : r("", !0),
|
|
349
|
+
w(a("div", Le, [(m(!0), i(e, null, _(b(Ae), (e, t) => (m(), i("button", {
|
|
288
350
|
key: t,
|
|
289
351
|
type: "button",
|
|
290
352
|
class: "kun-editor__emoji",
|
|
291
353
|
onClick: (t) => M(e)
|
|
292
|
-
}, y(e), 9,
|
|
293
|
-
u ? w((m(), i("div",
|
|
354
|
+
}, y(e), 9, Re))), 128))], 512), [[x, !u || C.value === "emoji"]]),
|
|
355
|
+
u ? w((m(), i("div", ze, [T.value.length ? (m(!0), i(e, { key: 0 }, _(T.value, (t) => (m(), i("div", {
|
|
294
356
|
key: t.name,
|
|
295
357
|
class: "kun-editor__pack"
|
|
296
|
-
}, [a("div",
|
|
358
|
+
}, [a("div", Be, y(t.name), 1), a("div", Ve, [(m(!0), i(e, null, _(t.stickers, (e, t) => (m(), i("button", {
|
|
297
359
|
key: t,
|
|
298
360
|
type: "button",
|
|
299
361
|
class: "kun-editor__sticker",
|
|
@@ -303,25 +365,25 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
303
365
|
src: e.src,
|
|
304
366
|
alt: e.name,
|
|
305
367
|
loading: "lazy"
|
|
306
|
-
}, null, 8,
|
|
368
|
+
}, null, 8, Ue)], 8, He))), 128))])]))), 128)) : (m(), i("div", We, y(D.value ? h.value.failed : h.value.empty), 1))], 512)), [[x, C.value === "sticker"]]) : r("", !0)
|
|
307
369
|
], 512), [[x, v.value]])], 512));
|
|
308
370
|
}
|
|
309
|
-
}),
|
|
371
|
+
}), Ke = {
|
|
310
372
|
class: "kun-editor__format-toolbar",
|
|
311
373
|
role: "toolbar"
|
|
312
|
-
},
|
|
374
|
+
}, qe = ["aria-label"], Je = {
|
|
313
375
|
value: "",
|
|
314
376
|
disabled: "",
|
|
315
377
|
selected: ""
|
|
316
|
-
},
|
|
378
|
+
}, Ye = ["value"], Xe = [
|
|
317
379
|
"title",
|
|
318
380
|
"aria-label",
|
|
319
381
|
"onClick"
|
|
320
|
-
],
|
|
382
|
+
], Ze = ["innerHTML"], Qe = ["title", "aria-label"], $e = ["innerHTML"], et = /* @__PURE__ */ s({
|
|
321
383
|
__name: "EditorToolbar",
|
|
322
384
|
setup(n) {
|
|
323
|
-
let [, s] = k(), c = l(
|
|
324
|
-
s()?.action(
|
|
385
|
+
let [, s] = k(), c = l(X), u = t(() => c?.adapters.uploadImage), d = t(() => c?.features.sticker !== !1), f = t(() => (c?.locale ?? "zh-cn").toLowerCase().startsWith("en")), p = (e, t) => {
|
|
386
|
+
s()?.action(U(e, t));
|
|
325
387
|
}, h = t(() => {
|
|
326
388
|
let e = f.value;
|
|
327
389
|
return {
|
|
@@ -354,61 +416,61 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
354
416
|
}));
|
|
355
417
|
}), x = (e) => {
|
|
356
418
|
let t = e.target;
|
|
357
|
-
p(
|
|
419
|
+
p(ie.key, Number(t.value)), t.selectedIndex = 0;
|
|
358
420
|
}, S = t(() => [
|
|
359
421
|
[
|
|
360
422
|
{
|
|
361
|
-
svg:
|
|
423
|
+
svg: $.bold,
|
|
362
424
|
title: h.value.bold,
|
|
363
|
-
run: () => p(
|
|
425
|
+
run: () => p(ue.key)
|
|
364
426
|
},
|
|
365
427
|
{
|
|
366
|
-
svg:
|
|
428
|
+
svg: $.italic,
|
|
367
429
|
title: h.value.italic,
|
|
368
|
-
run: () => p(
|
|
430
|
+
run: () => p(J.key)
|
|
369
431
|
},
|
|
370
432
|
{
|
|
371
|
-
svg:
|
|
433
|
+
svg: $.strike,
|
|
372
434
|
title: h.value.strike,
|
|
373
|
-
run: () => p(
|
|
435
|
+
run: () => p(me.key)
|
|
374
436
|
},
|
|
375
437
|
{
|
|
376
|
-
svg:
|
|
438
|
+
svg: $.code,
|
|
377
439
|
title: h.value.code,
|
|
378
|
-
run: () => p(
|
|
440
|
+
run: () => p(le.key)
|
|
379
441
|
}
|
|
380
442
|
],
|
|
381
443
|
[
|
|
382
444
|
{
|
|
383
|
-
svg:
|
|
445
|
+
svg: $.bulletList,
|
|
384
446
|
title: h.value.bulletList,
|
|
385
|
-
run: () => p(
|
|
447
|
+
run: () => p(fe.key)
|
|
386
448
|
},
|
|
387
449
|
{
|
|
388
|
-
svg:
|
|
450
|
+
svg: $.orderedList,
|
|
389
451
|
title: h.value.orderedList,
|
|
390
|
-
run: () => p(
|
|
452
|
+
run: () => p(pe.key)
|
|
391
453
|
},
|
|
392
454
|
{
|
|
393
|
-
svg:
|
|
455
|
+
svg: $.quote,
|
|
394
456
|
title: h.value.quote,
|
|
395
|
-
run: () => p(
|
|
457
|
+
run: () => p(de.key)
|
|
396
458
|
},
|
|
397
459
|
{
|
|
398
|
-
svg:
|
|
460
|
+
svg: $.codeBlock,
|
|
399
461
|
title: h.value.codeBlock,
|
|
400
|
-
run: () => p(
|
|
462
|
+
run: () => p(oe.key, "")
|
|
401
463
|
},
|
|
402
464
|
{
|
|
403
|
-
svg:
|
|
465
|
+
svg: $.hr,
|
|
404
466
|
title: h.value.hr,
|
|
405
|
-
run: () => p(
|
|
467
|
+
run: () => p(se.key)
|
|
406
468
|
}
|
|
407
469
|
],
|
|
408
470
|
[{
|
|
409
|
-
svg:
|
|
471
|
+
svg: $.spoiler,
|
|
410
472
|
title: h.value.spoiler,
|
|
411
|
-
run: () => p(
|
|
473
|
+
run: () => p(te.key)
|
|
412
474
|
}]
|
|
413
475
|
]), C = g(null), w = () => C.value?.click(), T = (e) => {
|
|
414
476
|
let t = e.target, n = t.files?.[0];
|
|
@@ -422,15 +484,15 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
422
484
|
});
|
|
423
485
|
});
|
|
424
486
|
};
|
|
425
|
-
return (t, n) => (m(), i("div",
|
|
487
|
+
return (t, n) => (m(), i("div", Ke, [
|
|
426
488
|
a("select", {
|
|
427
489
|
class: "kun-editor__heading-select",
|
|
428
490
|
"aria-label": h.value.textSize,
|
|
429
491
|
onChange: x
|
|
430
|
-
}, [a("option",
|
|
492
|
+
}, [a("option", Je, y(h.value.textSize), 1), (m(!0), i(e, null, _(v.value, (e) => (m(), i("option", {
|
|
431
493
|
key: e.level,
|
|
432
494
|
value: e.level
|
|
433
|
-
}, y(e.label), 9,
|
|
495
|
+
}, y(e.label), 9, Ye))), 128))], 40, qe),
|
|
434
496
|
(m(!0), i(e, null, _(S.value, (t, r) => (m(), i(e, { key: r }, [n[0] ||= a("span", {
|
|
435
497
|
class: "kun-editor__toolbar-divider",
|
|
436
498
|
"aria-hidden": "true"
|
|
@@ -444,7 +506,7 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
444
506
|
}, [a("span", {
|
|
445
507
|
class: "kun-editor__icon",
|
|
446
508
|
innerHTML: e.svg
|
|
447
|
-
}, null, 8,
|
|
509
|
+
}, null, 8, Ze)], 8, Xe))), 128))], 64))), 128)),
|
|
448
510
|
u.value ? (m(), i(e, { key: 0 }, [
|
|
449
511
|
n[1] ||= a("span", {
|
|
450
512
|
class: "kun-editor__toolbar-divider",
|
|
@@ -458,8 +520,8 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
458
520
|
onClick: w
|
|
459
521
|
}, [a("span", {
|
|
460
522
|
class: "kun-editor__icon",
|
|
461
|
-
innerHTML: b(
|
|
462
|
-
}, null, 8,
|
|
523
|
+
innerHTML: b($).image
|
|
524
|
+
}, null, 8, $e)], 8, Qe),
|
|
463
525
|
a("input", {
|
|
464
526
|
ref_key: "fileInput",
|
|
465
527
|
ref: C,
|
|
@@ -472,14 +534,14 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
472
534
|
d.value ? (m(), i(e, { key: 1 }, [n[2] ||= a("span", {
|
|
473
535
|
class: "kun-editor__toolbar-divider",
|
|
474
536
|
"aria-hidden": "true"
|
|
475
|
-
}, null, -1), o(
|
|
537
|
+
}, null, -1), o(Ge)], 64)) : r("", !0)
|
|
476
538
|
]));
|
|
477
539
|
}
|
|
478
|
-
}),
|
|
540
|
+
}), tt = /* @__PURE__ */ s({
|
|
479
541
|
__name: "ToolbarHost",
|
|
480
542
|
setup(e) {
|
|
481
|
-
let [, t] = k(), n = l(
|
|
482
|
-
t()?.action(
|
|
543
|
+
let [, t] = k(), n = l(X, void 0), r = (e, n) => {
|
|
544
|
+
t()?.action(U(e, n));
|
|
483
545
|
}, i = () => {
|
|
484
546
|
t()?.action((e) => e.get(F).focus());
|
|
485
547
|
}, a = {
|
|
@@ -519,7 +581,7 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
519
581
|
};
|
|
520
582
|
return (e, t) => v(e.$slots, "default", d(c(a)));
|
|
521
583
|
}
|
|
522
|
-
}),
|
|
584
|
+
}), nt = /* @__PURE__ */ s({
|
|
523
585
|
__name: "MarkdownSource",
|
|
524
586
|
props: {
|
|
525
587
|
modelValue: {},
|
|
@@ -527,21 +589,21 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
527
589
|
},
|
|
528
590
|
emits: ["update:modelValue"],
|
|
529
591
|
setup(e, { emit: t }) {
|
|
530
|
-
let n = e, r = t, a = g(null), o = null, s = (e) =>
|
|
592
|
+
let n = e, r = t, a = g(null), o = null, s = (e) => he.create({
|
|
531
593
|
doc: e,
|
|
532
594
|
extensions: [
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
595
|
+
ne(),
|
|
596
|
+
Y.lineWrapping,
|
|
597
|
+
_e,
|
|
598
|
+
ge(),
|
|
599
|
+
Y.editable.of(!n.readonly),
|
|
600
|
+
Y.updateListener.of((e) => {
|
|
539
601
|
e.docChanged && r("update:modelValue", e.state.doc.toString());
|
|
540
602
|
})
|
|
541
603
|
]
|
|
542
604
|
});
|
|
543
605
|
return p(() => {
|
|
544
|
-
a.value && (o = new
|
|
606
|
+
a.value && (o = new Y({
|
|
545
607
|
state: s(n.modelValue),
|
|
546
608
|
parent: a.value
|
|
547
609
|
}));
|
|
@@ -555,14 +617,14 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
555
617
|
class: "kun-editor__source"
|
|
556
618
|
}, null, 512));
|
|
557
619
|
}
|
|
558
|
-
}),
|
|
620
|
+
}), rt = ["data-mode"], it = {
|
|
559
621
|
class: "kun-editor__toolbar",
|
|
560
622
|
role: "tablist"
|
|
561
|
-
},
|
|
623
|
+
}, at = ["aria-selected", "data-active"], ot = ["aria-selected", "data-active"], st = ["aria-selected", "data-active"], ct = ["title", "aria-label"], lt = [
|
|
562
624
|
"data-active",
|
|
563
625
|
"title",
|
|
564
626
|
"aria-pressed"
|
|
565
|
-
],
|
|
627
|
+
], ut = ["data-swap"], dt = { class: "kun-editor__wysiwyg kun-editor__pane" }, ft = /* @__PURE__ */ s({
|
|
566
628
|
__name: "KunEditor",
|
|
567
629
|
props: {
|
|
568
630
|
modelValue: {},
|
|
@@ -577,12 +639,16 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
577
639
|
scrollSync: {
|
|
578
640
|
type: Boolean,
|
|
579
641
|
default: !0
|
|
642
|
+
},
|
|
643
|
+
selectionToolbar: {
|
|
644
|
+
type: Boolean,
|
|
645
|
+
default: !0
|
|
580
646
|
}
|
|
581
647
|
},
|
|
582
648
|
emits: ["update:modelValue"],
|
|
583
649
|
setup(s, { expose: l, emit: p }) {
|
|
584
650
|
let _ = s, T = p;
|
|
585
|
-
h(
|
|
651
|
+
h(X, {
|
|
586
652
|
get adapters() {
|
|
587
653
|
return _.adapters;
|
|
588
654
|
},
|
|
@@ -657,57 +723,57 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
657
723
|
swap: j,
|
|
658
724
|
scrollSync: M.value,
|
|
659
725
|
toggleScrollSync: N
|
|
660
|
-
}, () => [a("div",
|
|
726
|
+
}, () => [a("div", it, [
|
|
661
727
|
a("button", {
|
|
662
728
|
type: "button",
|
|
663
729
|
class: "kun-editor__tab",
|
|
664
730
|
"aria-selected": E.value === "wysiwyg",
|
|
665
731
|
"data-active": E.value === "wysiwyg",
|
|
666
732
|
onClick: l[0] ||= (e) => O("wysiwyg")
|
|
667
|
-
}, y(F.value.wysiwyg), 9,
|
|
733
|
+
}, y(F.value.wysiwyg), 9, at),
|
|
668
734
|
a("button", {
|
|
669
735
|
type: "button",
|
|
670
736
|
class: "kun-editor__tab",
|
|
671
737
|
"aria-selected": E.value === "source",
|
|
672
738
|
"data-active": E.value === "source",
|
|
673
739
|
onClick: l[1] ||= (e) => O("source")
|
|
674
|
-
}, y(F.value.source), 9,
|
|
740
|
+
}, y(F.value.source), 9, ot),
|
|
675
741
|
a("button", {
|
|
676
742
|
type: "button",
|
|
677
743
|
class: "kun-editor__tab",
|
|
678
744
|
"aria-selected": E.value === "split",
|
|
679
745
|
"data-active": E.value === "split",
|
|
680
746
|
onClick: l[2] ||= (e) => O("split")
|
|
681
|
-
}, y(F.value.split), 9,
|
|
747
|
+
}, y(F.value.split), 9, st),
|
|
682
748
|
E.value === "split" ? (m(), i(e, { key: 0 }, [a("button", {
|
|
683
749
|
type: "button",
|
|
684
750
|
class: "kun-editor__tab kun-editor__swap",
|
|
685
751
|
title: F.value.swap,
|
|
686
752
|
"aria-label": F.value.swap,
|
|
687
753
|
onClick: l[3] ||= (e) => j()
|
|
688
|
-
}, " ⇄ ", 8,
|
|
754
|
+
}, " ⇄ ", 8, ct), a("button", {
|
|
689
755
|
type: "button",
|
|
690
756
|
class: "kun-editor__tab",
|
|
691
757
|
"data-active": M.value,
|
|
692
758
|
title: F.value.scrollSync,
|
|
693
759
|
"aria-pressed": M.value,
|
|
694
760
|
onClick: l[4] ||= (e) => N()
|
|
695
|
-
}, y(F.value.scrollSync), 9,
|
|
761
|
+
}, y(F.value.scrollSync), 9, lt)], 64)) : r("", !0)
|
|
696
762
|
])]), o(b(D), null, {
|
|
697
763
|
default: C(() => [o(b(A), null, {
|
|
698
|
-
default: C(() => [w(a("div", null, [o(
|
|
699
|
-
default: C((e) => [v(t.$slots, "toolbar", d(c(e)), () => [o(
|
|
764
|
+
default: C(() => [w(a("div", null, [o(tt, null, {
|
|
765
|
+
default: C((e) => [v(t.$slots, "toolbar", d(c(e)), () => [o(et)])]),
|
|
700
766
|
_: 3
|
|
701
767
|
})], 512), [[x, E.value === "wysiwyg" && !s.readonly]]), a("div", {
|
|
702
768
|
class: "kun-editor__panes",
|
|
703
769
|
"data-swap": k.value
|
|
704
|
-
}, [E.value === "source" || E.value === "split" ? (m(), n(
|
|
770
|
+
}, [E.value === "source" || E.value === "split" ? (m(), n(nt, {
|
|
705
771
|
key: 0,
|
|
706
772
|
class: "kun-editor__pane",
|
|
707
773
|
"model-value": s.modelValue,
|
|
708
774
|
readonly: s.readonly,
|
|
709
775
|
"onUpdate:modelValue": U
|
|
710
|
-
}, null, 8, ["model-value", "readonly"])) : r("", !0), w(a("div",
|
|
776
|
+
}, null, 8, ["model-value", "readonly"])) : r("", !0), w(a("div", dt, [o(ke, {
|
|
711
777
|
ref_key: "inner",
|
|
712
778
|
ref: W,
|
|
713
779
|
"model-value": s.modelValue,
|
|
@@ -716,6 +782,7 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
716
782
|
locale: s.locale,
|
|
717
783
|
readonly: H.value,
|
|
718
784
|
placeholder: s.placeholder,
|
|
785
|
+
"selection-toolbar": s.selectionToolbar,
|
|
719
786
|
"onUpdate:modelValue": U
|
|
720
787
|
}, null, 8, [
|
|
721
788
|
"model-value",
|
|
@@ -723,15 +790,16 @@ var Y = Symbol("kun-editor-context"), _e = [
|
|
|
723
790
|
"features",
|
|
724
791
|
"locale",
|
|
725
792
|
"readonly",
|
|
726
|
-
"placeholder"
|
|
727
|
-
|
|
793
|
+
"placeholder",
|
|
794
|
+
"selection-toolbar"
|
|
795
|
+
])], 512), [[x, E.value === "wysiwyg" || E.value === "split"]])], 8, ut)]),
|
|
728
796
|
_: 3
|
|
729
797
|
})]),
|
|
730
798
|
_: 3
|
|
731
|
-
})], 8,
|
|
799
|
+
})], 8, rt));
|
|
732
800
|
}
|
|
733
|
-
}),
|
|
734
|
-
e.component("KunEditor",
|
|
801
|
+
}), pt = { install(e) {
|
|
802
|
+
e.component("KunEditor", ft);
|
|
735
803
|
} };
|
|
736
804
|
//#endregion
|
|
737
|
-
export {
|
|
805
|
+
export { Ae as EMOJI, ft as KunEditor, pt as KunEditorPlugin };
|
package/dist/types.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { CmdKey } from '@milkdown/kit/core';
|
|
2
2
|
import type { KunEditorAdapters, KunEditorFeatures, KunEditorLocale } from '@kungal/editor-core';
|
|
3
|
+
export type KunToolbarItem = 'heading' | 'bold' | 'italic' | 'strike' | 'code' | 'bulletList' | 'orderedList' | 'quote' | 'codeBlock' | 'hr' | 'spoiler' | 'image' | 'picker' | '|';
|
|
3
4
|
export interface KunEditorToolbarApi {
|
|
4
5
|
/** Run a Milkdown command (import its key from the preset/commonmark/gfm). */
|
|
5
6
|
run: <T>(key: CmdKey<T>, payload?: T) => void;
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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;
|
|
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;AAK5B,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,MAAM,GACN,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,YAAY,GACZ,aAAa,GACb,OAAO,GACP,WAAW,GACX,IAAI,GACJ,SAAS,GACT,OAAO,GACP,QAAQ,GACR,GAAG,CAAA;AAMP,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;;;;OAIG;IACH,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IACjC,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;AAMD,MAAM,WAAW,sBAAsB;IACrC,uEAAuE;IACvE,IAAI,EAAE,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,8BAA8B;IAC9B,OAAO,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,QAAQ,GAAG,OAAO,KAAK,IAAI,CAAA;IACvD,qDAAqD;IACrD,MAAM,EAAE;QACN,OAAO,EAAE,MAAM,CAAA;QACf,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;QACb,IAAI,EAAE,MAAM,CAAA;QACZ,UAAU,EAAE,MAAM,CAAA;KACnB,CAAA;IACD,iEAAiE;IACjE,OAAO,EAAE,OAAO,CAAA;IAChB,gDAAgD;IAChD,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,4CAA4C;IAC5C,UAAU,EAAE,OAAO,CAAA;IACnB,qCAAqC;IACrC,gBAAgB,EAAE,MAAM,IAAI,CAAA;CAC7B;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.22.0",
|
|
4
4
|
"description": "KunEditor Vue 3 layer — the headless <KunEditor> component (dual WYSIWYG / markdown-source), toolbar and plugin views. Ships zero CSS and no UI-kit dependency; consumes @kungal/editor-core, and pairs with @kungal/editor-nuxt for optional KunUI chrome.",
|
|
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.22.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.22.0"
|
|
84
84
|
},
|
|
85
85
|
"scripts": {
|
|
86
86
|
"build": "vite build && vue-tsc -p tsconfig.build.json",
|