@kungal/editor-vue 0.17.0 → 0.19.0

package/CHANGELOG.md

@@ -1,5 +1,72 @@
 # @kungal/editor-vue
 
+## 0.19.0
+
+### Minor Changes
+
+- f111b82: Add a desktop **split view** for long-form writing.
+
+  `<KunEditor>` now has a third view mode, `split`, alongside WYSIWYG and Markdown:
+  an editable markdown source pane + a live **read-only WYSIWYG preview**, side by
+  side and left/right swappable. The markdown string stays the single source of
+  truth and the preview is derived — the industry-standard model (VS Code /
+  StackEdit / Dillinger), so there's no two-editor bidirectional-sync problem.
+
+  - **editor-vue**: the view mode gains `'split'`; `KunEditorViewSwitchApi` gains
+    `swap()` / `swapped` and `labels.split` / `labels.swap`. The WYSIWYG becomes a
+    read-only preview in split (its editability now reacts to the `readonly` prop).
+    The default hand-rolled view switch gets a 分栏 tab + a ⇄ swap button.
+  - **editor-nuxt**: `<KunEditorViewSwitch>` gets the 分栏 KunTab + a KunUI swap
+    button (shown in split).
+  - **Headless**: the layout is class hooks only — `.kun-editor__panes` /
+    `.kun-editor__pane` under `[data-mode='split']` (+ `[data-swap]`). Styled by the
+    reference `kun-editor.css`: stacked on narrow screens, side-by-side (swappable)
+    from `md` up. editor-vue still ships zero CSS.
+
+  Verified in the docs production build (headless + KunUI view switches): 分栏 shows
+  both panes side by side, typing markdown in the source updates the preview live,
+  the WYSIWYG preview is `contenteditable=false`, swap reverses the panes; 0 console
+  errors. (Synced scrolling between panes is a possible follow-up.)
+
+### Patch Changes
+
+- @kungal/editor-core@0.19.0
+
+## 0.18.0
+
+### Minor Changes
+
+- 6545866: Toolbar image upload now shows an in-document "uploading…" placeholder.
+
+  Previously only paste/drop showed the in-flight placeholder (Milkdown's `upload`
+  plugin); the toolbar image button uploaded silently — the image just popped in
+  when the adapter resolved. Now the toolbar path uses the same placeholder UX
+  (ProseMirror's official upload-example pattern).
+
+  - **editor-core**: `startImageUpload(view, file, { uploadImage, notify, locale })`
+    - the `imageUploadPlaceholder` decoration plugin (exported from `/preset`;
+      wired by the preset when `uploadImage` is present). Inserts a
+      `.kun-editor__uploading` widget at the caret, uploads, then replaces it with the
+      image (or removes it + notifies on failure); not an undo step. The paste/drop
+      placeholder now uses the same `.kun-editor__uploading` class so both look
+      identical.
+  - **editor-vue**: `KunEditorToolbarApi` gains `uploadImage(file)`; both the
+    headless `EditorToolbar` and the `#toolbar` slot API route uploads through
+    `startImageUpload`.
+  - **editor-nuxt**: `<KunEditorToolbar>`'s image button uses it.
+  - **Headless kept**: the placeholder is a class + widget hook only; style it via
+    `.kun-editor__uploading` in the reference `kun-editor.css` (primary-colored).
+
+  Customizable: style the placeholder via `.kun-editor__uploading`; the text is
+  localized (zh/en). Verified in the docs production build: uploading via either
+  toolbar inserts the image; the unit tests confirm the placeholder shows during a
+  pending upload and is replaced on success / removed on failure.
+
+### Patch Changes
+
+- Updated dependencies [6545866]
+  - @kungal/editor-core@0.18.0
+
 ## 0.17.0
 
 ### Minor Changes

package/dist/components/EditorToolbar.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorToolbar.vue.d.ts","sourceRoot":"","sources":["../../src/components/EditorToolbar.vue"],"names":[],"mappings":"AAmcA,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"EditorToolbar.vue.d.ts","sourceRoot":"","sources":["../../src/components/EditorToolbar.vue"],"names":[],"mappings":"AAycA,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/KunEditor.vue.d.ts

@@ -14,17 +14,22 @@ type __VLS_Props = {
     /** Placeholder text shown while the editor is empty. */
     placeholder?: string;
 };
-type ViewMode = 'wysiwyg' | 'source';
+type ViewMode = 'wysiwyg' | 'source' | 'split';
 declare var __VLS_1: {
     mode: ViewMode;
     setMode: (m: ViewMode) => void;
     labels: {
         wysiwyg: string;
         source: string;
+        split: string;
+        swap: string;
     };
+    swapped: boolean;
+    swap: () => void;
 }, __VLS_22: {
     run: <T>(key: import("@milkdown/kit/core").CmdKey<T>, payload?: T) => void;
     insertText: (text: string) => void;
+    uploadImage: (file: File) => void;
     insertQuote: (payload: {
         refId: string;
         label: string;

package/dist/components/KunEditor.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KunEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/KunEditor.vue"],"names":[],"mappings":"AAsLA,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;CACrB,CAAC;AAqCJ,KAAK,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAA;AA8MpC,QAAA,IAAI,OAAO;;iBA5MS,QAAQ;;;;;CA4MP,EAAE,QAAQ;iEA/Q/B,CAzKwB;;;;;;;;;;;;;;CAwbwC,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;AAOhD,QAAA,MAAM,UAAU;;;;;cAtQD,iBAAiB;cAEjB,iBAAiB;YAEnB,eAAe;cAEb,OAAO;iBAEJ,MAAM;6EAmQtB,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"}
+{"version":3,"file":"KunEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/KunEditor.vue"],"names":[],"mappings":"AA6NA,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;CACrB,CAAC;AAqCJ,KAAK,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;AAkQ9C,QAAA,IAAI,OAAO;;iBAhQS,QAAQ;;;;;;;;;CAgQP,EAAE,QAAQ;iEAnU/B,CAjNuE;;;;;;;;;;;;;;;CAohBP,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;AAOhD,QAAA,MAAM,UAAU;;;;;cA1TD,iBAAiB;cAEjB,iBAAiB;YAEnB,eAAe;cAEb,OAAO;iBAEJ,MAAM;6EAuTtB,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"}

package/dist/components/MilkdownEditor.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MilkdownEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/MilkdownEditor.vue"],"names":[],"mappings":"AA0KA,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;IACjB,WAAW,EAAE,MAAM,CAAA;CACpB,CAAC;AA8HF,QAAA,MAAM,YAAY;;;;kFAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"MilkdownEditor.vue.d.ts","sourceRoot":"","sources":["../../src/components/MilkdownEditor.vue"],"names":[],"mappings":"AAwLA,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;IACjB,WAAW,EAAE,MAAM,CAAA;CACpB,CAAC;AA4IF,QAAA,MAAM,YAAY;;;;kFAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/ToolbarHost.vue.d.ts

@@ -2,6 +2,7 @@ import type { CmdKey } from '@milkdown/kit/core';
 declare var __VLS_1: {
     run: <T>(key: CmdKey<T>, payload?: T) => void;
     insertText: (text: string) => void;
+    uploadImage: (file: File) => void;
     insertQuote: (payload: {
         refId: string;
         label: string;

package/dist/components/ToolbarHost.vue.d.ts.map

@@ -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"}
+{"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,CA9Ee;;;;;;;;;;;;;;;CAsKO,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.js

@@ -4,33 +4,33 @@ import { ProsemirrorAdapterProvider as k, usePluginViewContext as A, usePluginVi
 import { Editor as M, defaultValueCtx as N, editorViewCtx as P, editorViewOptionsCtx as F, rootCtx as I } from "@milkdown/kit/core";
 import { listenerCtx as L } from "@milkdown/kit/plugin/listener";
 import { SlashProvider as ee, slashFactory as te } from "@milkdown/kit/plugin/slash";
-import { callCommand as R, replaceAll as z } from "@milkdown/kit/utils";
-import { createKunEditorPlugins as ne, insertKunSpoilerCommand as re, insertMentionCommand as B, insertQuoteCommand as V, kunCM as ie, mentionId as ae, setHeadingCommand as oe } from "@kungal/editor-core/preset";
-import { TextSelection as se } from "@milkdown/kit/prose/state";
-import { createCodeBlockCommand as ce, insertHrCommand as H, insertImageCommand as U, toggleEmphasisCommand as W, toggleInlineCodeCommand as G, toggleStrongCommand as le, wrapInBlockquoteCommand as ue, wrapInBulletListCommand as de, wrapInOrderedListCommand as fe } from "@milkdown/kit/preset/commonmark";
-import { toggleStrikethroughCommand as pe } from "@milkdown/kit/preset/gfm";
-import { EditorState as me } from "@codemirror/state";
+import { callCommand as R, replaceAll as ne } from "@milkdown/kit/utils";
+import { createKunEditorPlugins as re, insertKunSpoilerCommand as ie, insertMentionCommand as z, insertQuoteCommand as B, kunCM as ae, mentionId as oe, setHeadingCommand as se, startImageUpload as V } from "@kungal/editor-core/preset";
+import { TextSelection as ce } from "@milkdown/kit/prose/state";
+import { createCodeBlockCommand as H, insertHrCommand as U, insertImageCommand as W, toggleEmphasisCommand as G, toggleInlineCodeCommand as le, toggleStrongCommand as ue, wrapInBlockquoteCommand as de, wrapInBulletListCommand as fe, wrapInOrderedListCommand as pe } from "@milkdown/kit/preset/commonmark";
+import { toggleStrikethroughCommand as me } from "@milkdown/kit/preset/gfm";
+import { EditorState as he } from "@codemirror/state";
 import { EditorView as K } from "@codemirror/view";
-import { markdown as he } from "@codemirror/lang-markdown";
-import { basicSetup as ge } from "codemirror";
+import { markdown as ge } from "@codemirror/lang-markdown";
+import { basicSetup as _e } from "codemirror";
 //#region src/context.ts
-var q = Symbol("kun-editor-context"), _e = [
+var q = Symbol("kun-editor-context"), ve = [
 	"data-active",
 	"onMousedown",
 	"onMouseenter"
-], ve = ["src", "alt"], ye = {
+], ye = ["src", "alt"], be = {
 	key: 1,
 	class: "kun-mention-dropdown__avatar kun-mention-dropdown__avatar--fallback"
-}, be = { class: "kun-mention-dropdown__name" }, xe = {
+}, xe = { class: "kun-mention-dropdown__name" }, Se = {
 	key: 1,
 	class: "kun-mention-dropdown__hint"
-}, Se = {
+}, Ce = {
 	key: 2,
 	class: "kun-mention-dropdown__hint"
-}, Ce = {
+}, we = {
 	key: 3,
 	class: "kun-mention-dropdown__hint"
-}, we = /* @__PURE__ */ s({
+}, Te = /* @__PURE__ */ s({
 	__name: "MentionDropdown",
 	setup(n) {
 		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 ? {
@@ -73,13 +73,13 @@ var q = Symbol("kun-editor-context"), _e = [
 		}, I = (e) => {
 			let t = m.value;
 			if (!t || !O) return;
-			let n = t.state.schema.nodes[ae];
+			let n = t.state.schema.nodes[oe];
 			if (!n) return;
 			let r = n.create({
 				userId: e.id,
 				name: e.name
 			}), { from: i, to: a } = O, o = t.state.tr.replaceWith(i, a, r), s = i + r.nodeSize;
-			o.insertText(" ", s), o.setSelection(se.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(), b.hide();
+			o.insertText(" ", s), o.setSelection(ce.create(o.doc, s + 1)), t.dispatch(o.scrollIntoView()), t.focus(), b.hide();
 		}, L = (e) => {
 			if (!S.value || !T.value.length) {
 				S.value && e.key === "Escape" && (e.preventDefault(), b.hide());
@@ -136,9 +136,9 @@ var q = Symbol("kun-editor-context"), _e = [
 			src: e.avatar,
 			alt: e.name,
 			class: "kun-mention-dropdown__avatar"
-		}, null, 8, ve)) : (p(), i("span", ye, v(e.name.charAt(0)), 1)), a("span", be, v(e.name), 1)], 40, _e))), 128)) : D.value ? (p(), i("div", xe, v(u.value.searching), 1)) : C.value ? (p(), i("div", Se, v(u.value.empty), 1)) : (p(), i("div", Ce, v(u.value.prompt), 1))], 512));
+		}, 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));
 	}
-}), Te = /* @__PURE__ */ s({
+}), Ee = /* @__PURE__ */ s({
 	__name: "MilkdownEditor",
 	props: {
 		modelValue: {},
@@ -157,25 +157,30 @@ var q = Symbol("kun-editor-context"), _e = [
 				}), t.update(F, (e) => ({
 					...e,
 					editable: () => !i.readonly
-				})), l && t.set(c.key, { view: s({ component: we }) });
-			}).use(ne(i.adapters, i.features, {
+				})), l && t.set(c.key, { view: s({ component: Te }) });
+			}).use(re(i.adapters, i.features, {
 				locale: i.locale,
 				placeholder: i.placeholder
 			}));
 			return l && t.use(c), t;
 		});
 		x(() => i.modelValue, (e) => {
-			e !== o && (o = e, u.get()?.action(z(e)));
+			e !== o && (o = e, u.get()?.action(ne(e)));
+		}), x(() => i.readonly, () => {
+			u.get()?.action((e) => {
+				let t = e.get(P);
+				t.dispatch(t.state.tr);
+			});
 		});
 		let d = () => {
 			u.get()?.action((e) => e.get(P).focus());
 		};
 		return t({
 			insertQuote: (e) => {
-				u.get()?.action(R(V.key, e)), d();
+				u.get()?.action(R(B.key, e)), d();
 			},
 			insertMention: (e) => {
-				u.get()?.action(R(B.key, e)), d();
+				u.get()?.action(R(z.key, e)), d();
 			},
 			focus: d
 		}), (e, t) => (p(), n(y(T)));
@@ -197,21 +202,21 @@ var q = Symbol("kun-editor-context"), _e = [
 	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\"/>"),
 	latex: Y("Σ", 15),
 	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\"/>")
-}, Z = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), Ee = [
+}, Z = /* @__PURE__ */ "😀.😃.😄.😁.😆.😅.🤣.😂.🙂.🙃.😉.😊.😇.🥰.😍.🤩.😘.😗.😚.😋.😛.😜.🤪.😝.🤗.🤭.🤔.🤐.😐.😑.😶.😏.😒.🙄.😬.😌.😔.😪.🤤.😴.😷.🤒.🤕.🥵.🥶.🥴.😵.🤯.🤠.🥳.😎.🤓.🧐.😕.😟.🙁.😮.😯.😲.😳.🥺.😦.😧.😨.😰.😥.😢.😭.😱.😖.😣.😞.😓.😩.😫.🥱.😤.😡.😠.🤬.😈.👿.💀.💩.🤡.👻.👽.🤖.😺.😸.👍.👎.👌.🤌.🤏.✌️.🤞.🤟.🤘.👋.🤚.🖐️.✋.👏.🙌.🤝.🙏.💪.👀.👁️.❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.💕.💞.💓.💗.💖.💘.💝.💯.✨.⭐.🌟.🔥.💥.💫.⚡.☀️.🌈.🎉.🎊.🎁.🏆.🐶.🐱.🐭.🦊.🐻.🐼.🐨.🦄.🐢.🐳.🍎.🍑.🍓.🍉.🍰.🍺.🍵.☕.🍜.🍙.✅.❌.❓.❗.💤.👑.🎮.🎵.📌.🔖".split("."), De = [
 	"title",
 	"aria-label",
 	"aria-expanded"
-], De = ["innerHTML"], Oe = { class: "kun-editor__picker-panel" }, ke = {
+], Oe = ["innerHTML"], ke = { class: "kun-editor__picker-panel" }, Ae = {
 	key: 0,
 	class: "kun-editor__picker-tabs",
 	role: "tablist"
-}, Ae = ["data-active"], je = ["data-active"], Me = { class: "kun-editor__emoji-grid" }, Ne = ["onClick"], Pe = {
+}, je = ["data-active"], Me = ["data-active"], Ne = { class: "kun-editor__emoji-grid" }, Pe = ["onClick"], Fe = {
 	key: 1,
 	class: "kun-editor__sticker-body"
-}, Fe = { class: "kun-editor__pack-name" }, Ie = { class: "kun-editor__sticker-grid" }, Le = ["title", "onClick"], Re = ["src", "alt"], ze = {
+}, Ie = { class: "kun-editor__pack-name" }, Le = { class: "kun-editor__sticker-grid" }, Re = ["title", "onClick"], ze = ["src", "alt"], Be = {
 	key: 1,
 	class: "kun-editor__picker-hint"
-}, Be = /* @__PURE__ */ s({
+}, Ve = /* @__PURE__ */ s({
 	__name: "StickerPicker",
 	setup(n) {
 		let [, o] = O(), s = l(q), c = s?.adapters.stickerSource, u = !!c, m = t(() => (s?.locale ?? "zh-cn").toLowerCase().startsWith("en")), _ = t(() => m.value ? {
@@ -247,7 +252,7 @@ var q = Symbol("kun-editor-context"), _e = [
 				n.dispatch(r.tr.insertText(e, r.selection.from));
 			});
 		}, N = (e, t) => {
-			o()?.action(R(U.key, {
+			o()?.action(R(W.key, {
 				src: e,
 				title: t,
 				alt: t
@@ -267,28 +272,28 @@ var q = Symbol("kun-editor-context"), _e = [
 		}, [a("span", {
 			class: "kun-editor__icon",
 			innerHTML: y(X).smile
-		}, null, 8, De)], 8, Ee), C(a("div", Oe, [
-			u ? (p(), i("div", ke, [a("button", {
+		}, null, 8, Oe)], 8, De), C(a("div", ke, [
+			u ? (p(), i("div", Ae, [a("button", {
 				type: "button",
 				class: "kun-editor__picker-tab",
 				"data-active": w.value === "emoji",
 				onClick: n[0] ||= (e) => w.value = "emoji"
-			}, v(_.value.emoji), 9, Ae), a("button", {
+			}, v(_.value.emoji), 9, je), a("button", {
 				type: "button",
 				class: "kun-editor__picker-tab",
 				"data-active": w.value === "sticker",
 				onClick: n[1] ||= (e) => w.value = "sticker"
-			}, v(_.value.sticker), 9, je)])) : r("", !0),
-			C(a("div", Me, [(p(!0), i(e, null, g(y(Z), (e, t) => (p(), i("button", {
+			}, v(_.value.sticker), 9, Me)])) : r("", !0),
+			C(a("div", Ne, [(p(!0), i(e, null, g(y(Z), (e, t) => (p(), i("button", {
 				key: t,
 				type: "button",
 				class: "kun-editor__emoji",
 				onClick: (t) => M(e)
-			}, v(e), 9, Ne))), 128))], 512), [[b, !u || w.value === "emoji"]]),
-			u ? C((p(), i("div", Pe, [T.value.length ? (p(!0), i(e, { key: 0 }, g(T.value, (t) => (p(), i("div", {
+			}, v(e), 9, Pe))), 128))], 512), [[b, !u || w.value === "emoji"]]),
+			u ? C((p(), i("div", Fe, [T.value.length ? (p(!0), i(e, { key: 0 }, g(T.value, (t) => (p(), i("div", {
 				key: t.name,
 				class: "kun-editor__pack"
-			}, [a("div", Fe, v(t.name), 1), a("div", Ie, [(p(!0), i(e, null, g(t.stickers, (e, t) => (p(), i("button", {
+			}, [a("div", Ie, v(t.name), 1), a("div", Le, [(p(!0), i(e, null, g(t.stickers, (e, t) => (p(), i("button", {
 				key: t,
 				type: "button",
 				class: "kun-editor__sticker",
@@ -298,27 +303,27 @@ var q = Symbol("kun-editor-context"), _e = [
 				src: e.src,
 				alt: e.name,
 				loading: "lazy"
-			}, null, 8, Re)], 8, Le))), 128))])]))), 128)) : (p(), i("div", ze, v(D.value ? _.value.failed : _.value.empty), 1))], 512)), [[b, w.value === "sticker"]]) : r("", !0)
+			}, 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)
 		], 512), [[b, x.value]])], 512));
 	}
-}), Ve = {
+}), He = {
 	class: "kun-editor__format-toolbar",
 	role: "toolbar"
-}, He = ["aria-label"], Q = {
+}, Ue = ["aria-label"], We = {
 	value: "",
 	disabled: "",
 	selected: ""
-}, Ue = ["value"], We = [
+}, Ge = ["value"], Ke = [
 	"title",
 	"aria-label",
 	"onClick"
-], Ge = ["innerHTML"], Ke = ["title", "aria-label"], qe = ["innerHTML"], Je = /* @__PURE__ */ s({
+], qe = ["innerHTML"], Je = ["title", "aria-label"], Ye = ["innerHTML"], Q = /* @__PURE__ */ s({
 	__name: "EditorToolbar",
 	setup(n) {
-		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) => {
+		let [, s] = O(), c = l(q), u = t(() => c?.adapters.uploadImage), d = t(() => c?.features.sticker !== !1), f = t(() => (c?.locale ?? "zh-cn").toLowerCase().startsWith("en")), m = (e, t) => {
 			s()?.action(R(e, t));
-		}, b = t(() => {
-			let e = m.value;
+		}, _ = t(() => {
+			let e = f.value;
 			return {
 				textSize: e ? "Text size" : "文本大小",
 				bold: e ? "Bold" : "加粗",
@@ -333,8 +338,8 @@ var q = Symbol("kun-editor-context"), _e = [
 				spoiler: e ? "Spoiler" : "隐藏文本",
 				image: e ? "Upload image" : "上传图片"
 			};
-		}), x = t(() => {
-			let e = m.value;
+		}), b = t(() => {
+			let e = f.value;
 			return [
 				"正文",
 				"一级标题",
@@ -347,89 +352,86 @@ var q = Symbol("kun-editor-context"), _e = [
 				level: n,
 				label: e ? n === 0 ? "Paragraph" : `Heading ${n}` : t
 			}));
-		}), S = (e) => {
+		}), x = (e) => {
 			let t = e.target;
-			_(oe.key, Number(t.value)), t.selectedIndex = 0;
-		}, C = t(() => [
+			m(se.key, Number(t.value)), t.selectedIndex = 0;
+		}, S = t(() => [
 			[
 				{
 					svg: X.bold,
-					title: b.value.bold,
-					run: () => _(le.key)
+					title: _.value.bold,
+					run: () => m(ue.key)
 				},
 				{
 					svg: X.italic,
-					title: b.value.italic,
-					run: () => _(W.key)
+					title: _.value.italic,
+					run: () => m(G.key)
 				},
 				{
 					svg: X.strike,
-					title: b.value.strike,
-					run: () => _(pe.key)
+					title: _.value.strike,
+					run: () => m(me.key)
 				},
 				{
 					svg: X.code,
-					title: b.value.code,
-					run: () => _(G.key)
+					title: _.value.code,
+					run: () => m(le.key)
 				}
 			],
 			[
 				{
 					svg: X.bulletList,
-					title: b.value.bulletList,
-					run: () => _(de.key)
+					title: _.value.bulletList,
+					run: () => m(fe.key)
 				},
 				{
 					svg: X.orderedList,
-					title: b.value.orderedList,
-					run: () => _(fe.key)
+					title: _.value.orderedList,
+					run: () => m(pe.key)
 				},
 				{
 					svg: X.quote,
-					title: b.value.quote,
-					run: () => _(ue.key)
+					title: _.value.quote,
+					run: () => m(de.key)
 				},
 				{
 					svg: X.codeBlock,
-					title: b.value.codeBlock,
-					run: () => _(ce.key, "")
+					title: _.value.codeBlock,
+					run: () => m(H.key, "")
 				},
 				{
 					svg: X.hr,
-					title: b.value.hr,
-					run: () => _(H.key)
+					title: _.value.hr,
+					run: () => m(U.key)
 				}
 			],
 			[{
 				svg: X.spoiler,
-				title: b.value.spoiler,
-				run: () => _(re.key)
+				title: _.value.spoiler,
+				run: () => m(ie.key)
 			}]
-		]), w = h(null), T = () => w.value?.click(), E = async (e) => {
+		]), C = h(null), w = () => C.value?.click(), T = (e) => {
 			let t = e.target, n = t.files?.[0];
 			t.value = "";
 			let r = u.value;
-			if (!(!n || !r)) try {
-				let e = await r(n);
-				_(U.key, {
-					src: e,
-					title: n.name,
-					alt: n.name
+			!n || !r || s()?.action((e) => {
+				V(e.get(P), n, {
+					uploadImage: r,
+					notify: c?.adapters.notify,
+					locale: c?.locale
 				});
-			} catch {
-				d()?.(m.value ? "Image upload failed" : "图片上传失败", "error");
-			}
+			});
 		};
-		return (t, n) => (p(), i("div", Ve, [
+		return (t, n) => (p(), i("div", He, [
 			a("select", {
 				class: "kun-editor__heading-select",
-				"aria-label": b.value.textSize,
-				onChange: S
-			}, [a("option", Q, v(b.value.textSize), 1), (p(!0), i(e, null, g(x.value, (e) => (p(), i("option", {
+				"aria-label": _.value.textSize,
+				onChange: x
+			}, [a("option", We, v(_.value.textSize), 1), (p(!0), i(e, null, g(b.value, (e) => (p(), i("option", {
 				key: e.level,
 				value: e.level
-			}, v(e.label), 9, Ue))), 128))], 40, He),
-			(p(!0), i(e, null, g(C.value, (t, r) => (p(), i(e, { key: r }, [n[0] ||= a("span", {
+			}, v(e.label), 9, Ge))), 128))], 40, Ue),
+			(p(!0), i(e, null, g(S.value, (t, r) => (p(), i(e, { key: r }, [n[0] ||= a("span", {
 				class: "kun-editor__toolbar-divider",
 				"aria-hidden": "true"
 			}, null, -1), (p(!0), i(e, null, g(t, (e, t) => (p(), i("button", {
@@ -442,7 +444,7 @@ var q = Symbol("kun-editor-context"), _e = [
 			}, [a("span", {
 				class: "kun-editor__icon",
 				innerHTML: e.svg
-			}, null, 8, Ge)], 8, We))), 128))], 64))), 128)),
+			}, null, 8, qe)], 8, Ke))), 128))], 64))), 128)),
 			u.value ? (p(), i(e, { key: 0 }, [
 				n[1] ||= a("span", {
 					class: "kun-editor__toolbar-divider",
@@ -451,29 +453,29 @@ var q = Symbol("kun-editor-context"), _e = [
 				a("button", {
 					type: "button",
 					class: "kun-editor__tool",
-					title: b.value.image,
-					"aria-label": b.value.image,
-					onClick: T
+					title: _.value.image,
+					"aria-label": _.value.image,
+					onClick: w
 				}, [a("span", {
 					class: "kun-editor__icon",
 					innerHTML: y(X).image
-				}, null, 8, qe)], 8, Ke),
+				}, null, 8, Ye)], 8, Je),
 				a("input", {
 					ref_key: "fileInput",
-					ref: w,
+					ref: C,
 					type: "file",
 					accept: ".jpg,.jpeg,.png,.webp,.gif",
 					hidden: "",
-					onChange: E
+					onChange: T
 				}, null, 544)
 			], 64)) : r("", !0),
-			f.value ? (p(), i(e, { key: 1 }, [n[2] ||= a("span", {
+			d.value ? (p(), i(e, { key: 1 }, [n[2] ||= a("span", {
 				class: "kun-editor__toolbar-divider",
 				"aria-hidden": "true"
-			}, null, -1), o(Be)], 64)) : r("", !0)
+			}, null, -1), o(Ve)], 64)) : r("", !0)
 		]));
 	}
-}), Ye = /* @__PURE__ */ s({
+}), Xe = /* @__PURE__ */ s({
 	__name: "ToolbarHost",
 	setup(e) {
 		let [, t] = O(), n = l(q, void 0), r = (e, n) => {
@@ -488,11 +490,21 @@ var q = Symbol("kun-editor-context"), _e = [
 					n.dispatch(n.state.tr.insertText(e));
 				}), i();
 			},
+			uploadImage: (e) => {
+				let r = n?.adapters.uploadImage, i = t();
+				!r || !i || i.action((t) => {
+					V(t.get(P), e, {
+						uploadImage: r,
+						notify: n?.adapters.notify,
+						locale: n?.locale
+					});
+				});
+			},
 			insertQuote: (e) => {
-				r(V.key, e), i();
+				r(B.key, e), i();
 			},
 			insertMention: (e) => {
-				r(B.key, e), i();
+				r(z.key, e), i();
 			},
 			focus: i,
 			get adapters() {
@@ -507,7 +519,7 @@ var q = Symbol("kun-editor-context"), _e = [
 		};
 		return (e, t) => _(e.$slots, "default", u(c(a)));
 	}
-}), Xe = /* @__PURE__ */ s({
+}), Ze = /* @__PURE__ */ s({
 	__name: "MarkdownSource",
 	props: {
 		modelValue: {},
@@ -515,13 +527,13 @@ var q = Symbol("kun-editor-context"), _e = [
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, a = h(null), o = null, s = (e) => me.create({
+		let n = e, r = t, a = h(null), o = null, s = (e) => he.create({
 			doc: e,
 			extensions: [
-				ie(),
+				ae(),
 				K.lineWrapping,
-				ge,
-				he(),
+				_e,
+				ge(),
 				K.editable.of(!n.readonly),
 				K.updateListener.of((e) => {
 					e.docChanged && r("update:modelValue", e.state.doc.toString());
@@ -543,13 +555,10 @@ var q = Symbol("kun-editor-context"), _e = [
 			class: "kun-editor__source"
 		}, null, 512));
 	}
-}), Ze = {
-	class: "kun-editor",
-	"data-kun-editor": ""
-}, Qe = {
+}), Qe = ["data-mode"], $e = {
 	class: "kun-editor__toolbar",
 	role: "tablist"
-}, $e = ["aria-selected", "data-active"], et = ["aria-selected", "data-active"], tt = { class: "kun-editor__wysiwyg" }, $ = /* @__PURE__ */ s({
+}, et = ["aria-selected", "data-active"], tt = ["aria-selected", "data-active"], nt = ["aria-selected", "data-active"], rt = ["title", "aria-label"], it = ["data-swap"], at = { class: "kun-editor__wysiwyg kun-editor__pane" }, $ = /* @__PURE__ */ s({
 	__name: "KunEditor",
 	props: {
 		modelValue: {},
@@ -578,72 +587,102 @@ var q = Symbol("kun-editor-context"), _e = [
 		});
 		let g = h("wysiwyg"), x = (e) => {
 			g.value = e;
-		}, w = t(() => d.locale.toLowerCase().startsWith("en")), T = t(() => w.value ? {
+		}, w = h(!1), T = () => {
+			w.value = !w.value;
+		}, D = t(() => d.locale.toLowerCase().startsWith("en")), O = t(() => D.value ? {
 			wysiwyg: "Preview",
-			source: "Markdown"
+			source: "Markdown",
+			split: "Split",
+			swap: "Swap sides"
 		} : {
 			wysiwyg: "预览",
-			source: "Markdown"
-		}), D = (e) => f("update:modelValue", e), O = h(null);
+			source: "Markdown",
+			split: "分栏",
+			swap: "左右互换"
+		}), A = t(() => d.readonly || g.value === "split"), j = (e) => f("update:modelValue", e), M = h(null);
 		return s({
-			insertQuote: (e) => O.value?.insertQuote(e),
-			insertMention: (e) => O.value?.insertMention(e),
-			focus: () => O.value?.focus()
-		}), (t, s) => (p(), i("div", Ze, [
-			_(t.$slots, "view-switch", {
-				mode: g.value,
-				setMode: x,
-				labels: T.value
-			}, () => [a("div", Qe, [a("button", {
+			insertQuote: (e) => M.value?.insertQuote(e),
+			insertMention: (e) => M.value?.insertMention(e),
+			focus: () => M.value?.focus()
+		}), (t, s) => (p(), i("div", {
+			class: "kun-editor",
+			"data-kun-editor": "",
+			"data-mode": g.value
+		}, [_(t.$slots, "view-switch", {
+			mode: g.value,
+			setMode: x,
+			labels: O.value,
+			swapped: w.value,
+			swap: T
+		}, () => [a("div", $e, [
+			a("button", {
 				type: "button",
 				class: "kun-editor__tab",
 				"aria-selected": g.value === "wysiwyg",
 				"data-active": g.value === "wysiwyg",
 				onClick: s[0] ||= (e) => x("wysiwyg")
-			}, v(T.value.wysiwyg), 9, $e), a("button", {
+			}, v(O.value.wysiwyg), 9, et),
+			a("button", {
 				type: "button",
 				class: "kun-editor__tab",
 				"aria-selected": g.value === "source",
 				"data-active": g.value === "source",
 				onClick: s[1] ||= (e) => x("source")
-			}, v(T.value.source), 9, et)])]),
-			o(y(E), null, {
-				default: S(() => [o(y(k), null, {
-					default: S(() => [C(a("div", null, [o(Ye, null, {
-						default: S((e) => [_(t.$slots, "toolbar", u(c(e)), () => [o(Je)])]),
-						_: 3
-					})], 512), [[b, g.value === "wysiwyg" && !e.readonly]]), C(a("div", tt, [o(Te, {
-						ref_key: "inner",
-						ref: O,
-						"model-value": e.modelValue,
-						adapters: e.adapters,
-						features: e.features,
-						locale: e.locale,
-						readonly: e.readonly,
-						placeholder: e.placeholder,
-						"onUpdate:modelValue": D
-					}, null, 8, [
-						"model-value",
-						"adapters",
-						"features",
-						"locale",
-						"readonly",
-						"placeholder"
-					])], 512), [[b, g.value === "wysiwyg"]])]),
+			}, v(O.value.source), 9, tt),
+			a("button", {
+				type: "button",
+				class: "kun-editor__tab",
+				"aria-selected": g.value === "split",
+				"data-active": g.value === "split",
+				onClick: s[2] ||= (e) => x("split")
+			}, v(O.value.split), 9, nt),
+			g.value === "split" ? (p(), i("button", {
+				key: 0,
+				type: "button",
+				class: "kun-editor__tab kun-editor__swap",
+				title: O.value.swap,
+				"aria-label": O.value.swap,
+				onClick: s[3] ||= (e) => T()
+			}, " ⇄ ", 8, rt)) : r("", !0)
+		])]), o(y(E), null, {
+			default: S(() => [o(y(k), null, {
+				default: S(() => [C(a("div", null, [o(Xe, null, {
+					default: S((e) => [_(t.$slots, "toolbar", u(c(e)), () => [o(Q)])]),
 					_: 3
-				})]),
+				})], 512), [[b, g.value === "wysiwyg" && !e.readonly]]), a("div", {
+					class: "kun-editor__panes",
+					"data-swap": w.value
+				}, [g.value === "source" || g.value === "split" ? (p(), n(Ze, {
+					key: 0,
+					class: "kun-editor__pane",
+					"model-value": e.modelValue,
+					readonly: e.readonly,
+					"onUpdate:modelValue": j
+				}, null, 8, ["model-value", "readonly"])) : r("", !0), C(a("div", at, [o(Ee, {
+					ref_key: "inner",
+					ref: M,
+					"model-value": e.modelValue,
+					adapters: e.adapters,
+					features: e.features,
+					locale: e.locale,
+					readonly: A.value,
+					placeholder: e.placeholder,
+					"onUpdate:modelValue": j
+				}, null, 8, [
+					"model-value",
+					"adapters",
+					"features",
+					"locale",
+					"readonly",
+					"placeholder"
+				])], 512), [[b, g.value === "wysiwyg" || g.value === "split"]])], 8, it)]),
 				_: 3
-			}),
-			g.value === "source" ? (p(), n(Xe, {
-				key: 0,
-				"model-value": e.modelValue,
-				readonly: e.readonly,
-				"onUpdate:modelValue": D
-			}, null, 8, ["model-value", "readonly"])) : r("", !0)
-		]));
+			})]),
+			_: 3
+		})], 8, Qe));
 	}
-}), nt = { install(e) {
+}), ot = { install(e) {
 	e.component("KunEditor", $);
 } };
 //#endregion
-export { Z as EMOJI, $ as KunEditor, nt as KunEditorPlugin };
+export { Z as EMOJI, $ as KunEditor, ot as KunEditorPlugin };

package/dist/types.d.ts

@@ -5,6 +5,12 @@ export interface KunEditorToolbarApi {
     run: <T>(key: CmdKey<T>, payload?: T) => void;
     /** Insert plain text at the cursor (e.g. an emoji). */
     insertText: (text: string) => void;
+    /**
+     * Upload an image File via the `uploadImage` adapter, showing an in-document
+     * "uploading…" placeholder at the caret until it resolves (then the image), or
+     * removing it + notifying on failure. No-op without an `uploadImage` adapter.
+     */
+    uploadImage: (file: File) => void;
     /** Insert a reference atom at the cursor (requires the quote feature). */
     insertQuote: (payload: {
         refId: string;
@@ -25,15 +31,21 @@ export interface KunEditorToolbarApi {
     readonly locale: KunEditorLocale;
 }
 export interface KunEditorViewSwitchApi {
-    /** The active view. */
-    mode: 'wysiwyg' | 'source';
+    /** The active view: WYSIWYG, markdown source, or the desktop split. */
+    mode: 'wysiwyg' | 'source' | 'split';
     /** Switch the active view. */
-    setMode: (mode: 'wysiwyg' | 'source') => void;
-    /** Localized labels for the two views (respects the `locale` prop). */
+    setMode: (mode: 'wysiwyg' | 'source' | 'split') => void;
+    /** Localized labels (respects the `locale` prop). */
     labels: {
         wysiwyg: string;
         source: string;
+        split: string;
+        swap: string;
     };
+    /** Whether the split panes are swapped (source on the right). */
+    swapped: boolean;
+    /** Toggle the split panes' left/right order. */
+    swap: () => void;
 }
 export interface KunEditorExpose {
     /**

package/dist/types.d.ts.map

@@ -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;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;AAMD,MAAM,WAAW,sBAAsB;IACrC,uBAAuB;IACvB,IAAI,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC1B,8BAA8B;IAC9B,OAAO,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,QAAQ,KAAK,IAAI,CAAA;IAC7C,uEAAuE;IACvE,MAAM,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAA;CAC5C;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"}
+{"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;;;;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;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IACxE,iEAAiE;IACjE,OAAO,EAAE,OAAO,CAAA;IAChB,gDAAgD;IAChD,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;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

@@ -1,6 +1,6 @@
 {
   "name": "@kungal/editor-vue",
-  "version": "0.17.0",
+  "version": "0.19.0",
   "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.",
   "type": "module",
   "keywords": [
@@ -40,7 +40,7 @@
   },
   "dependencies": {
     "@prosemirror-adapter/vue": "^0.4.6",
-    "@kungal/editor-core": "0.17.0"
+    "@kungal/editor-core": "0.19.0"
   },
   "peerDependencies": {
     "@codemirror/lang-markdown": "^6.0.0",
@@ -80,7 +80,7 @@
     "vite": "^8.0.16",
     "vue": "^3.5.35",
     "vue-tsc": "^3.3.3",
-    "@kungal/editor-core": "0.17.0"
+    "@kungal/editor-core": "0.19.0"
   },
   "scripts": {
     "build": "vite build && vue-tsc -p tsconfig.build.json",