niuma-ui 2.0.4 → 2.0.9

package/dist/components/code-editor/src/RsCodeEditor.impl.js

@@ -1,40 +1,51 @@
-import { codeEditorLanguageLabel, readDocumentTheme, resolveCodeEditorLanguage, resolveCodeEditorSize, resolveCodeEditorTheme } from "./code-editor-utils.js";
-import { isCodeMirrorLightTheme, resolveCodeMirrorLanguage } from "./code-mirror-lang.js";
+import { useRsI18n } from "../../../composables/useRsI18n.js";
+import { codeEditorLanguageLabel, codeEditorModShortcut, readDocumentTheme, resolveCodeEditorLanguage, resolveCodeEditorSize, resolveCodeEditorTheme, subscribeDocumentTheme } from "./code-editor-utils.js";
+import { resolveCodeMirrorLanguage } from "./code-mirror-lang.js";
 import { diagnosticExtensions, setEditorDiagnostics } from "./code-mirror-diagnostics.js";
+import { isEditorViewAlive } from "./code-mirror-session.js";
 import { codeMirrorIntelExtensions, goToPosition } from "./code-mirror-intel.js";
 import { clearGhostCompletion, codeMirrorGhostExtensions } from "./code-mirror-ghost.js";
 import { codeMirrorCompletionExtensions } from "./code-mirror-completion.js";
 import { codeMirrorInlineEditExtension, extractSurroundingContext, replaceEditorRange } from "./code-mirror-inline-edit.js";
-import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, shallowRef, toDisplayString, useModel, vModelText, watch, withDirectives, withKeys, withModifiers } from "vue";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, shallowRef, toDisplayString, unref, useId, useModel, vModelText, watch, withDirectives, withKeys, withModifiers } from "vue";
 import { basicSetup } from "codemirror";
 import { Compartment, EditorState } from "@codemirror/state";
 import { EditorView, placeholder, tooltips } from "@codemirror/view";
 import { oneDark } from "@codemirror/theme-one-dark";
 //#region src/components/code-editor/src/RsCodeEditor.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = {
+var _hoisted_1 = [
+	"id",
+	"data-rs-theme",
+	"aria-label",
+	"aria-disabled"
+];
+var _hoisted_2 = {
 	key: 0,
 	class: "rs-code-editor__toolbar"
 };
-var _hoisted_2 = { class: "rs-code-editor__body" };
-var _hoisted_3 = {
+var _hoisted_3 = { class: "rs-code-editor__body" };
+var _hoisted_4 = ["aria-labelledby", "aria-busy"];
+var _hoisted_5 = { class: "rs-code-editor__inline-edit-head" };
+var _hoisted_6 = ["id"];
+var _hoisted_7 = { class: "rs-code-editor__inline-preview" };
+var _hoisted_8 = [
+	"placeholder",
+	"disabled",
+	"onKeydown"
+];
+var _hoisted_9 = {
 	key: 0,
-	class: "rs-code-editor__inline-edit"
+	class: "rs-code-editor__inline-error",
+	role: "alert"
 };
-var _hoisted_4 = { class: "rs-code-editor__inline-preview" };
-var _hoisted_5 = ["disabled", "onKeydown"];
-var _hoisted_6 = {
-	key: 0,
-	class: "rs-code-editor__inline-error"
-};
-var _hoisted_7 = { class: "rs-code-editor__inline-actions" };
-var _hoisted_8 = ["disabled"];
-var _hoisted_9 = ["disabled"];
-var _hoisted_10 = {
-	key: 1,
-	class: "rs-code-editor__diagnostics"
-};
-var _hoisted_11 = { key: 0 };
+var _hoisted_10 = { class: "rs-code-editor__inline-actions" };
+var _hoisted_11 = ["disabled"];
+var _hoisted_12 = ["disabled"];
+var _hoisted_13 = ["aria-label"];
+var _hoisted_14 = ["onClick"];
+var _hoisted_15 = { key: 0 };
 var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsCodeEditor",
 	__name: "RsCodeEditor",
 	props: /*@__PURE__*/ mergeModels({
 		language: { default: "plaintext" },
@@ -72,7 +83,17 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		hoverRequest: {},
 		definitionRequest: {},
 		completionRequest: {},
-		inlineEditRequest: {}
+		inlineEditRequest: {},
+		wrap: {
+			type: Boolean,
+			default: true
+		},
+		autofocus: {
+			type: Boolean,
+			default: false
+		},
+		ariaLabel: {},
+		id: {}
 	}, {
 		"modelValue": { default: "" },
 		"modelModifiers": {}
@@ -82,6 +103,8 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		const model = useModel(__props, "modelValue");
 		const emit = __emit;
 		const props = __props;
+		const { t } = useRsI18n();
+		const inlineTitleId = useId();
 		const rootStyle = computed(() => {
 			const style = { height: resolveCodeEditorSize(props.height) };
 			if (props.gutterWidth != null && props.gutterWidth > 0) style["--rs-code-editor-gutter-width"] = `${props.gutterWidth}px`;
@@ -91,15 +114,25 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		const resolvedLanguageLabel = computed(() => codeEditorLanguageLabel(props.language));
 		const documentTheme = ref(readDocumentTheme());
 		const resolvedTheme = computed(() => props.theme === "auto" ? documentTheme.value : resolveCodeEditorTheme(props.theme));
+		/** auto 继承页面；显式 light/dark 在根上写 data-rs-theme，形成主题岛。 */
+		const themeIsland = computed(() => props.theme === "auto" ? void 0 : resolvedTheme.value);
+		const editorLabel = computed(() => props.ariaLabel?.trim() || t("codeEditor.label"));
+		const inlineShortcut = computed(() => codeEditorModShortcut("K"));
 		const editorEl = ref(null);
+		const inlineEditPanelRef = ref(null);
 		const view = shallowRef(null);
 		const editableCompartment = new Compartment();
 		const themeCompartment = new Compartment();
-		let themeObserver = null;
+		const wrapCompartment = new Compartment();
+		const placeholderCompartment = new Compartment();
+		const contentCompartment = new Compartment();
+		let stopTheme = null;
 		let unmounted = false;
 		let syncingFromModel = false;
 		let ghostTimer = null;
 		let initSeq = 0;
+		let didAutofocus = false;
+		let inlineAbort = null;
 		const inlineEditOpen = ref(false);
 		const inlineEditInstruction = ref("");
 		const inlineEditLoading = ref(false);
@@ -107,16 +140,57 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		const inlineEditError = ref("");
 		const inlineEditInputRef = ref(null);
 		let pendingInlineEdit = null;
+		function codeMirrorThemeExts(theme) {
+			return theme === "light" ? [] : [oneDark];
+		}
+		function placeholderExt() {
+			return props.placeholder ? [placeholder(props.placeholder)] : [];
+		}
+		function wrapExt() {
+			return props.wrap ? [EditorView.lineWrapping] : [];
+		}
+		function contentAttributeExt() {
+			const attrs = {
+				"aria-label": editorLabel.value,
+				spellcheck: "false"
+			};
+			if (props.disabled) {
+				attrs["aria-disabled"] = "true";
+				attrs.tabindex = "-1";
+			} else if (props.readonly) attrs["aria-readonly"] = "true";
+			return EditorView.contentAttributes.of(attrs);
+		}
+		function applyChrome() {
+			const current = view.value;
+			if (!isEditorViewAlive(current)) return;
+			const editable = !props.readonly && !props.disabled;
+			current.dispatch({ effects: [editableCompartment.reconfigure(EditorView.editable.of(editable)), contentCompartment.reconfigure(contentAttributeExt())] });
+		}
+		function applyThemeExt() {
+			const current = view.value;
+			if (!isEditorViewAlive(current)) return;
+			current.dispatch({ effects: themeCompartment.reconfigure(codeMirrorThemeExts(resolvedTheme.value)) });
+		}
+		function abortInlineEdit() {
+			inlineAbort?.abort();
+			inlineAbort = null;
+		}
 		function closeInlineEdit() {
+			const wasOpen = inlineEditOpen.value;
+			abortInlineEdit();
 			inlineEditOpen.value = false;
 			inlineEditInstruction.value = "";
 			inlineEditPreview.value = "";
 			inlineEditError.value = "";
+			inlineEditLoading.value = false;
 			pendingInlineEdit = null;
+			if (wasOpen && isEditorViewAlive(view.value) && !props.disabled) view.value.focus();
 		}
 		function onInlineEditTrigger(_view, info) {
 			if (!props.inlineEditRequest || props.readonly || props.disabled) return;
-			if (view.value) clearGhostCompletion(view.value);
+			if (isEditorViewAlive(view.value)) clearGhostCompletion(view.value);
+			abortInlineEdit();
+			inlineEditLoading.value = false;
 			pendingInlineEdit = info;
 			inlineEditPreview.value = info.selection.length > 120 ? `${info.selection.slice(0, 120)}…` : info.selection;
 			inlineEditOpen.value = true;
@@ -127,7 +201,11 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		async function submitInlineEdit() {
 			const range = pendingInlineEdit;
 			const instruction = inlineEditInstruction.value.trim();
-			if (!range || !instruction || !props.inlineEditRequest || !view.value || inlineEditLoading.value) return;
+			if (!range || !instruction || !props.inlineEditRequest || !isEditorViewAlive(view.value) || inlineEditLoading.value) return;
+			abortInlineEdit();
+			const controller = new AbortController();
+			inlineAbort = controller;
+			const signal = controller.signal;
 			inlineEditLoading.value = true;
 			inlineEditError.value = "";
 			try {
@@ -137,18 +215,55 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 					instruction,
 					from: range.from,
 					to: range.to,
-					surroundingContext: extractSurroundingContext(doc, range.from, range.to)
+					surroundingContext: extractSurroundingContext(doc, range.from, range.to),
+					signal
 				});
+				if (signal.aborted || unmounted || !isEditorViewAlive(view.value)) return;
 				if (edited == null) {
-					inlineEditError.value = "未能生成替换代码，请调整指令后重试";
+					inlineEditError.value = t("codeEditor.inlineEditFailed");
 					return;
 				}
 				replaceEditorRange(view.value, range.from, range.to, edited);
 				closeInlineEdit();
+			} catch {
+				if (signal.aborted || unmounted) return;
+				inlineEditError.value = t("codeEditor.inlineEditFailed");
 			} finally {
-				inlineEditLoading.value = false;
+				if (inlineAbort === controller) inlineAbort = null;
+				if (!unmounted && inlineEditOpen.value) inlineEditLoading.value = false;
+			}
+		}
+		function onInlineEditKeydown(event) {
+			if (event.key === "Escape") {
+				event.preventDefault();
+				closeInlineEdit();
+				return;
+			}
+			if (event.key !== "Tab") return;
+			const root = inlineEditPanelRef.value;
+			if (!root) return;
+			const items = [...root.querySelectorAll("input:not(:disabled), button:not(:disabled)")];
+			if (items.length === 0) return;
+			const first = items[0];
+			const last = items[items.length - 1];
+			if (!first || !last) return;
+			const active = document.activeElement;
+			if (event.shiftKey && (active === first || !root.contains(active))) {
+				event.preventDefault();
+				last.focus();
+			} else if (!event.shiftKey && active === last) {
+				event.preventDefault();
+				first.focus();
 			}
 		}
+		function jumpToDiagnostic(diagnostic) {
+			if (!isEditorViewAlive(view.value) || props.disabled) return;
+			if (diagnostic.line == null) {
+				view.value.focus();
+				return;
+			}
+			goToPosition(view.value, diagnostic.line, diagnostic.column ?? 1);
+		}
 		function scheduleGhostCompletion(fn) {
 			if (ghostTimer) clearTimeout(ghostTimer);
 			ghostTimer = setTimeout(fn, 900);
@@ -159,19 +274,11 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 				ghostTimer = null;
 			}
 		}
-		function codeMirrorThemeExts() {
-			return isCodeMirrorLightTheme() ? [] : [oneDark];
-		}
-		function applyDocumentTheme() {
-			documentTheme.value = readDocumentTheme();
-			if (!view.value) return;
-			view.value.dispatch({ effects: themeCompartment.reconfigure(codeMirrorThemeExts()) });
-			view.value.requestMeasure();
-		}
 		async function initEditor() {
 			if (!editorEl.value || unmounted) return;
 			const seq = ++initSeq;
 			const targetEl = editorEl.value;
+			const previous = isEditorViewAlive(view.value) ? view.value.state.selection.main : null;
 			view.value?.destroy();
 			view.value = null;
 			const langExts = await resolveCodeMirrorLanguage(resolvedLanguage.value, { sql: props.sqlConfig });
@@ -181,10 +288,11 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 				doc: model.value,
 				extensions: [
 					basicSetup,
-					...props.embedded ? [tooltips({ parent: document.body })] : [],
-					EditorView.lineWrapping,
+					...props.embedded && typeof document !== "undefined" ? [tooltips({ parent: document.body })] : [],
+					wrapCompartment.of(wrapExt()),
 					editableCompartment.of(EditorView.editable.of(editable)),
-					...props.placeholder ? [placeholder(props.placeholder)] : [],
+					placeholderCompartment.of(placeholderExt()),
+					contentCompartment.of(contentAttributeExt()),
 					...langExts,
 					diagnosticExtensions(),
 					...codeMirrorIntelExtensions(() => ({
@@ -196,7 +304,7 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 					...codeMirrorCompletionExtensions(() => ({ completionRequest: props.completionRequest })),
 					...codeMirrorGhostExtensions(() => ({ completionRequest: props.completionRequest }), scheduleGhostCompletion, cancelGhostCompletionSchedule),
 					...props.inlineEditRequest ? [codeMirrorInlineEditExtension(onInlineEditTrigger)] : [],
-					themeCompartment.of(codeMirrorThemeExts()),
+					themeCompartment.of(codeMirrorThemeExts(resolvedTheme.value)),
 					EditorView.updateListener.of((update) => {
 						if (!update.docChanged || syncingFromModel) return;
 						const next = update.state.doc.toString();
@@ -204,114 +312,173 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 					})
 				]
 			});
-			view.value = new EditorView({
+			if (unmounted || !targetEl.isConnected || seq !== initSeq) return;
+			const created = new EditorView({
 				state,
 				parent: targetEl
 			});
-			setEditorDiagnostics(view.value, props.diagnostics ?? []);
+			view.value = created;
+			if (previous) {
+				const length = created.state.doc.length;
+				const anchor = Math.min(previous.anchor, length);
+				const head = Math.min(previous.head, length);
+				if (anchor !== 0 || head !== 0) created.dispatch({ selection: {
+					anchor,
+					head
+				} });
+			}
+			setEditorDiagnostics(created, props.diagnostics ?? []);
+			if (props.autofocus && !didAutofocus && editable) {
+				didAutofocus = true;
+				created.focus();
+			}
 			emit("ready");
 		}
 		onMounted(() => {
 			unmounted = false;
 			initEditor();
-			themeObserver = new MutationObserver(() => {
-				applyDocumentTheme();
-			});
-			themeObserver.observe(document.documentElement, {
-				attributes: true,
-				attributeFilter: ["data-rs-theme"]
+			stopTheme = subscribeDocumentTheme(() => {
+				documentTheme.value = readDocumentTheme();
 			});
 		});
 		onUnmounted(() => {
 			unmounted = true;
-			if (ghostTimer) clearTimeout(ghostTimer);
+			initSeq += 1;
+			abortInlineEdit();
+			cancelGhostCompletionSchedule();
+			stopTheme?.();
+			stopTheme = null;
 			view.value?.destroy();
 			view.value = null;
-			themeObserver?.disconnect();
-			themeObserver = null;
 		});
-		watch(() => props.language, () => {
+		watch(() => [
+			props.language,
+			Boolean(props.inlineEditRequest),
+			resolvedLanguage.value === "sql" ? props.sqlConfig : null
+		], () => {
 			initEditor();
+		}, { deep: true });
+		watch(resolvedTheme, () => {
+			applyThemeExt();
 		});
-		watch(() => props.inlineEditRequest, () => {
-			initEditor();
+		watch(() => props.wrap, () => {
+			const current = view.value;
+			if (!isEditorViewAlive(current)) return;
+			current.dispatch({ effects: wrapCompartment.reconfigure(wrapExt()) });
+		});
+		watch(() => props.placeholder, () => {
+			const current = view.value;
+			if (!isEditorViewAlive(current)) return;
+			current.dispatch({ effects: placeholderCompartment.reconfigure(placeholderExt()) });
+		});
+		watch(() => [
+			props.readonly,
+			props.disabled,
+			editorLabel.value
+		], () => {
+			applyChrome();
 		});
-		watch(() => props.sqlConfig, () => {
-			if (resolvedLanguage.value === "sql") initEditor();
-		}, { deep: true });
 		watch(() => model.value, (newCode) => {
-			if (!view.value) return;
+			if (!isEditorViewAlive(view.value)) return;
 			if (view.value.state.doc.toString() === newCode) return;
 			syncingFromModel = true;
-			if (view.value) clearGhostCompletion(view.value);
-			view.value.dispatch({ changes: {
-				from: 0,
-				to: view.value.state.doc.length,
-				insert: newCode
-			} });
-			syncingFromModel = false;
-		});
-		watch(() => [props.readonly, props.disabled], ([readonly, disabled]) => {
-			if (!view.value) return;
-			const editable = !readonly && !disabled;
-			view.value.dispatch({ effects: editableCompartment.reconfigure(EditorView.editable.of(editable)) });
+			try {
+				clearGhostCompletion(view.value);
+				view.value.dispatch({ changes: {
+					from: 0,
+					to: view.value.state.doc.length,
+					insert: newCode
+				} });
+			} finally {
+				syncingFromModel = false;
+			}
 		});
 		watch(() => props.diagnostics, (diags) => {
-			if (!view.value) return;
+			if (!isEditorViewAlive(view.value)) return;
 			setEditorDiagnostics(view.value, diags ?? []);
 		}, { deep: true });
-		__expose({ goToPosition(line, column = 1) {
-			if (!view.value) return;
-			goToPosition(view.value, line, column);
-		} });
+		__expose({
+			goToPosition(line, column = 1) {
+				if (!isEditorViewAlive(view.value)) return;
+				goToPosition(view.value, line, column);
+			},
+			focus() {
+				if (!isEditorViewAlive(view.value) || props.disabled) return;
+				view.value.focus();
+			}
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
+				id: __props.id,
 				class: normalizeClass(["rs-code-editor", [`rs-code-editor--${resolvedTheme.value}`, {
 					"rs-code-editor--embedded": __props.embedded,
 					"rs-code-editor--square": !__props.rounded || __props.embedded,
 					"rs-code-editor--no-fold": !__props.foldGutter,
 					"rs-code-editor--gutter-fixed": __props.gutterWidth != null && __props.gutterWidth > 0
 				}]]),
-				style: normalizeStyle(rootStyle.value)
+				style: normalizeStyle(rootStyle.value),
+				"data-rs-theme": themeIsland.value,
+				role: "group",
+				"aria-label": editorLabel.value,
+				"aria-disabled": __props.disabled ? "true" : void 0
 			}, [
-				__props.showToolbar ? (openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("span", null, toDisplayString(resolvedLanguageLabel.value), 1), renderSlot(_ctx.$slots, "toolbar", {}, void 0, true)])) : createCommentVNode("", true),
-				createElementVNode("div", _hoisted_2, [createElementVNode("div", {
+				__props.showToolbar ? (openBlock(), createElementBlock("div", _hoisted_2, [createElementVNode("span", null, toDisplayString(resolvedLanguageLabel.value), 1), renderSlot(_ctx.$slots, "toolbar", {}, void 0, true)])) : createCommentVNode("", true),
+				createElementVNode("div", _hoisted_3, [createElementVNode("div", {
 					ref_key: "editorEl",
 					ref: editorEl,
 					class: normalizeClass(["rs-code-editor__surface", { "rs-code-editor__surface--disabled": __props.disabled }])
-				}, null, 2), inlineEditOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
-					_cache[1] || (_cache[1] = createElementVNode("div", { class: "rs-code-editor__inline-edit-head" }, [createElementVNode("span", null, "Inline Edit"), createElementVNode("kbd", null, "Ctrl+K")], -1)),
-					createElementVNode("p", _hoisted_4, toDisplayString(inlineEditPreview.value), 1),
+				}, null, 2), inlineEditOpen.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					ref_key: "inlineEditPanelRef",
+					ref: inlineEditPanelRef,
+					class: "rs-code-editor__inline-edit",
+					role: "dialog",
+					"aria-modal": "false",
+					"aria-labelledby": unref(inlineTitleId),
+					"aria-keyshortcuts": "Control+K Meta+K",
+					"aria-busy": inlineEditLoading.value ? "true" : void 0,
+					onKeydown: onInlineEditKeydown
+				}, [
+					createElementVNode("div", _hoisted_5, [createElementVNode("span", { id: unref(inlineTitleId) }, toDisplayString(unref(t)("codeEditor.inlineEdit")), 9, _hoisted_6), createElementVNode("kbd", null, toDisplayString(inlineShortcut.value), 1)]),
+					createElementVNode("p", _hoisted_7, toDisplayString(inlineEditPreview.value), 1),
 					withDirectives(createElementVNode("input", {
 						ref_key: "inlineEditInputRef",
 						ref: inlineEditInputRef,
 						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineEditInstruction.value = $event),
 						class: "rs-code-editor__inline-input",
 						type: "text",
-						placeholder: "描述要如何修改选区…",
+						placeholder: unref(t)("codeEditor.inlineEditPlaceholder"),
 						disabled: inlineEditLoading.value,
-						onKeydown: [withKeys(withModifiers(submitInlineEdit, ["prevent"]), ["enter"]), withKeys(withModifiers(closeInlineEdit, ["prevent"]), ["esc"])]
-					}, null, 40, _hoisted_5), [[vModelText, inlineEditInstruction.value]]),
-					inlineEditError.value ? (openBlock(), createElementBlock("p", _hoisted_6, toDisplayString(inlineEditError.value), 1)) : createCommentVNode("", true),
-					createElementVNode("div", _hoisted_7, [createElementVNode("button", {
+						onKeydown: withKeys(withModifiers(submitInlineEdit, ["prevent"]), ["enter"])
+					}, null, 40, _hoisted_8), [[vModelText, inlineEditInstruction.value]]),
+					inlineEditError.value ? (openBlock(), createElementBlock("p", _hoisted_9, toDisplayString(inlineEditError.value), 1)) : createCommentVNode("", true),
+					createElementVNode("div", _hoisted_10, [createElementVNode("button", {
 						type: "button",
 						class: "rs-code-editor__inline-btn",
 						disabled: inlineEditLoading.value,
 						onClick: closeInlineEdit
-					}, " 取消 ", 8, _hoisted_8), createElementVNode("button", {
+					}, toDisplayString(unref(t)("common.cancel")), 9, _hoisted_11), createElementVNode("button", {
 						type: "button",
 						class: "rs-code-editor__inline-btn rs-code-editor__inline-btn--primary",
 						disabled: inlineEditLoading.value || !inlineEditInstruction.value.trim(),
 						onClick: submitInlineEdit
-					}, toDisplayString(inlineEditLoading.value ? "生成中…" : "应用"), 9, _hoisted_9)])
-				])) : createCommentVNode("", true)]),
-				__props.diagnostics.length ? (openBlock(), createElementBlock("ul", _hoisted_10, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.diagnostics, (diagnostic, index) => {
+					}, toDisplayString(inlineEditLoading.value ? unref(t)("codeEditor.inlineEditApplying") : unref(t)("codeEditor.inlineEditApply")), 9, _hoisted_12)])
+				], 40, _hoisted_4)) : createCommentVNode("", true)]),
+				__props.diagnostics.length ? (openBlock(), createElementBlock("ul", {
+					key: 1,
+					class: "rs-code-editor__diagnostics",
+					"aria-label": unref(t)("codeEditor.diagnostics")
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.diagnostics, (diagnostic, index) => {
 					return openBlock(), createElementBlock("li", {
 						key: index,
 						class: normalizeClass(`rs-code-editor__diagnostic--${diagnostic.severity ?? "error"}`)
-					}, [diagnostic.line ? (openBlock(), createElementBlock("span", _hoisted_11, toDisplayString(diagnostic.line) + ":" + toDisplayString(diagnostic.column ?? 1), 1)) : createCommentVNode("", true), createTextVNode(" " + toDisplayString(diagnostic.message), 1)], 2);
-				}), 128))])) : createCommentVNode("", true)
-			], 6);
+					}, [createElementVNode("button", {
+						type: "button",
+						class: "rs-code-editor__diagnostic-btn",
+						onClick: ($event) => jumpToDiagnostic(diagnostic)
+					}, [diagnostic.line ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(diagnostic.line) + ":" + toDisplayString(diagnostic.column ?? 1), 1)) : createCommentVNode("", true), createTextVNode(" " + toDisplayString(diagnostic.message), 1)], 8, _hoisted_14)], 2);
+				}), 128))], 8, _hoisted_13)) : createCommentVNode("", true)
+			], 14, _hoisted_1);
 		};
 	}
 });

package/dist/components/code-editor/src/RsCodeEditor.js

@@ -3,6 +3,6 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import RsCodeEditor_vue_vue_type_script_setup_true_lang_default from "./RsCodeEditor.impl.js";
 
 //#region src/components/code-editor/src/RsCodeEditor.vue
-var RsCodeEditor_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsCodeEditor_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-05d9a5e1"]]);
+var RsCodeEditor_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsCodeEditor_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3ab77c7a"]]);
 //#endregion
 export { RsCodeEditor_default as default };

package/dist/components/code-editor/src/code-editor-utils.d.ts

@@ -31,3 +31,18 @@ export declare function codeEditorLanguageLabel(language?: string): string;
 export declare function readDocumentTheme(): RsResolvedCodeEditorTheme;
 export declare function resolveCodeEditorTheme(theme?: RsCodeEditorTheme): RsResolvedCodeEditorTheme;
 export declare function resolveCodeEditorSize(height?: number | string): string;
+/** 修饰键文案。Mac 显示 ⌘，其它显示 Ctrl。无 navigator 时按 Ctrl。 */
+export declare function codeEditorModShortcut(key: string): string;
+type ThemeListener = () => void;
+/**
+ * 多个编辑器共用一个 MutationObserver。最后一个退订时断开。
+ * 无 document / MutationObserver（SSR）时返回空操作。
+ */
+export declare function subscribeDocumentTheme(listener: ThemeListener): () => void;
+export interface RsCodeEditorExpose {
+    /** 跳到 1-based 行列并聚焦。编辑器未就绪时无操作。 */
+    goToPosition: (line: number, column?: number) => void;
+    /** 聚焦编辑区。禁用或未就绪时无操作。 */
+    focus: () => void;
+}
+export {};

package/dist/components/code-editor/src/code-editor-utils.js

@@ -60,5 +60,40 @@ function resolveCodeEditorSize(height) {
 	if (height === void 0) return "20rem";
 	return typeof height === "number" ? `${height}px` : height;
 }
+/** 修饰键文案。Mac 显示 ⌘，其它显示 Ctrl。无 navigator 时按 Ctrl。 */
+function codeEditorModShortcut(key) {
+	if (typeof navigator === "undefined") return `Ctrl+${key}`;
+	const platform = `${navigator.platform || ""} ${navigator.userAgent || ""}`;
+	return /Mac|iPhone|iPad|iPod/i.test(platform) ? `⌘${key}` : `Ctrl+${key}`;
+}
+var themeListeners = /* @__PURE__ */ new Set();
+var themeObserver = null;
+/**
+* 多个编辑器共用一个 MutationObserver。最后一个退订时断开。
+* 无 document / MutationObserver（SSR）时返回空操作。
+*/
+function subscribeDocumentTheme(listener) {
+	if (typeof document === "undefined" || typeof MutationObserver === "undefined") return () => {};
+	themeListeners.add(listener);
+	if (!themeObserver) {
+		themeObserver = new MutationObserver(() => {
+			for (const fn of themeListeners) fn();
+		});
+		themeObserver.observe(document.documentElement, {
+			attributes: true,
+			attributeFilter: ["data-rs-theme"]
+		});
+	}
+	let active = true;
+	return () => {
+		if (!active) return;
+		active = false;
+		themeListeners.delete(listener);
+		if (themeListeners.size === 0 && themeObserver) {
+			themeObserver.disconnect();
+			themeObserver = null;
+		}
+	};
+}
 //#endregion
-export { codeEditorLanguageLabel, readDocumentTheme, resolveCodeEditorLanguage, resolveCodeEditorSize, resolveCodeEditorTheme };
+export { codeEditorLanguageLabel, codeEditorModShortcut, readDocumentTheme, resolveCodeEditorLanguage, resolveCodeEditorSize, resolveCodeEditorTheme, subscribeDocumentTheme };

package/dist/components/code-editor/src/code-mirror-completion.d.ts

@@ -1,5 +1,5 @@
 import type { Extension } from '@codemirror/state';
 export interface CodeMirrorCompletionHandlers {
-    completionRequest?: (prefix: string, suffix: string, line: number, column: number) => Promise<string | null>;
+    completionRequest?: (prefix: string, suffix: string, line: number, column: number, signal?: AbortSignal) => Promise<string | null>;
 }
 export declare function codeMirrorCompletionExtensions(handlers: () => CodeMirrorCompletionHandlers): Extension[];

package/dist/components/code-editor/src/code-mirror-completion.js

@@ -1,21 +1,24 @@
+import { editorAbortSession, isEditorViewAlive } from "./code-mirror-session.js";
 import { posToLineColumn } from "./code-mirror-intel.js";
 import { clearGhostCompletion, setGhostCompletion } from "./code-mirror-ghost.js";
 import { keymap } from "@codemirror/view";
 //#region src/components/code-editor/src/code-mirror-completion.ts
 function codeMirrorCompletionExtensions(handlers) {
-	return [keymap.of([{
+	const session = editorAbortSession();
+	return [session, keymap.of([{
 		key: "Ctrl-Space",
 		mac: "Cmd-Space",
 		run: (view) => {
 			const h = handlers();
-			if (!h.completionRequest) return false;
+			if (!h.completionRequest || !isEditorViewAlive(view)) return false;
 			clearGhostCompletion(view);
 			const pos = view.state.selection.main.head;
 			const prefix = view.state.doc.sliceString(0, pos);
 			const suffix = view.state.doc.sliceString(pos);
 			const { line, column } = posToLineColumn(view, pos);
-			h.completionRequest(prefix, suffix, line, column).then((text) => {
-				if (!text?.trim()) return;
+			const signal = view.plugin(session)?.nextSignal();
+			Promise.resolve(h.completionRequest(prefix, suffix, line, column, signal)).then((text) => {
+				if (signal?.aborted || !text?.trim() || !isEditorViewAlive(view)) return;
 				const latestPos = view.state.selection.main.head;
 				if (view.state.doc.sliceString(latestPos) !== suffix) return;
 				view.dispatch({
@@ -28,7 +31,7 @@ function codeMirrorCompletionExtensions(handlers) {
 					effects: setGhostCompletion.of(null)
 				});
 				view.focus();
-			});
+			}).catch(() => {});
 			return true;
 		}
 	}])];

package/dist/components/code-editor/src/code-mirror-diagnostics.d.ts

@@ -1,6 +1,5 @@
-import { Compartment } from '@codemirror/state';
+import { StateField } from '@codemirror/state';
 import { EditorView } from '@codemirror/view';
 import type { RsCodeEditorDiagnostic } from './code-editor-utils';
-export declare const diagnosticCompartment: Compartment;
-export declare function diagnosticExtensions(): import("@codemirror/state").Extension;
+export declare function diagnosticExtensions(): StateField<import("@codemirror/view").DecorationSet>[];
 export declare function setEditorDiagnostics(view: EditorView, diags: RsCodeEditorDiagnostic[]): void;