@dou-ui/editor 0.0.0-stage → 0.1.0-alpha.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 daidr
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,11 @@
-# Temporary Holding Version
+# @dou-ui/editor
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+[DouUI](https://github.com/daidr/dou-ui) 的块编辑器：文档由可以转换、拖动、嵌套的块组成，支持表格、评论、历史版本与协同编辑。
+
+```sh
+bun add @dou-ui/editor dou-ui @dou-ui/code
+```
+
+用法见 [文档](https://ui.daidr.me/editor/)。
+
+许可证：MIT

package/dist/catalog.js

@@ -0,0 +1,18 @@
+import { labelOf } from "./core/extension.js";
+// src/catalog.ts
+/** Options whose label, key or keywords match the query (case-insensitive). */
+function filterOptions(options, query, messages) {
+	const needle = query.trim().toLowerCase();
+	if (!needle) return options;
+	return options.filter((option) => {
+		return labelOf(option.label, messages).toLowerCase().includes(needle) || option.key.toLowerCase().includes(needle) || (option.keywords ?? []).some((word) => word.startsWith(needle));
+	});
+}
+/** Whether an option describes the block as it is now: same type, same option props. */
+function isCurrent(option, type, props) {
+	if (option.type !== type) return false;
+	return Object.entries(option.props ?? {}).every(([name, value]) => props[name] === value);
+}
+export { filterOptions, isCurrent };
+
+//# sourceMappingURL=catalog.js.map

package/dist/catalog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog.js","names":[],"sources":["../src/catalog.ts"],"sourcesContent":["import { labelOf, type BlockOption } from './core/extension'\nimport type { BlockProps } from './core/model'\nimport type { EditorMessages } from './locale'\n\n/** Options whose label, key or keywords match the query (case-insensitive). */\nexport function filterOptions(options: BlockOption[], query: string, messages: EditorMessages) {\n  const needle = query.trim().toLowerCase()\n  if (!needle) return options\n  return options.filter((option) => {\n    const label = labelOf(option.label, messages).toLowerCase()\n    return (\n      label.includes(needle) ||\n      option.key.toLowerCase().includes(needle) ||\n      (option.keywords ?? []).some((word) => word.startsWith(needle))\n    )\n  })\n}\n\n/** Whether an option describes the block as it is now: same type, same option props. */\nexport function isCurrent(option: BlockOption, type: string, props: BlockProps): boolean {\n  if (option.type !== type) return false\n  return Object.entries(option.props ?? {}).every(([name, value]) => props[name] === value)\n}\n\nexport type { BlockOption }\n"],"mappings":";;;AAKA,SAAgB,cAAc,SAAwB,OAAe,UAA0B;CAC7F,MAAM,SAAS,MAAM,KAAK,CAAC,CAAC,YAAY;CACxC,IAAI,CAAC,QAAQ,OAAO;CACpB,OAAO,QAAQ,QAAQ,WAAW;EAEhC,OADc,QAAQ,OAAO,OAAO,QAAQ,CAAC,CAAC,YAE5C,CAAA,CAAM,SAAS,MAAM,KACrB,OAAO,IAAI,YAAY,CAAC,CAAC,SAAS,MAAM,MACvC,OAAO,YAAY,CAAC,EAAA,CAAG,MAAM,SAAS,KAAK,WAAW,MAAM,CAAC;CAElE,CAAC;AACH;;AAGA,SAAgB,UAAU,QAAqB,MAAc,OAA4B;CACvF,IAAI,OAAO,SAAS,MAAM,OAAO;CACjC,OAAO,OAAO,QAAQ,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,WAAW,MAAM,UAAU,KAAK;AAC1F"}

package/dist/code/code-editor-block.js

@@ -0,0 +1,6 @@
+import code_editor_block_vue_vue_type_script_setup_true_lang_default from "./code-editor-block.vue_vue_type_script_setup_true_lang.js";
+// src/code/code-editor-block.vue
+var code_editor_block_default = code_editor_block_vue_vue_type_script_setup_true_lang_default;
+export { code_editor_block_default as default };
+
+//# sourceMappingURL=code-editor-block.js.map

package/dist/code/code-editor-block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-editor-block.js","names":["_sfc_main"],"sources":["../../src/code/code-editor-block.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DouCodeEditor, type CodeExtension } from '@dou-ui/code'\nimport { ChevronDownIcon } from '@dou-ui/icons'\nimport {\n  DouCopyButton,\n  DouDropdown,\n  DouDropdownItem,\n  DouDropdownRadioGroup,\n  useGlobalConfig,\n} from 'dou-ui'\nimport type { EditorView } from 'prosemirror-view'\nimport { computed, shallowRef } from 'vue'\nimport { useEditor } from '../editor'\nimport { findCodeLanguage } from './languages'\nimport type { CodeEditorViewOptions, CodeEditorViewState } from './types'\n\nconst props = defineProps<{\n  state: CodeEditorViewState\n  options: CodeEditorViewOptions\n  extensions: CodeExtension[]\n  view: EditorView\n  updateProps: (props: Record<string, unknown>) => void\n}>()\nconst emit = defineEmits<{ focus: [] }>()\n\nconst { messages } = useEditor()\nconst config = useGlobalConfig()\nconst editor = shallowRef<InstanceType<typeof DouCodeEditor>>()\n\nconst value = computed(() => String(props.state.block.props.language ?? ''))\nconst entry = computed(() => findCodeLanguage(props.options.languages, value.value))\n// a language the picker doesn't have (pasted, or set in code) still shows by its name\nconst choices = computed(() => {\n  const list = [\n    { value: '', label: messages.value.codeBlock.plainText },\n    ...props.options.languages.map((item) => ({\n      value: item.language.name,\n      label: item.label,\n    })),\n  ]\n  if (value.value && !entry.value) list.push({ value: value.value, label: value.value })\n  return list\n})\nconst picked = computed(() => entry.value?.language.name ?? value.value)\nconst label = computed(() => entry.value?.label ?? value.value)\nconst ariaLabel = computed(() =>\n  label.value ? `${messages.value.types.codeBlock} ${label.value}` : messages.value.types.codeBlock,\n)\n\nfunction choose(next: unknown) {\n  props.updateProps({ language: String(next ?? '') })\n  editor.value?.focus()\n}\n\n// read when the button is pressed: the code changes as it is edited\nconst code = () => editor.value?.doc.toString() ?? props.state.text\n</script>\n\n<template>\n  <div class=\"dou-editor-code__bar\">\n    <DouDropdown v-if=\"state.editable\" placement=\"bottom-end\">\n      <button type=\"button\" class=\"dou-editor-code__language\" :title=\"messages.codeBlock.language\">\n        {{ label || messages.codeBlock.plainText }}\n        <ChevronDownIcon />\n      </button>\n      <template #menu>\n        <DouDropdownRadioGroup :model-value=\"picked\" @update:model-value=\"choose\">\n          <DouDropdownItem v-for=\"item in choices\" :key=\"item.value\" :value=\"item.value\">\n            {{ item.label }}\n          </DouDropdownItem>\n        </DouDropdownRadioGroup>\n      </template>\n    </DouDropdown>\n    <span v-else-if=\"label\" class=\"dou-editor-code__language is-static\">{{ label }}</span>\n    <DouCopyButton :text=\"code\" size=\"sm\" />\n  </div>\n  <DouCodeEditor\n    ref=\"editor\"\n    class=\"dou-editor-code__editor\"\n    :model-value=\"state.text\"\n    :language=\"entry?.language ?? null\"\n    :readonly=\"!state.editable\"\n    :line-numbers=\"options.lineNumbers ?? false\"\n    :gutter=\"options.lineNumbers ?? false\"\n    :wrap=\"options.wrap ?? false\"\n    :tab-size=\"options.tabSize ?? 2\"\n    :tab-indents=\"true\"\n    :extensions=\"extensions\"\n    :teleport=\"config.teleport || 'body'\"\n    :aria-label=\"ariaLabel\"\n    @focus=\"emit('focus')\"\n  />\n</template>\n"],"mappings":""}

package/dist/code/code-editor-block.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,116 @@
+import { useEditor } from "../editor.js";
+import { findCodeLanguage } from "./languages.js";
+import { DouCopyButton, DouDropdown, DouDropdownItem, DouDropdownRadioGroup, useGlobalConfig } from "dou-ui";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, renderList, shallowRef, toDisplayString, unref, withCtx } from "vue";
+import { ChevronDownIcon } from "@dou-ui/icons";
+import { DouCodeEditor } from "@dou-ui/code";
+// src/code/code-editor-block.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "dou-editor-code__bar" };
+var _hoisted_2 = ["title"];
+var _hoisted_3 = {
+	key: 1,
+	class: "dou-editor-code__language is-static"
+};
+var code_editor_block_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "code-editor-block",
+	props: {
+		state: {},
+		options: {},
+		extensions: {},
+		view: {},
+		updateProps: { type: Function }
+	},
+	emits: ["focus"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { messages } = useEditor();
+		const config = useGlobalConfig();
+		const editor = shallowRef();
+		const value = computed(() => String(props.state.block.props.language ?? ""));
+		const entry = computed(() => findCodeLanguage(props.options.languages, value.value));
+		const choices = computed(() => {
+			const list = [{
+				value: "",
+				label: messages.value.codeBlock.plainText
+			}, ...props.options.languages.map((item) => ({
+				value: item.language.name,
+				label: item.label
+			}))];
+			if (value.value && !entry.value) list.push({
+				value: value.value,
+				label: value.value
+			});
+			return list;
+		});
+		const picked = computed(() => entry.value?.language.name ?? value.value);
+		const label = computed(() => entry.value?.label ?? value.value);
+		const ariaLabel = computed(() => label.value ? `${messages.value.types.codeBlock} ${label.value}` : messages.value.types.codeBlock);
+		function choose(next) {
+			props.updateProps({ language: String(next ?? "") });
+			editor.value?.focus();
+		}
+		const code = () => editor.value?.doc.toString() ?? props.state.text;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createElementVNode("div", _hoisted_1, [__props.state.editable ? (openBlock(), createBlock(unref(DouDropdown), {
+				key: 0,
+				placement: "bottom-end"
+			}, {
+				menu: withCtx(() => [createVNode(unref(DouDropdownRadioGroup), {
+					"model-value": picked.value,
+					"onUpdate:modelValue": choose
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(choices.value, (item) => {
+						return openBlock(), createBlock(unref(DouDropdownItem), {
+							key: item.value,
+							value: item.value
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1)]),
+							_: 2
+						}, 1032, ["value"]);
+					}), 128))]),
+					_: 1
+				}, 8, ["model-value"])]),
+				default: withCtx(() => [createElementVNode("button", {
+					type: "button",
+					class: "dou-editor-code__language",
+					title: unref(messages).codeBlock.language
+				}, [createTextVNode(toDisplayString(label.value || unref(messages).codeBlock.plainText) + " ", 1), createVNode(unref(ChevronDownIcon))], 8, _hoisted_2)]),
+				_: 1
+			})) : label.value ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(label.value), 1)) : createCommentVNode("", true), createVNode(unref(DouCopyButton), {
+				text: code,
+				size: "sm"
+			})]), createVNode(unref(DouCodeEditor), {
+				ref_key: "editor",
+				ref: editor,
+				class: "dou-editor-code__editor",
+				"model-value": __props.state.text,
+				language: entry.value?.language ?? null,
+				readonly: !__props.state.editable,
+				"line-numbers": __props.options.lineNumbers ?? false,
+				gutter: __props.options.lineNumbers ?? false,
+				wrap: __props.options.wrap ?? false,
+				"tab-size": __props.options.tabSize ?? 2,
+				"tab-indents": true,
+				extensions: __props.extensions,
+				teleport: unref(config).teleport || "body",
+				"aria-label": ariaLabel.value,
+				onFocus: _cache[0] || (_cache[0] = ($event) => emit("focus"))
+			}, null, 8, [
+				"model-value",
+				"language",
+				"readonly",
+				"line-numbers",
+				"gutter",
+				"wrap",
+				"tab-size",
+				"extensions",
+				"teleport",
+				"aria-label"
+			])], 64);
+		};
+	}
+});
+export { code_editor_block_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=code-editor-block.vue_vue_type_script_setup_true_lang.js.map

package/dist/code/code-editor-block.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-editor-block.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_createElementVNode","_createBlock","_unref","_withCtx","_createVNode","_renderList","_createTextVNode","_toDisplayString","_createCommentVNode"],"sources":["../../src/code/code-editor-block.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DouCodeEditor, type CodeExtension } from '@dou-ui/code'\nimport { ChevronDownIcon } from '@dou-ui/icons'\nimport {\n  DouCopyButton,\n  DouDropdown,\n  DouDropdownItem,\n  DouDropdownRadioGroup,\n  useGlobalConfig,\n} from 'dou-ui'\nimport type { EditorView } from 'prosemirror-view'\nimport { computed, shallowRef } from 'vue'\nimport { useEditor } from '../editor'\nimport { findCodeLanguage } from './languages'\nimport type { CodeEditorViewOptions, CodeEditorViewState } from './types'\n\nconst props = defineProps<{\n  state: CodeEditorViewState\n  options: CodeEditorViewOptions\n  extensions: CodeExtension[]\n  view: EditorView\n  updateProps: (props: Record<string, unknown>) => void\n}>()\nconst emit = defineEmits<{ focus: [] }>()\n\nconst { messages } = useEditor()\nconst config = useGlobalConfig()\nconst editor = shallowRef<InstanceType<typeof DouCodeEditor>>()\n\nconst value = computed(() => String(props.state.block.props.language ?? ''))\nconst entry = computed(() => findCodeLanguage(props.options.languages, value.value))\n// a language the picker doesn't have (pasted, or set in code) still shows by its name\nconst choices = computed(() => {\n  const list = [\n    { value: '', label: messages.value.codeBlock.plainText },\n    ...props.options.languages.map((item) => ({\n      value: item.language.name,\n      label: item.label,\n    })),\n  ]\n  if (value.value && !entry.value) list.push({ value: value.value, label: value.value })\n  return list\n})\nconst picked = computed(() => entry.value?.language.name ?? value.value)\nconst label = computed(() => entry.value?.label ?? value.value)\nconst ariaLabel = computed(() =>\n  label.value ? `${messages.value.types.codeBlock} ${label.value}` : messages.value.types.codeBlock,\n)\n\nfunction choose(next: unknown) {\n  props.updateProps({ language: String(next ?? '') })\n  editor.value?.focus()\n}\n\n// read when the button is pressed: the code changes as it is edited\nconst code = () => editor.value?.doc.toString() ?? props.state.text\n</script>\n\n<template>\n  <div class=\"dou-editor-code__bar\">\n    <DouDropdown v-if=\"state.editable\" placement=\"bottom-end\">\n      <button type=\"button\" class=\"dou-editor-code__language\" :title=\"messages.codeBlock.language\">\n        {{ label || messages.codeBlock.plainText }}\n        <ChevronDownIcon />\n      </button>\n      <template #menu>\n        <DouDropdownRadioGroup :model-value=\"picked\" @update:model-value=\"choose\">\n          <DouDropdownItem v-for=\"item in choices\" :key=\"item.value\" :value=\"item.value\">\n            {{ item.label }}\n          </DouDropdownItem>\n        </DouDropdownRadioGroup>\n      </template>\n    </DouDropdown>\n    <span v-else-if=\"label\" class=\"dou-editor-code__language is-static\">{{ label }}</span>\n    <DouCopyButton :text=\"code\" size=\"sm\" />\n  </div>\n  <DouCodeEditor\n    ref=\"editor\"\n    class=\"dou-editor-code__editor\"\n    :model-value=\"state.text\"\n    :language=\"entry?.language ?? null\"\n    :readonly=\"!state.editable\"\n    :line-numbers=\"options.lineNumbers ?? false\"\n    :gutter=\"options.lineNumbers ?? false\"\n    :wrap=\"options.wrap ?? false\"\n    :tab-size=\"options.tabSize ?? 2\"\n    :tab-indents=\"true\"\n    :extensions=\"extensions\"\n    :teleport=\"config.teleport || 'body'\"\n    :aria-label=\"ariaLabel\"\n    @focus=\"emit('focus')\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;EAOd,MAAM,OAAO;EAEb,MAAM,EAAE,aAAa,UAAU;EAC/B,MAAM,SAAS,gBAAgB;EAC/B,MAAM,SAAS,WAA+C;EAE9D,MAAM,QAAQ,eAAe,OAAO,MAAM,MAAM,MAAM,MAAM,YAAY,EAAE,CAAC;EAC3E,MAAM,QAAQ,eAAe,iBAAiB,MAAM,QAAQ,WAAW,MAAM,KAAK,CAAC;EAEnF,MAAM,UAAU,eAAe;GAC7B,MAAM,OAAO,CACX;IAAE,OAAO;IAAI,OAAO,SAAS,MAAM,UAAU;GAAU,GACvD,GAAG,MAAM,QAAQ,UAAU,KAAK,UAAU;IACxC,OAAO,KAAK,SAAS;IACrB,OAAO,KAAK;GACd,EAAE,CACJ;GACA,IAAI,MAAM,SAAS,CAAC,MAAM,OAAO,KAAK,KAAK;IAAE,OAAO,MAAM;IAAO,OAAO,MAAM;GAAM,CAAC;GACrF,OAAO;EACT,CAAC;EACD,MAAM,SAAS,eAAe,MAAM,OAAO,SAAS,QAAQ,MAAM,KAAK;EACvE,MAAM,QAAQ,eAAe,MAAM,OAAO,SAAS,MAAM,KAAK;EAC9D,MAAM,YAAY,eAChB,MAAM,QAAQ,GAAG,SAAS,MAAM,MAAM,UAAU,GAAG,MAAM,UAAU,SAAS,MAAM,MAAM,SAC1F;EAEA,SAAS,OAAO,MAAe;GAC7B,MAAM,YAAY,EAAE,UAAU,OAAO,QAAQ,EAAE,EAAE,CAAC;GAClD,OAAO,OAAO,MAAM;EACtB;EAGA,MAAM,aAAa,OAAO,OAAO,IAAI,SAAS,KAAK,MAAM,MAAM;;G,wDAI7DG,mBAgBM,OAhBN,YAgBM,CAfe,QAAA,MAAM,YAAzBH,UAAA,GAAAI,YAYcC,MAAA,WAAA,GAAA;;IAZqB,WAAU;;IAKhC,MAAIC,cAKW,CAJxBC,YAIwBF,MAAA,qBAAA,GAAA;KAJA,eAAa,OAAA;KAAS,uBAAoB;;KAC/C,SAAAC,cAAuB,EAAxCN,UAAA,IAAA,GAAAC,mBAEkBC,UAAA,MAAAM,WAFc,QAAA,QAAR,SAAI;MAA5B,OAAAR,UAAA,GAAAI,YAEkBC,MAAA,eAAA,GAAA;OAFwB,KAAK,KAAK;OAAQ,OAAO,KAAK;;OACtE,SAAAC,cAAgB,CAAbG,gBAAAC,gBAAA,KAAK,KAAK,GAAA,CAAA,C;;;;;;IAPnB,SAAAJ,cAGS,CAHTH,mBAGS,UAAA;KAHD,MAAK;KAAS,OAAM;KAA6B,OAAOE,MAAA,QAAA,CAAQ,CAAC,UAAU;I,IAC9EI,gBAAAC,gBAAA,MAAA,SAASL,MAAA,QAAA,CAAQ,CAAC,UAAU,SAAS,IAAG,KAC3C,CAAA,GAAAE,YAAmBF,MAAA,eAAA,CAAA,C;;G,MAUN,MAAA,SAAjBL,UAAA,GAAAC,mBAAsF,QAAtF,YAAsFS,gBAAf,MAAA,KAAK,GAAA,CAAA,K,8BAC5EH,YAAwCF,MAAA,aAAA,GAAA;IAAxB,MAAM;IAAM,MAAK;G,MAEnCE,YAeEF,MAAA,aAAA,GAAA;IAdI,SAAA;IAAJ,KAAI;IACJ,OAAM;IACL,eAAa,QAAA,MAAM;IACnB,UAAU,MAAA,OAAO,YAAQ;IACzB,UAAQ,CAAG,QAAA,MAAM;IACjB,gBAAc,QAAA,QAAQ,eAAW;IACjC,QAAQ,QAAA,QAAQ,eAAW;IAC3B,MAAM,QAAA,QAAQ,QAAI;IAClB,YAAU,QAAA,QAAQ,WAAO;IACzB,eAAa;IACb,YAAY,QAAA;IACZ,UAAUA,MAAA,MAAA,CAAM,CAAC,YAAQ;IACzB,cAAY,UAAA;IACZ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,OAAA"}

package/dist/code/index.js

@@ -0,0 +1,69 @@
+import { codeBlock } from "../extensions/code-block/index.js";
+import { codeEditorLanguages, findCodeLanguage, toEntry } from "./languages.js";
+import { codeEditorView } from "./view.js";
+import { Selection } from "prosemirror-state";
+// src/code/index.ts
+/**
+* The code block, edited in `@dou-ui/code`'s editor: highlighted as you
+* type, with bracket matching, multiple cursors, search and the language's
+* indentation. The document is the same as with the built-in code block
+* (a `codeBlock` with a `language` prop), and so are HTML and Markdown;
+* undo, collaboration and moving blocks work as for the other blocks.
+*
+* ```ts
+* extensions: [editorKit({ codeBlock: codeEditorBlock() })]
+* ```
+*
+* Needs `@dou-ui/code` and its styles.
+*/
+function codeEditorBlock(options = {}) {
+	const languages = (options.languages ?? codeEditorLanguages).map(toEntry);
+	const base = codeBlock({ languages: languages.map((entry) => ({
+		value: entry.language.name,
+		label: entry.label
+	})) });
+	const spec = base.blocks.codeBlock;
+	return {
+		...base,
+		blocks: { codeBlock: {
+			...spec,
+			component: void 0
+		} },
+		plugins: void 0,
+		componentViews: { codeBlock: (mount) => codeEditorView(mount, {
+			...options,
+			languages
+		}) },
+		keymap: () => ({
+			arrowup: enterCode("up"),
+			arrowleft: enterCode("left"),
+			arrowdown: enterCode("down"),
+			arrowright: enterCode("right")
+		})
+	};
+}
+/**
+* The arrows at the edge of a block move into a code block next to it:
+* the browser would step over it, as it does over anything not editable.
+* The cursor goes to the code's last line going up, its first going down.
+*/
+function enterCode(dir) {
+	return (state, dispatch, view) => {
+		if (!view || !state.selection.empty || !view.endOfTextblock(dir)) return false;
+		const forward = dir === "down" || dir === "right";
+		const $head = state.selection.$head;
+		const edge = forward ? $head.after() : $head.before();
+		const next = Selection.near(state.doc.resolve(edge), forward ? 1 : -1);
+		const code = next.$head.parent;
+		if (!code.type.spec.code || next.$head.sameParent($head)) return false;
+		if (dispatch) {
+			const start = next.$head.start();
+			const pos = forward ? start : start + code.content.size;
+			dispatch(state.tr.setSelection(Selection.near(state.doc.resolve(pos))).scrollIntoView());
+		}
+		return true;
+	};
+}
+export { codeEditorBlock, codeEditorLanguages, findCodeLanguage };
+
+//# sourceMappingURL=index.js.map

package/dist/code/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/code/index.ts"],"sourcesContent":["import { Selection, type Command } from 'prosemirror-state'\nimport type { EditorExtension } from '../core/extension'\nimport { codeBlock } from '../extensions/code-block'\nimport { codeEditorLanguages, toEntry } from './languages'\nimport type { CodeEditorBlockOptions } from './types'\nimport { codeEditorView } from './view'\n\nexport { codeEditorLanguages, findCodeLanguage } from './languages'\nexport type { CodeEditorBlockOptions, CodeEditorLanguage } from './types'\n\n/**\n * The code block, edited in `@dou-ui/code`'s editor: highlighted as you\n * type, with bracket matching, multiple cursors, search and the language's\n * indentation. The document is the same as with the built-in code block\n * (a `codeBlock` with a `language` prop), and so are HTML and Markdown;\n * undo, collaboration and moving blocks work as for the other blocks.\n *\n * ```ts\n * extensions: [editorKit({ codeBlock: codeEditorBlock() })]\n * ```\n *\n * Needs `@dou-ui/code` and its styles.\n */\nexport function codeEditorBlock(options: CodeEditorBlockOptions = {}): EditorExtension {\n  const languages = (options.languages ?? codeEditorLanguages).map(toEntry)\n  const base = codeBlock({\n    languages: languages.map((entry) => ({\n      value: entry.language.name,\n      label: entry.label,\n    })),\n  })\n  const spec = base.blocks!.codeBlock!\n  return {\n    ...base,\n    // the spec stays the same, so documents, HTML and Markdown don't change\n    blocks: { codeBlock: { ...spec, component: undefined } },\n    // the code editor colors the code itself\n    plugins: undefined,\n    componentViews: {\n      codeBlock: (mount) => codeEditorView(mount, { ...options, languages }),\n    },\n    keymap: () => ({\n      arrowup: enterCode('up'),\n      arrowleft: enterCode('left'),\n      arrowdown: enterCode('down'),\n      arrowright: enterCode('right'),\n    }),\n  }\n}\n\n/**\n * The arrows at the edge of a block move into a code block next to it:\n * the browser would step over it, as it does over anything not editable.\n * The cursor goes to the code's last line going up, its first going down.\n */\nfunction enterCode(dir: 'up' | 'down' | 'left' | 'right'): Command {\n  return (state, dispatch, view) => {\n    if (!view || !state.selection.empty || !view.endOfTextblock(dir)) return false\n    const forward = dir === 'down' || dir === 'right'\n    const $head = state.selection.$head\n    const edge = forward ? $head.after() : $head.before()\n    const next = Selection.near(state.doc.resolve(edge), forward ? 1 : -1)\n    const code = next.$head.parent\n    if (!code.type.spec.code || next.$head.sameParent($head)) return false\n    if (dispatch) {\n      const start = next.$head.start()\n      const pos = forward ? start : start + code.content.size\n      dispatch(state.tr.setSelection(Selection.near(state.doc.resolve(pos))).scrollIntoView())\n    }\n    return true\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAuBA,SAAgB,gBAAgB,UAAkC,CAAC,GAAoB;CACrF,MAAM,aAAa,QAAQ,aAAa,oBAAA,CAAqB,IAAI,OAAO;CACxE,MAAM,OAAO,UAAU,EACrB,WAAW,UAAU,KAAK,WAAW;EACnC,OAAO,MAAM,SAAS;EACtB,OAAO,MAAM;CACf,EAAE,EACJ,CAAC;CACD,MAAM,OAAO,KAAK,OAAQ;CAC1B,OAAO;EACL,GAAG;EAEH,QAAQ,EAAE,WAAW;GAAE,GAAG;GAAM,WAAW,KAAA;EAAU,EAAE;EAEvD,SAAS,KAAA;EACT,gBAAgB,EACd,YAAY,UAAU,eAAe,OAAO;GAAE,GAAG;GAAS;EAAU,CAAC,EACvE;EACA,eAAe;GACb,SAAS,UAAU,IAAI;GACvB,WAAW,UAAU,MAAM;GAC3B,WAAW,UAAU,MAAM;GAC3B,YAAY,UAAU,OAAO;EAC/B;CACF;AACF;;;;;;AAOA,SAAS,UAAU,KAAgD;CACjE,QAAQ,OAAO,UAAU,SAAS;EAChC,IAAI,CAAC,QAAQ,CAAC,MAAM,UAAU,SAAS,CAAC,KAAK,eAAe,GAAG,GAAG,OAAO;EACzE,MAAM,UAAU,QAAQ,UAAU,QAAQ;EAC1C,MAAM,QAAQ,MAAM,UAAU;EAC9B,MAAM,OAAO,UAAU,MAAM,MAAM,IAAI,MAAM,OAAO;EACpD,MAAM,OAAO,UAAU,KAAK,MAAM,IAAI,QAAQ,IAAI,GAAG,UAAU,IAAI,EAAE;EACrE,MAAM,OAAO,KAAK,MAAM;EACxB,IAAI,CAAC,KAAK,KAAK,KAAK,QAAQ,KAAK,MAAM,WAAW,KAAK,GAAG,OAAO;EACjE,IAAI,UAAU;GACZ,MAAM,QAAQ,KAAK,MAAM,MAAM;GAC/B,MAAM,MAAM,UAAU,QAAQ,QAAQ,KAAK,QAAQ;GACnD,SAAS,MAAM,GAAG,aAAa,UAAU,KAAK,MAAM,IAAI,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC;EACzF;EACA,OAAO;CACT;AACF"}

package/dist/code/languages.js

@@ -0,0 +1,51 @@
+import { css, html, javascript, json, jsx, markdown, python, scss, shell, sql, tsx, typescript, vue, yaml } from "@dou-ui/code";
+// src/code/languages.ts
+var LABELS = {
+	javascript: "JavaScript",
+	typescript: "TypeScript",
+	jsx: "JSX",
+	tsx: "TSX",
+	css: "CSS",
+	scss: "SCSS",
+	json: "JSON",
+	html: "HTML",
+	vue: "Vue",
+	markdown: "Markdown",
+	python: "Python",
+	shell: "Shell",
+	sql: "SQL",
+	yaml: "YAML"
+};
+/** The built-in languages of `@dou-ui/code`, as the picker lists them. */
+var codeEditorLanguages = [
+	javascript,
+	typescript,
+	jsx,
+	tsx,
+	html,
+	vue,
+	css,
+	scss,
+	json,
+	markdown,
+	python,
+	shell,
+	sql,
+	yaml
+].map((language) => ({
+	language,
+	label: LABELS[language.name] ?? language.name
+}));
+var toEntry = (item) => "language" in item ? item : {
+	language: item,
+	label: LABELS[item.name] ?? item.name
+};
+/** The picker entry for a block's `language` prop: by name, then by alias. */
+function findCodeLanguage(languages, value) {
+	const name = value.trim().toLowerCase();
+	if (!name) return null;
+	return languages.find((entry) => entry.language.name === name) ?? languages.find((entry) => entry.language.aliases.includes(name)) ?? null;
+}
+export { codeEditorLanguages, findCodeLanguage, toEntry };
+
+//# sourceMappingURL=languages.js.map

package/dist/code/languages.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"languages.js","names":[],"sources":["../../src/code/languages.ts"],"sourcesContent":["import {\n  css,\n  html,\n  javascript,\n  json,\n  jsx,\n  markdown,\n  python,\n  scss,\n  shell,\n  sql,\n  tsx,\n  typescript,\n  vue,\n  yaml,\n  type CodeLanguage,\n} from '@dou-ui/code'\nimport type { CodeEditorLanguage } from './types'\n\nconst LABELS: Record<string, string> = {\n  javascript: 'JavaScript',\n  typescript: 'TypeScript',\n  jsx: 'JSX',\n  tsx: 'TSX',\n  css: 'CSS',\n  scss: 'SCSS',\n  json: 'JSON',\n  html: 'HTML',\n  vue: 'Vue',\n  markdown: 'Markdown',\n  python: 'Python',\n  shell: 'Shell',\n  sql: 'SQL',\n  yaml: 'YAML',\n}\n\n/** The built-in languages of `@dou-ui/code`, as the picker lists them. */\nexport const codeEditorLanguages: CodeEditorLanguage[] = [\n  javascript,\n  typescript,\n  jsx,\n  tsx,\n  html,\n  vue,\n  css,\n  scss,\n  json,\n  markdown,\n  python,\n  shell,\n  sql,\n  yaml,\n].map((language) => ({\n  language,\n  label: LABELS[language.name] ?? language.name,\n}))\n\nexport const toEntry = (item: CodeLanguage | CodeEditorLanguage): CodeEditorLanguage =>\n  'language' in item ? item : { language: item, label: LABELS[item.name] ?? item.name }\n\n/** The picker entry for a block's `language` prop: by name, then by alias. */\nexport function findCodeLanguage(\n  languages: readonly CodeEditorLanguage[],\n  value: string,\n): CodeEditorLanguage | null {\n  const name = value.trim().toLowerCase()\n  if (!name) return null\n  return (\n    languages.find((entry) => entry.language.name === name) ??\n    languages.find((entry) => entry.language.aliases.includes(name)) ??\n    null\n  )\n}\n"],"mappings":";;AAmBA,IAAM,SAAiC;CACrC,YAAY;CACZ,YAAY;CACZ,KAAK;CACL,KAAK;CACL,KAAK;CACL,MAAM;CACN,MAAM;CACN,MAAM;CACN,KAAK;CACL,UAAU;CACV,QAAQ;CACR,OAAO;CACP,KAAK;CACL,MAAM;AACR;;AAGA,IAAa,sBAA4C;CACvD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,cAAc;CACnB;CACA,OAAO,OAAO,SAAS,SAAS,SAAS;AAC3C,EAAE;AAEF,IAAa,WAAW,SACtB,cAAc,OAAO,OAAO;CAAE,UAAU;CAAM,OAAO,OAAO,KAAK,SAAS,KAAK;AAAK;;AAGtF,SAAgB,iBACd,WACA,OAC2B;CAC3B,MAAM,OAAO,MAAM,KAAK,CAAC,CAAC,YAAY;CACtC,IAAI,CAAC,MAAM,OAAO;CAClB,OACE,UAAU,MAAM,UAAU,MAAM,SAAS,SAAS,IAAI,KACtD,UAAU,MAAM,UAAU,MAAM,SAAS,QAAQ,SAAS,IAAI,CAAC,KAC/D;AAEJ"}

package/dist/code/view.js

@@ -0,0 +1,255 @@
+import { exitCode, setBlockType } from "../core/commands.js";
+import { getBlockSelection, selectCurrentBlocks } from "../core/block-selection.js";
+import { historyCommands } from "../core/editor.js";
+import code_editor_block_default from "./code-editor-block.js";
+import { shallowReactive } from "vue";
+import { Selection, TextSelection } from "prosemirror-state";
+import { defineCodeExtension } from "@dou-ui/code";
+// src/code/view.ts
+/** Marks the changes that came from the document, so they aren't sent back. */
+var FROM_DOC = "editorDocument";
+/** The first and last places that differ between two texts. */
+function diff(a, b) {
+	let start = 0;
+	const min = Math.min(a.length, b.length);
+	while (start < min && a.charCodeAt(start) === b.charCodeAt(start)) start++;
+	let endA = a.length;
+	let endB = b.length;
+	while (endA > start && endB > start && a.charCodeAt(endA - 1) === b.charCodeAt(endB - 1)) {
+		endA--;
+		endB--;
+	}
+	return {
+		from: start,
+		to: endA,
+		insert: b.slice(start, endB)
+	};
+}
+/** One cursor and nothing selected: the arrows may leave the block. */
+var cursor = (target) => {
+	const { ranges, main } = target.state.selection;
+	const range = ranges[main];
+	return ranges.length === 1 && range.anchor === range.head ? range : null;
+};
+/**
+* The code block's node view: the code editor owns the text, and every
+* change it makes goes into the document as a step, with the selection,
+* so undo, collaboration and the other blocks see an ordinary edit. Changes
+* to the document from elsewhere (undo, someone else) come back into the
+* editor the same way.
+*/
+function codeEditorView(mount, options) {
+	return (node, view, getPos) => {
+		let current = node;
+		let ctx = null;
+		let updating = false;
+		let historyAction = null;
+		const idOf = () => {
+			const pos = getPos();
+			if (pos === void 0) return "";
+			return view.state.doc.resolve(pos).parent.attrs.id ?? "";
+		};
+		const state = shallowReactive({
+			block: {
+				id: idOf(),
+				props: { ...node.attrs }
+			},
+			text: node.textContent,
+			editable: view.editable,
+			selected: false
+		});
+		/** The code's changes and selection, into the document. */
+		function forward(changes, c) {
+			const pos = getPos();
+			if (pos === void 0 || updating) return;
+			const start = pos + 1;
+			const tr = view.state.tr;
+			if (changes) {
+				const list = changes.changes;
+				for (let i = list.length - 1; i >= 0; i--) {
+					const change = list[i];
+					if (change.insert) tr.insertText(change.insert, start + change.from, start + change.to);
+					else tr.delete(start + change.from, start + change.to);
+				}
+			}
+			if (c.focused) {
+				const main = c.selection.ranges[c.selection.main];
+				const selection = TextSelection.create(tr.doc, start + main.anchor, start + main.head);
+				if (!selection.eq(view.state.selection)) tr.setSelection(selection);
+			}
+			if (!tr.docChanged && !tr.selectionSet) return;
+			updating = true;
+			try {
+				view.dispatch(tr);
+			} finally {
+				updating = false;
+			}
+		}
+		function runHistory(kind) {
+			const command = historyCommands(view.state)[kind];
+			historyAction = kind;
+			let done;
+			try {
+				done = command(view.state, view.dispatch, view);
+			} finally {
+				historyAction = null;
+			}
+			if (!done) return false;
+			const pos = getPos();
+			const { anchor, head } = view.state.selection;
+			if (pos !== void 0 && ctx && inside(pos, anchor) && inside(pos, head)) {
+				updating = true;
+				try {
+					ctx.select(anchor - pos - 1, head - pos - 1);
+				} finally {
+					updating = false;
+				}
+			} else view.focus();
+			return true;
+		}
+		const inside = (pos, at) => at > pos && at < pos + current.nodeSize;
+		/** The document's undo, so it's one history with the other blocks. */
+		const history = {
+			undo: () => runHistory("undo"),
+			redo: () => runHistory("redo"),
+			canUndo: () => historyCommands(view.state).undo(view.state),
+			canRedo: () => historyCommands(view.state).redo(view.state)
+		};
+		/** Puts the cursor in the block before (`-1`) or after; `false` when there is none. */
+		function leave(dir) {
+			const pos = getPos();
+			if (pos === void 0) return false;
+			const $pos = view.state.doc.resolve(dir < 0 ? pos : pos + current.nodeSize);
+			const selection = Selection.near($pos, dir);
+			if (selection.from > pos && selection.to < pos + current.nodeSize) return false;
+			view.dispatch(view.state.tr.setSelection(selection).scrollIntoView());
+			view.focus();
+			return true;
+		}
+		const keymap = {
+			arrowleft: (target) => cursor(target)?.head === 0 && leave(-1),
+			arrowright: (target) => cursor(target)?.head === target.state.doc.length && leave(1),
+			arrowup: (target) => {
+				const range = cursor(target);
+				if (!range || target.state.doc.lineAt(range.head).number !== 1) return false;
+				return target.moveVertically(range, -1) === 0 && leave(-1);
+			},
+			arrowdown: (target) => {
+				const range = cursor(target);
+				const { doc } = target.state;
+				if (!range || doc.lineAt(range.head).number !== doc.lines) return false;
+				return target.moveVertically(range, 1) === doc.length && leave(1);
+			},
+			backspace: (target) => {
+				if (target.readonly || target.state.doc.length > 0) return false;
+				if (!setBlockType("paragraph")(view.state, view.dispatch)) return false;
+				view.focus();
+				return true;
+			},
+			"mod+enter": (target) => {
+				if (target.readonly || !exitCode(view.state, view.dispatch)) return false;
+				view.focus();
+				return true;
+			},
+			escape: (target) => {
+				if (target.state.selection.ranges.length > 1) return false;
+				if (ctx?.closeSearch()) return true;
+				if (!selectCurrentBlocks(view.state, view.dispatch)) return false;
+				view.focus();
+				return true;
+			}
+		};
+		const bridge = defineCodeExtension({
+			name: "editor-code-block",
+			priority: 1e3,
+			keymap: () => keymap,
+			history: () => history,
+			update(result, c) {
+				if (result.meta[FROM_DOC]) return;
+				forward(result.changes.empty ? null : result.changes, c);
+			},
+			setup(c) {
+				ctx = c;
+				return () => {
+					if (ctx === c) ctx = null;
+				};
+			}
+		});
+		const dom = document.createElement("div");
+		dom.className = "dou-editor__content dou-editor__content--codeBlock dou-editor__content--custom dou-editor-code-editor";
+		dom.dataset.contentType = "codeBlock";
+		const unmount = mount(code_editor_block_default, {
+			state,
+			options,
+			extensions: [bridge, ...options.extensions ?? []],
+			view,
+			updateProps(props) {
+				const pos = getPos();
+				if (pos === void 0) return;
+				const at = view.state.doc.nodeAt(pos);
+				if (!at) return;
+				view.dispatch(view.state.tr.setNodeMarkup(pos, void 0, {
+					...at.attrs,
+					...props
+				}));
+			},
+			onFocus: () => ctx && forward(null, ctx)
+		}, dom);
+		return {
+			dom,
+			update(next) {
+				if (next.type !== current.type) return false;
+				const before = current;
+				current = next;
+				state.block = {
+					id: idOf(),
+					props: { ...next.attrs }
+				};
+				state.editable = view.editable;
+				if (updating || next.textContent === before.textContent) return true;
+				if (!ctx) {
+					state.text = next.textContent;
+					return true;
+				}
+				const change = diff(ctx.doc.toString(), next.textContent);
+				if (change.from === change.to && !change.insert) return true;
+				updating = true;
+				try {
+					ctx.transact((tr) => tr.replace(change.from, change.to, change.insert), {
+						action: historyAction ?? "remote",
+						history: false,
+						scroll: !!historyAction,
+						[FROM_DOC]: true
+					});
+				} finally {
+					updating = false;
+				}
+				return true;
+			},
+			setSelection(anchor, head) {
+				if (!ctx || updating || getBlockSelection(view.state)) return;
+				updating = true;
+				try {
+					ctx.focus();
+					ctx.select(anchor, head);
+				} finally {
+					updating = false;
+				}
+			},
+			selectNode() {
+				state.selected = true;
+			},
+			deselectNode() {
+				state.selected = false;
+			},
+			stopEvent: (event) => !(view.dragging && (event.type === "drop" || event.type.startsWith("drag"))),
+			ignoreMutation: () => true,
+			destroy() {
+				unmount();
+			}
+		};
+	};
+}
+export { codeEditorView };
+
+//# sourceMappingURL=view.js.map

package/dist/code/view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.js","names":["CodeEditorBlock"],"sources":["../../src/code/view.ts"],"sourcesContent":["import {\n  defineCodeExtension,\n  type ChangeSet,\n  type CodeCommandTarget,\n  type CodeExtension,\n  type CodeExtensionContext,\n  type CodeHistoryHandler,\n  type CodeKeymap,\n} from '@dou-ui/code'\nimport type { Node as PMNode } from 'prosemirror-model'\nimport { Selection, TextSelection } from 'prosemirror-state'\nimport type { EditorView, NodeView, NodeViewConstructor } from 'prosemirror-view'\nimport { shallowReactive } from 'vue'\nimport { getBlockSelection, selectCurrentBlocks } from '../core/block-selection'\nimport { exitCode, setBlockType } from '../core/commands'\nimport { historyCommands } from '../core/editor'\nimport type { MountComponent } from '../core/extension'\nimport CodeEditorBlock from './code-editor-block.vue'\nimport type { CodeEditorViewOptions, CodeEditorViewState } from './types'\n\n/** Marks the changes that came from the document, so they aren't sent back. */\nconst FROM_DOC = 'editorDocument'\n\n/** The first and last places that differ between two texts. */\nfunction diff(a: string, b: string) {\n  let start = 0\n  const min = Math.min(a.length, b.length)\n  while (start < min && a.charCodeAt(start) === b.charCodeAt(start)) start++\n  let endA = a.length\n  let endB = b.length\n  while (endA > start && endB > start && a.charCodeAt(endA - 1) === b.charCodeAt(endB - 1)) {\n    endA--\n    endB--\n  }\n  return { from: start, to: endA, insert: b.slice(start, endB) }\n}\n\n/** One cursor and nothing selected: the arrows may leave the block. */\nconst cursor = (target: CodeCommandTarget) => {\n  const { ranges, main } = target.state.selection\n  const range = ranges[main]!\n  return ranges.length === 1 && range.anchor === range.head ? range : null\n}\n\n/**\n * The code block's node view: the code editor owns the text, and every\n * change it makes goes into the document as a step, with the selection,\n * so undo, collaboration and the other blocks see an ordinary edit. Changes\n * to the document from elsewhere (undo, someone else) come back into the\n * editor the same way.\n */\nexport function codeEditorView(\n  mount: MountComponent,\n  options: CodeEditorViewOptions,\n): NodeViewConstructor {\n  return (node, view, getPos) => {\n    let current: PMNode = node\n    let ctx: CodeExtensionContext | null = null\n    // set while one side writes to the other, so it doesn't come back\n    let updating = false\n    let historyAction: 'undo' | 'redo' | null = null\n\n    const idOf = () => {\n      const pos = getPos()\n      if (pos === undefined) return ''\n      return (view.state.doc.resolve(pos).parent.attrs.id as string | null) ?? ''\n    }\n    const state = shallowReactive<CodeEditorViewState>({\n      block: { id: idOf(), props: { ...node.attrs } },\n      text: node.textContent,\n      editable: view.editable,\n      selected: false,\n    })\n\n    /** The code's changes and selection, into the document. */\n    function forward(changes: ChangeSet | null, c: CodeExtensionContext) {\n      const pos = getPos()\n      if (pos === undefined || updating) return\n      const start = pos + 1\n      const tr = view.state.tr\n      if (changes) {\n        const list = changes.changes\n        // from the end, so the positions before each change still hold\n        for (let i = list.length - 1; i >= 0; i--) {\n          const change = list[i]!\n          if (change.insert) tr.insertText(change.insert, start + change.from, start + change.to)\n          else tr.delete(start + change.from, start + change.to)\n        }\n      }\n      if (c.focused) {\n        const main = c.selection.ranges[c.selection.main]!\n        const selection = TextSelection.create(tr.doc, start + main.anchor, start + main.head)\n        if (!selection.eq(view.state.selection)) tr.setSelection(selection)\n      }\n      if (!tr.docChanged && !tr.selectionSet) return\n      updating = true\n      try {\n        view.dispatch(tr)\n      } finally {\n        updating = false\n      }\n    }\n\n    function runHistory(kind: 'undo' | 'redo') {\n      const command = historyCommands(view.state)[kind]\n      historyAction = kind\n      let done: boolean\n      try {\n        done = command(view.state, view.dispatch, view)\n      } finally {\n        historyAction = null\n      }\n      if (!done) return false\n      // the step undone may be elsewhere in the document: the cursor goes there\n      const pos = getPos()\n      const { anchor, head } = view.state.selection\n      if (pos !== undefined && ctx && inside(pos, anchor) && inside(pos, head)) {\n        updating = true\n        try {\n          ctx.select(anchor - pos - 1, head - pos - 1)\n        } finally {\n          updating = false\n        }\n      } else view.focus()\n      return true\n    }\n    const inside = (pos: number, at: number) => at > pos && at < pos + current.nodeSize\n\n    /** The document's undo, so it's one history with the other blocks. */\n    const history: CodeHistoryHandler = {\n      undo: () => runHistory('undo'),\n      redo: () => runHistory('redo'),\n      canUndo: () => historyCommands(view.state).undo(view.state),\n      canRedo: () => historyCommands(view.state).redo(view.state),\n    }\n\n    /** Puts the cursor in the block before (`-1`) or after; `false` when there is none. */\n    function leave(dir: -1 | 1) {\n      const pos = getPos()\n      if (pos === undefined) return false\n      const $pos = view.state.doc.resolve(dir < 0 ? pos : pos + current.nodeSize)\n      const selection = Selection.near($pos, dir)\n      if (selection.from > pos && selection.to < pos + current.nodeSize) return false\n      view.dispatch(view.state.tr.setSelection(selection).scrollIntoView())\n      view.focus()\n      return true\n    }\n\n    const keymap: CodeKeymap = {\n      arrowleft: (target) => cursor(target)?.head === 0 && leave(-1),\n      arrowright: (target) => cursor(target)?.head === target.state.doc.length && leave(1),\n      arrowup: (target) => {\n        const range = cursor(target)\n        if (!range || target.state.doc.lineAt(range.head).number !== 1) return false\n        return target.moveVertically(range, -1) === 0 && leave(-1)\n      },\n      arrowdown: (target) => {\n        const range = cursor(target)\n        const { doc } = target.state\n        if (!range || doc.lineAt(range.head).number !== doc.lines) return false\n        return target.moveVertically(range, 1) === doc.length && leave(1)\n      },\n      // Backspace in an empty block turns it into a paragraph, as in the others\n      backspace: (target) => {\n        if (target.readonly || target.state.doc.length > 0) return false\n        if (!setBlockType('paragraph')(view.state, view.dispatch)) return false\n        view.focus()\n        return true\n      },\n      'mod+enter': (target) => {\n        if (target.readonly || !exitCode(view.state, view.dispatch)) return false\n        view.focus()\n        return true\n      },\n      // Escape selects the block, as in the others; after leaving multiple cursors and search\n      escape: (target) => {\n        if (target.state.selection.ranges.length > 1) return false\n        if (ctx?.closeSearch()) return true\n        if (!selectCurrentBlocks(view.state, view.dispatch)) return false\n        view.focus()\n        return true\n      },\n    }\n\n    const bridge: CodeExtension = defineCodeExtension({\n      name: 'editor-code-block',\n      priority: 1000,\n      keymap: () => keymap,\n      history: () => history,\n      update(result, c) {\n        if (result.meta[FROM_DOC]) return\n        forward(result.changes.empty ? null : result.changes, c)\n      },\n      setup(c) {\n        ctx = c\n        return () => {\n          if (ctx === c) ctx = null\n        }\n      },\n    })\n\n    const dom = document.createElement('div')\n    dom.className =\n      'dou-editor__content dou-editor__content--codeBlock dou-editor__content--custom dou-editor-code-editor'\n    dom.dataset.contentType = 'codeBlock'\n    const unmount = mount(\n      CodeEditorBlock,\n      {\n        state,\n        options,\n        extensions: [bridge, ...(options.extensions ?? [])],\n        view,\n        updateProps(props: Record<string, unknown>) {\n          const pos = getPos()\n          if (pos === undefined) return\n          const at = view.state.doc.nodeAt(pos)\n          if (!at) return\n          view.dispatch(\n            view.state.tr.setNodeMarkup(pos, undefined, {\n              ...at.attrs,\n              ...props,\n            }),\n          )\n        },\n        // focusing the editor shows the cursor in the document too\n        onFocus: () => ctx && forward(null, ctx),\n      },\n      dom,\n    )\n\n    const nodeView: NodeView = {\n      dom,\n      update(next) {\n        if (next.type !== current.type) return false\n        const before = current\n        current = next\n        state.block = { id: idOf(), props: { ...next.attrs } }\n        state.editable = view.editable\n        if (updating || next.textContent === before.textContent) return true\n        if (!ctx) {\n          state.text = next.textContent\n          return true\n        }\n        const change = diff(ctx.doc.toString(), next.textContent)\n        if (change.from === change.to && !change.insert) return true\n        updating = true\n        try {\n          ctx.transact((tr) => tr.replace(change.from, change.to, change.insert), {\n            action: historyAction ?? 'remote',\n            history: false,\n            scroll: !!historyAction,\n            [FROM_DOC]: true,\n          })\n        } finally {\n          updating = false\n        }\n        return true\n      },\n      // the document's cursor moved into the block (an arrow key, a click on its edge)\n      setSelection(anchor, head) {\n        // a selection of whole blocks covers this one too: it stays with the document\n        if (!ctx || updating || getBlockSelection(view.state)) return\n        updating = true\n        try {\n          ctx.focus()\n          ctx.select(anchor, head)\n        } finally {\n          updating = false\n        }\n      },\n      selectNode() {\n        state.selected = true\n      },\n      deselectNode() {\n        state.selected = false\n      },\n      // the editor handles its own events; blocks dragged by the handle may still drop here\n      stopEvent: (event) =>\n        !(view.dragging && (event.type === 'drop' || event.type.startsWith('drag'))),\n      ignoreMutation: () => true,\n      destroy() {\n        unmount()\n      },\n    }\n    return nodeView\n  }\n}\n\nexport type { EditorView }\n"],"mappings":"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"}