@ecsplico/editor 0.0.0-stage → 1.0.0

package/dist/outline/EditorOutline.js

@@ -0,0 +1,124 @@
+import { useUiKit } from "../vue/kit/use-ui-kit.js";
+import { useEditorI18n } from "../vue/use-editor-i18n.js";
+import { headingOutline, revealBlockInEditor } from "./heading-outline.js";
+import { computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, onScopeDispose, openBlock, ref, shallowRef, toDisplayString, unref, watch, withCtx } from "vue";
+//#region src/outline/EditorOutline.vue
+const _hoisted_1 = { class: "group flex w-full cursor-pointer items-center gap-1.5 rounded-md px-2 py-1 text-sm select-none hover:bg-[color-mix(in_oklab,var(--sk-bg-elevated)_60%,transparent)]" };
+const _hoisted_2 = {
+	key: 1,
+	class: "size-3.5 shrink-0"
+};
+const _hoisted_3 = ["title"];
+const REFRESH_DEBOUNCE_MS = 150;
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	__name: "EditorOutline",
+	props: { editor: {} },
+	setup(__props) {
+		const props = __props;
+		const { Icon: UIcon, Tree: UTree } = useUiKit();
+		const { t } = useEditorI18n();
+		const HEADING_ICONS = {
+			1: "i-lucide-heading-1",
+			2: "i-lucide-heading-2",
+			3: "i-lucide-heading-3",
+			4: "i-lucide-heading-4",
+			5: "i-lucide-heading-5",
+			6: "i-lucide-heading-6"
+		};
+		const nodes = shallowRef([]);
+		let timer;
+		function read(editor) {
+			nodes.value = editor && !editor.isDestroyed ? headingOutline(editor.state.doc, t("outline.untitled")) : [];
+		}
+		watch(() => props.editor, (editor, _previous, onCleanup) => {
+			read(editor);
+			if (!editor) return;
+			const onTransaction = ({ transaction }) => {
+				if (!transaction.docChanged) return;
+				clearTimeout(timer);
+				timer = setTimeout(() => read(editor), REFRESH_DEBOUNCE_MS);
+			};
+			const onDestroy = () => {
+				clearTimeout(timer);
+				nodes.value = [];
+			};
+			editor.on("transaction", onTransaction);
+			editor.on("destroy", onDestroy);
+			onCleanup(() => {
+				clearTimeout(timer);
+				editor.off("transaction", onTransaction);
+				editor.off("destroy", onDestroy);
+			});
+		}, { immediate: true });
+		onScopeDispose(() => clearTimeout(timer));
+		function toItem(node) {
+			return {
+				key: node.key,
+				label: node.text,
+				icon: HEADING_ICONS[node.level] ?? "i-lucide-heading",
+				...node.children.length && { children: node.children.map(toItem) },
+				onSelect: () => {
+					if (props.editor && !props.editor.isDestroyed) revealBlockInEditor(props.editor, node);
+				},
+				onToggle: (event) => event?.preventDefault()
+			};
+		}
+		const items = computed(() => nodes.value.map(toItem));
+		function parentKeys(list, into = []) {
+			for (const item of list) {
+				if (!item.children?.length) continue;
+				into.push(item.key);
+				parentKeys(item.children, into);
+			}
+			return into;
+		}
+		const collapsed = ref([]);
+		const expanded = computed({
+			get: () => parentKeys(items.value).filter((key) => !collapsed.value.includes(key)),
+			set: (open) => {
+				collapsed.value = parentKeys(items.value).filter((key) => !open.includes(key));
+			}
+		});
+		function toggle(event, key) {
+			event.stopPropagation();
+			collapsed.value = collapsed.value.includes(key) ? collapsed.value.filter((k) => k !== key) : [...collapsed.value, key];
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(UTree), {
+				expanded: expanded.value,
+				"onUpdate:expanded": _cache[0] || (_cache[0] = ($event) => expanded.value = $event),
+				items: items.value,
+				"get-key": (item) => item.key,
+				size: "sm",
+				"aria-label": unref(t)("outline.label")
+			}, {
+				"item-wrapper": withCtx(({ item, expanded: isOpen }) => [createElementVNode("div", _hoisted_1, [
+					item.children?.length ? (openBlock(), createBlock(unref(UIcon), {
+						key: 0,
+						name: "i-lucide-chevron-right",
+						class: normalizeClass(["size-3.5 shrink-0 text-[var(--sk-muted)] transition-transform", isOpen && "rotate-90"]),
+						onClick: ($event) => toggle($event, item.key)
+					}, null, 8, ["class", "onClick"])) : (openBlock(), createElementBlock("span", _hoisted_2)),
+					createVNode(unref(UIcon), {
+						name: item.icon,
+						class: "size-4 shrink-0"
+					}, null, 8, ["name"]),
+					createElementVNode("span", {
+						class: "min-w-0 flex-1 truncate",
+						title: item.label
+					}, toDisplayString(item.label), 9, _hoisted_3)
+				])]),
+				_: 1
+			}, 8, [
+				"expanded",
+				"items",
+				"get-key",
+				"aria-label"
+			]);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=EditorOutline.js.map

package/dist/outline/EditorOutline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorOutline.js","names":["_openBlock","_createBlock","_unref","_withCtx","_createElementVNode","_normalizeClass","_createElementBlock","_createVNode","_toDisplayString"],"sources":["../../src/outline/EditorOutline.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useUiKit } from '../vue/kit/use-ui-kit'\nimport type { Editor } from '@tiptap/core'\nimport { computed, onScopeDispose, ref, shallowRef, watch } from 'vue'\nimport { useEditorI18n } from '../vue/use-editor-i18n'\nimport { type HeadingOutlineNode, headingOutline, revealBlockInEditor } from './heading-outline'\n\n/**\n * The heading outline of an editor, placed anywhere on the page: nested headings in a tree, clicking one reveals it in\n * the editor (selection only, the document is never changed). Works on exactly the editor passed in (from the\n * surface's `ready` event); a missing or destroyed editor renders an empty outline.\n */\nconst props = defineProps<{ editor?: Editor }>()\nconst { Icon: UIcon, Tree: UTree } = useUiKit()\nconst { t } = useEditorI18n()\n\ninterface OutlineItem {\n  key: string\n  label: string\n  icon: string\n  children?: OutlineItem[]\n  onSelect: () => void\n  onToggle: (event?: Event) => void\n}\n\nconst REFRESH_DEBOUNCE_MS = 150\n\n// Spelled out (not built from the level) so bundlers that scan source for icon names find them.\nconst HEADING_ICONS: Record<number, string> = {\n  1: 'i-lucide-heading-1',\n  2: 'i-lucide-heading-2',\n  3: 'i-lucide-heading-3',\n  4: 'i-lucide-heading-4',\n  5: 'i-lucide-heading-5',\n  6: 'i-lucide-heading-6',\n}\n\n// Read from the editor on demand (not inside a computed: the editor's state is reactive and would re-run it on every\n// selection change) and refreshed, debounced, when the document changes (also an external `setContent`).\nconst nodes = shallowRef<HeadingOutlineNode[]>([])\nlet timer: ReturnType<typeof setTimeout> | undefined\n\nfunction read(editor: Editor | undefined) {\n  nodes.value = editor && !editor.isDestroyed ? headingOutline(editor.state.doc, t('outline.untitled')) : []\n}\n\nwatch(() => props.editor, (editor, _previous, onCleanup) => {\n  read(editor)\n  if (!editor) return\n  const onTransaction = ({ transaction }: { transaction: { docChanged: boolean } }) => {\n    if (!transaction.docChanged) return\n    clearTimeout(timer)\n    timer = setTimeout(() => read(editor), REFRESH_DEBOUNCE_MS)\n  }\n  const onDestroy = () => {\n    clearTimeout(timer)\n    nodes.value = []\n  }\n  editor.on('transaction', onTransaction)\n  editor.on('destroy', onDestroy)\n  onCleanup(() => {\n    clearTimeout(timer)\n    editor.off('transaction', onTransaction)\n    editor.off('destroy', onDestroy)\n  })\n}, { immediate: true })\nonScopeDispose(() => clearTimeout(timer))\n\nfunction toItem(node: HeadingOutlineNode): OutlineItem {\n  return {\n    key: node.key,\n    label: node.text,\n    icon: HEADING_ICONS[node.level] ?? 'i-lucide-heading',\n    ...(node.children.length && { children: node.children.map(toItem) }),\n    onSelect: () => {\n      if (props.editor && !props.editor.isDestroyed) revealBlockInEditor(props.editor, node)\n    },\n    onToggle: event => event?.preventDefault(), // the chevron toggles, a click reveals\n  }\n}\n\nconst items = computed(() => nodes.value.map(toItem))\n\nfunction parentKeys(list: readonly OutlineItem[], into: string[] = []): string[] {\n  for (const item of list) {\n    if (!item.children?.length) continue\n    into.push(item.key)\n    parentKeys(item.children, into)\n  }\n  return into\n}\n\n// Entries start open: only the ones the user closed are remembered.\nconst collapsed = ref<string[]>([])\nconst expanded = computed({\n  get: () => parentKeys(items.value).filter(key => !collapsed.value.includes(key)),\n  set: (open: string[]) => {\n    collapsed.value = parentKeys(items.value).filter(key => !open.includes(key))\n  },\n})\n\nfunction toggle(event: Event, key: string) {\n  event.stopPropagation()\n  collapsed.value = collapsed.value.includes(key) ? collapsed.value.filter(k => k !== key) : [...collapsed.value, key]\n}\n</script>\n\n<template>\n  <UTree v-model:expanded=\"expanded\" :items=\"items\" :get-key=\"(item: OutlineItem) => item.key\" size=\"sm\" :aria-label=\"t('outline.label')\">\n    <template #item-wrapper=\"{ item, expanded: isOpen }: { item: OutlineItem, expanded: boolean }\">\n      <div class=\"group flex w-full cursor-pointer items-center gap-1.5 rounded-md px-2 py-1 text-sm select-none hover:bg-[color-mix(in_oklab,var(--sk-bg-elevated)_60%,transparent)]\">\n        <UIcon\n          v-if=\"item.children?.length\"\n          name=\"i-lucide-chevron-right\"\n          class=\"size-3.5 shrink-0 text-[var(--sk-muted)] transition-transform\"\n          :class=\"isOpen && 'rotate-90'\"\n          @click=\"toggle($event, item.key)\"\n        />\n        <span v-else class=\"size-3.5 shrink-0\" />\n        <UIcon :name=\"item.icon\" class=\"size-4 shrink-0\" />\n        <span class=\"min-w-0 flex-1 truncate\" :title=\"item.label\">{{ item.label }}</span>\n      </div>\n    </template>\n  </UTree>\n</template>\n"],"mappings":"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"}

package/dist/outline/EditorOutline.vue.d.ts

@@ -0,0 +1,15 @@
+import { Editor } from "@tiptap/core";
+//#region src/outline/EditorOutline.vue.d.ts
+/**
+ * The heading outline of an editor, placed anywhere on the page: nested headings in a tree, clicking one reveals it in
+ * the editor (selection only, the document is never changed). Works on exactly the editor passed in (from the
+ * surface's `ready` event); a missing or destroyed editor renders an empty outline.
+ */
+type __VLS_Props = {
+  editor?: Editor;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default as default };
+//# sourceMappingURL=EditorOutline.vue.d.ts.map

package/dist/outline/heading-outline.d.ts

@@ -0,0 +1,26 @@
+import { Editor } from "@tiptap/core";
+import { Node as Node$1 } from "@tiptap/pm/model";
+//#region src/outline/heading-outline.d.ts
+/** One heading of a document's heading outline. */
+export interface HeadingOutlineNode {
+  /** Block ID, or `pos:<pos>` for a heading without one yet; unique within the document. */
+  key: string;
+  id: string | null;
+  /** Position of the heading in the document it was read from. */
+  pos: number;
+  level: number;
+  text: string;
+  children: HeadingOutlineNode[];
+}
+/** The top-level headings of `doc`, a deeper heading nesting under the nearest shallower one before it; a heading without text is labelled `untitled`. */
+export declare function headingOutline(doc: Node$1, untitled: string): HeadingOutlineNode[];
+/**
+ * Scrolls to the block `node` (found by its ID, else by its position), flashes it and puts the caret into its first
+ * text (a heading's text, a composite's title). The document is not modified.
+ */
+export declare function revealBlockInEditor(editor: Editor, node: {
+  id: string | null;
+  pos: number;
+}): void;
+//#endregion
+//# sourceMappingURL=heading-outline.d.ts.map

package/dist/outline/heading-outline.js

@@ -0,0 +1,46 @@
+import { blockIdOf, findBlockById } from "../core/schema/block-ids.js";
+import { Selection } from "@tiptap/pm/state";
+//#region src/outline/heading-outline.ts
+/** The top-level headings of `doc`, a deeper heading nesting under the nearest shallower one before it; a heading without text is labelled `untitled`. */
+function headingOutline(doc, untitled) {
+	const roots = [];
+	const stack = [];
+	doc.forEach((node, pos) => {
+		if (node.type.name !== "heading") return;
+		const id = blockIdOf(node);
+		const entry = {
+			key: id ?? `pos:${pos}`,
+			id,
+			pos,
+			level: Number(node.attrs.level),
+			text: node.textContent.trim() || untitled,
+			children: []
+		};
+		while (stack.length && stack[stack.length - 1].level >= entry.level) stack.pop();
+		const parent = stack[stack.length - 1];
+		if (parent) parent.children.push(entry);
+		else roots.push(entry);
+		stack.push(entry);
+	});
+	return roots;
+}
+/**
+* Scrolls to the block `node` (found by its ID, else by its position), flashes it and puts the caret into its first
+* text (a heading's text, a composite's title). The document is not modified.
+*/
+function revealBlockInEditor(editor, node) {
+	const { doc } = editor.state;
+	const found = node.id ? findBlockById(doc, node.id) : null;
+	const pos = found?.pos ?? node.pos;
+	if (!doc.nodeAt(pos)) return;
+	const caret = Selection.findFrom(doc.resolve(pos + 1), 1, true)?.from ?? pos + 1;
+	const chain = editor.chain().focus().setTextSelection(caret);
+	if (found && node.id) {
+		chain.run();
+		editor.commands.revealBlock(node.id);
+	} else chain.scrollIntoView().run();
+}
+//#endregion
+export { headingOutline, revealBlockInEditor };
+
+//# sourceMappingURL=heading-outline.js.map

package/dist/outline/heading-outline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"heading-outline.js","names":[],"sources":["../../src/outline/heading-outline.ts"],"sourcesContent":["import type { Editor } from '@tiptap/core'\nimport type { Node as PMNode } from '@tiptap/pm/model'\nimport { Selection } from '@tiptap/pm/state'\nimport { blockIdOf, findBlockById } from '../core/schema/block-ids'\n\n/** One heading of a document's heading outline. */\nexport interface HeadingOutlineNode {\n  /** Block ID, or `pos:<pos>` for a heading without one yet; unique within the document. */\n  key: string\n  id: string | null\n  /** Position of the heading in the document it was read from. */\n  pos: number\n  level: number\n  text: string\n  children: HeadingOutlineNode[]\n}\n\n/** The top-level headings of `doc`, a deeper heading nesting under the nearest shallower one before it; a heading without text is labelled `untitled`. */\nexport function headingOutline(doc: PMNode, untitled: string): HeadingOutlineNode[] {\n  const roots: HeadingOutlineNode[] = []\n  const stack: HeadingOutlineNode[] = []\n  doc.forEach((node, pos) => {\n    if (node.type.name !== 'heading') return\n    const id = blockIdOf(node)\n    const entry: HeadingOutlineNode = {\n      key: id ?? `pos:${pos}`,\n      id,\n      pos,\n      level: Number(node.attrs.level),\n      text: node.textContent.trim() || untitled,\n      children: [],\n    }\n    while (stack.length && stack[stack.length - 1]!.level >= entry.level) stack.pop()\n    const parent = stack[stack.length - 1]\n    if (parent) parent.children.push(entry)\n    else roots.push(entry)\n    stack.push(entry)\n  })\n  return roots\n}\n\n/**\n * Scrolls to the block `node` (found by its ID, else by its position), flashes it and puts the caret into its first\n * text (a heading's text, a composite's title). The document is not modified.\n */\nexport function revealBlockInEditor(editor: Editor, node: { id: string | null, pos: number }): void {\n  const { doc } = editor.state\n  const found = node.id ? findBlockById(doc, node.id) : null\n  const pos = found?.pos ?? node.pos\n  const block = doc.nodeAt(pos)\n  if (!block) return\n  const caret = Selection.findFrom(doc.resolve(pos + 1), 1, true)?.from ?? pos + 1\n  const chain = editor.chain().focus().setTextSelection(caret)\n  if (found && node.id) {\n    chain.run()\n    editor.commands.revealBlock(node.id)\n  }\n  else {\n    chain.scrollIntoView().run()\n  }\n}\n"],"mappings":";;;;AAkBA,SAAgB,eAAe,KAAa,UAAwC;CAClF,MAAM,QAA8B,CAAC;CACrC,MAAM,QAA8B,CAAC;CACrC,IAAI,SAAS,MAAM,QAAQ;EACzB,IAAI,KAAK,KAAK,SAAS,WAAW;EAClC,MAAM,KAAK,UAAU,IAAI;EACzB,MAAM,QAA4B;GAChC,KAAK,MAAM,OAAO;GAClB;GACA;GACA,OAAO,OAAO,KAAK,MAAM,KAAK;GAC9B,MAAM,KAAK,YAAY,KAAK,KAAK;GACjC,UAAU,CAAC;EACb;EACA,OAAO,MAAM,UAAU,MAAM,MAAM,SAAS,EAAE,CAAE,SAAS,MAAM,OAAO,MAAM,IAAI;EAChF,MAAM,SAAS,MAAM,MAAM,SAAS;EACpC,IAAI,QAAQ,OAAO,SAAS,KAAK,KAAK;OACjC,MAAM,KAAK,KAAK;EACrB,MAAM,KAAK,KAAK;CAClB,CAAC;CACD,OAAO;AACT;;;;;AAMA,SAAgB,oBAAoB,QAAgB,MAAgD;CAClG,MAAM,EAAE,QAAQ,OAAO;CACvB,MAAM,QAAQ,KAAK,KAAK,cAAc,KAAK,KAAK,EAAE,IAAI;CACtD,MAAM,MAAM,OAAO,OAAO,KAAK;CAE/B,IAAI,CADU,IAAI,OAAO,GAChB,GAAG;CACZ,MAAM,QAAQ,UAAU,SAAS,IAAI,QAAQ,MAAM,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,QAAQ,MAAM;CAC/E,MAAM,QAAQ,OAAO,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,iBAAiB,KAAK;CAC3D,IAAI,SAAS,KAAK,IAAI;EACpB,MAAM,IAAI;EACV,OAAO,SAAS,YAAY,KAAK,EAAE;CACrC,OAEE,MAAM,eAAe,CAAC,CAAC,IAAI;AAE/B"}

package/dist/outline/index.d.ts

@@ -0,0 +1,2 @@
+import { HeadingOutlineNode, headingOutline, revealBlockInEditor } from "./heading-outline.js";
+export { type HeadingOutlineNode, headingOutline, revealBlockInEditor };

package/dist/outline/index.js

@@ -0,0 +1 @@
+export { headingOutline, revealBlockInEditor } from "./heading-outline.js";

package/dist/outline/react/EditorOutline.d.ts

@@ -0,0 +1,12 @@
+import { Editor } from "@tiptap/core";
+//#region src/outline/react/EditorOutline.d.ts
+/**
+ * The heading outline of an editor, placed anywhere on the page: nested headings in a tree, clicking one reveals it in
+ * the editor (selection only, the document is never changed). Works on exactly the editor passed in (from the
+ * surface's `onReady`); a missing or destroyed editor renders an empty outline.
+ */
+export declare function EditorOutline({ editor }: {
+  editor?: Editor;
+}): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=EditorOutline.d.ts.map

package/dist/outline/react/EditorOutline.js

@@ -0,0 +1,112 @@
+import { useEditorI18n } from "../../react/use-editor-i18n.js";
+import { cn } from "../../react/ui/utils.js";
+import { Icon } from "../../react/Icon.js";
+import { headingOutline, revealBlockInEditor } from "../heading-outline.js";
+import { useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/outline/react/EditorOutline.tsx
+const REFRESH_DEBOUNCE_MS = 150;
+const HEADING_ICONS = {
+	1: "i-lucide-heading-1",
+	2: "i-lucide-heading-2",
+	3: "i-lucide-heading-3",
+	4: "i-lucide-heading-4",
+	5: "i-lucide-heading-5",
+	6: "i-lucide-heading-6"
+};
+function read(editor, t) {
+	return editor && !editor.isDestroyed ? headingOutline(editor.state.doc, t("outline.untitled")) : [];
+}
+/**
+* The heading outline of an editor, placed anywhere on the page: nested headings in a tree, clicking one reveals it in
+* the editor (selection only, the document is never changed). Works on exactly the editor passed in (from the
+* surface's `onReady`); a missing or destroyed editor renders an empty outline.
+*/
+function EditorOutline({ editor }) {
+	const { t } = useEditorI18n();
+	const [nodes, setNodes] = useState(() => read(editor, t));
+	const [collapsed, setCollapsed] = useState(/* @__PURE__ */ new Set());
+	useEffect(() => {
+		setNodes(read(editor, t));
+		if (!editor) return;
+		let timer;
+		const onTransaction = ({ transaction }) => {
+			if (!transaction.docChanged) return;
+			clearTimeout(timer);
+			timer = setTimeout(() => setNodes(read(editor, t)), REFRESH_DEBOUNCE_MS);
+		};
+		const onDestroy = () => {
+			clearTimeout(timer);
+			setNodes([]);
+		};
+		editor.on("transaction", onTransaction);
+		editor.on("destroy", onDestroy);
+		return () => {
+			clearTimeout(timer);
+			editor.off("transaction", onTransaction);
+			editor.off("destroy", onDestroy);
+		};
+	}, [editor, t]);
+	const toggle = (key) => setCollapsed((current) => {
+		const next = new Set(current);
+		if (!next.delete(key)) next.add(key);
+		return next;
+	});
+	const reveal = (node) => {
+		if (editor && !editor.isDestroyed) revealBlockInEditor(editor, node);
+	};
+	const onKeyDown = (event, node) => {
+		const parent = node.children.length > 0;
+		const open = !collapsed.has(node.key);
+		if (event.key === "Enter" || event.key === " ") reveal(node);
+		else if (event.key === "ArrowRight" && parent && !open) toggle(node.key);
+		else if (event.key === "ArrowLeft" && parent && open) toggle(node.key);
+		else return;
+		event.preventDefault();
+	};
+	const renderNodes = (list, level) => /* @__PURE__ */ jsx("ul", {
+		role: level === 0 ? "tree" : "group",
+		"aria-label": level === 0 ? t("outline.label") : void 0,
+		className: cn("m-0 list-none p-0 text-sm", level > 0 && "ml-3 border-l border-border pl-1"),
+		children: list.map((node) => {
+			const parent = node.children.length > 0;
+			const open = !collapsed.has(node.key);
+			return /* @__PURE__ */ jsxs("li", {
+				role: "none",
+				children: [/* @__PURE__ */ jsxs("div", {
+					role: "treeitem",
+					tabIndex: 0,
+					"aria-level": level + 1,
+					"aria-expanded": parent ? open : void 0,
+					className: "group flex w-full cursor-pointer items-center gap-1.5 rounded-md px-2 py-1 text-sm select-none outline-none hover:bg-muted/60 focus-visible:ring-1 focus-visible:ring-ring",
+					onClick: () => reveal(node),
+					onKeyDown: (event) => onKeyDown(event, node),
+					children: [
+						parent ? /* @__PURE__ */ jsx("span", {
+							className: "flex shrink-0",
+							onClick: (event) => {
+								event.stopPropagation();
+								toggle(node.key);
+							},
+							children: /* @__PURE__ */ jsx(Icon, {
+								name: "i-lucide-chevron-right",
+								className: cn("size-3.5 text-muted-foreground transition-transform", open && "rotate-90")
+							})
+						}) : /* @__PURE__ */ jsx("span", { className: "size-3.5 shrink-0" }),
+						/* @__PURE__ */ jsx(Icon, { name: HEADING_ICONS[node.level] ?? "i-lucide-heading" }),
+						/* @__PURE__ */ jsx("span", {
+							className: "min-w-0 flex-1 truncate",
+							title: node.text,
+							children: node.text
+						})
+					]
+				}), parent && open && renderNodes(node.children, level + 1)]
+			}, node.key);
+		})
+	});
+	return renderNodes(nodes, 0);
+}
+//#endregion
+export { EditorOutline };
+
+//# sourceMappingURL=EditorOutline.js.map

package/dist/outline/react/EditorOutline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorOutline.js","names":[],"sources":["../../../src/outline/react/EditorOutline.tsx"],"sourcesContent":["import type { Editor } from '@tiptap/core'\nimport { type KeyboardEvent, useEffect, useState } from 'react'\nimport { Icon } from '../../react/Icon'\nimport { useEditorI18n } from '../../react/use-editor-i18n'\nimport { cn } from '../../react/ui/utils'\nimport type { Translate } from '../../i18n'\nimport { type HeadingOutlineNode, headingOutline, revealBlockInEditor } from '../heading-outline'\n\nconst REFRESH_DEBOUNCE_MS = 150\n\n// Spelled out (not built from the level) so bundlers that scan source for icon names find them.\nconst HEADING_ICONS: Record<number, string> = {\n  1: 'i-lucide-heading-1',\n  2: 'i-lucide-heading-2',\n  3: 'i-lucide-heading-3',\n  4: 'i-lucide-heading-4',\n  5: 'i-lucide-heading-5',\n  6: 'i-lucide-heading-6',\n}\n\nfunction read(editor: Editor | undefined, t: Translate): HeadingOutlineNode[] {\n  return editor && !editor.isDestroyed ? headingOutline(editor.state.doc, t('outline.untitled')) : []\n}\n\n/**\n * The heading outline of an editor, placed anywhere on the page: nested headings in a tree, clicking one reveals it in\n * the editor (selection only, the document is never changed). Works on exactly the editor passed in (from the\n * surface's `onReady`); a missing or destroyed editor renders an empty outline.\n */\nexport function EditorOutline({ editor }: { editor?: Editor }) {\n  const { t } = useEditorI18n()\n  // Read from the editor on demand and refreshed, debounced, when the document changes (also an external `setContent`).\n  const [nodes, setNodes] = useState<HeadingOutlineNode[]>(() => read(editor, t))\n  // Entries start open: only the ones the user closed are remembered.\n  const [collapsed, setCollapsed] = useState<ReadonlySet<string>>(new Set())\n\n  useEffect(() => {\n    setNodes(read(editor, t))\n    if (!editor) return\n    let timer: ReturnType<typeof setTimeout> | undefined\n    const onTransaction = ({ transaction }: { transaction: { docChanged: boolean } }) => {\n      if (!transaction.docChanged) return\n      clearTimeout(timer)\n      timer = setTimeout(() => setNodes(read(editor, t)), REFRESH_DEBOUNCE_MS)\n    }\n    const onDestroy = () => {\n      clearTimeout(timer)\n      setNodes([])\n    }\n    editor.on('transaction', onTransaction)\n    editor.on('destroy', onDestroy)\n    return () => {\n      clearTimeout(timer)\n      editor.off('transaction', onTransaction)\n      editor.off('destroy', onDestroy)\n    }\n  }, [editor, t])\n\n  const toggle = (key: string) => setCollapsed((current) => {\n    const next = new Set(current)\n    if (!next.delete(key)) next.add(key)\n    return next\n  })\n\n  const reveal = (node: HeadingOutlineNode) => {\n    if (editor && !editor.isDestroyed) revealBlockInEditor(editor, node)\n  }\n\n  const onKeyDown = (event: KeyboardEvent, node: HeadingOutlineNode) => {\n    const parent = node.children.length > 0\n    const open = !collapsed.has(node.key)\n    if (event.key === 'Enter' || event.key === ' ') reveal(node)\n    else if (event.key === 'ArrowRight' && parent && !open) toggle(node.key)\n    else if (event.key === 'ArrowLeft' && parent && open) toggle(node.key)\n    else return\n    event.preventDefault()\n  }\n\n  const renderNodes = (list: readonly HeadingOutlineNode[], level: number) => (\n    <ul role={level === 0 ? 'tree' : 'group'} aria-label={level === 0 ? t('outline.label') : undefined} className={cn('m-0 list-none p-0 text-sm', level > 0 && 'ml-3 border-l border-border pl-1')}>\n      {list.map((node) => {\n        const parent = node.children.length > 0\n        const open = !collapsed.has(node.key)\n        return (\n          <li key={node.key} role=\"none\">\n            <div\n              role=\"treeitem\"\n              tabIndex={0}\n              aria-level={level + 1}\n              aria-expanded={parent ? open : undefined}\n              className=\"group flex w-full cursor-pointer items-center gap-1.5 rounded-md px-2 py-1 text-sm select-none outline-none hover:bg-muted/60 focus-visible:ring-1 focus-visible:ring-ring\"\n              onClick={() => reveal(node)}\n              onKeyDown={event => onKeyDown(event, node)}\n            >\n              {parent\n                ? (\n                    // The chevron toggles, a click elsewhere on the row reveals.\n                    <span\n                      className=\"flex shrink-0\"\n                      onClick={(event) => {\n                        event.stopPropagation()\n                        toggle(node.key)\n                      }}\n                    >\n                      <Icon name=\"i-lucide-chevron-right\" className={cn('size-3.5 text-muted-foreground transition-transform', open && 'rotate-90')} />\n                    </span>\n                  )\n                : <span className=\"size-3.5 shrink-0\" />}\n              <Icon name={HEADING_ICONS[node.level] ?? 'i-lucide-heading'} />\n              <span className=\"min-w-0 flex-1 truncate\" title={node.text}>{node.text}</span>\n            </div>\n            {parent && open && renderNodes(node.children, level + 1)}\n          </li>\n        )\n      })}\n    </ul>\n  )\n\n  return renderNodes(nodes, 0)\n}\n"],"mappings":"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"}

package/dist/outline/react.d.ts

@@ -0,0 +1,2 @@
+import { EditorOutline } from "./react/EditorOutline.js";
+export { EditorOutline };

package/dist/outline/react.js

@@ -0,0 +1 @@
+export { EditorOutline } from "./react/EditorOutline.js";

package/dist/outline/vue.d.ts

@@ -0,0 +1,2 @@
+import _default from "./EditorOutline.vue.js";
+export { _default as EditorOutline };

package/dist/outline/vue.js

@@ -0,0 +1 @@
+export { default as EditorOutline } from "./EditorOutline.js";

package/dist/presets/advanced.d.ts

@@ -0,0 +1,33 @@
+import { EditorFeature, EditorPreset } from "../core/feature.js";
+import { CompositeKind } from "../features/composites/kinds.js";
+import { CompositeFeatureOptions } from "../features/composites/feature.js";
+//#region src/presets/advanced.d.ts
+/** Options of the advanced editor presets (`advancedEditor` of `./vue/advanced` and `./react/advanced`). */
+export interface AdvancedEditorOptions {
+  /** The composite kinds („Bausteine“) offered in the editor (default: the built-in `defaultCompositeKinds(t)`); read once. */
+  compositeKinds?: readonly CompositeKind[];
+}
+/**
+ * The feature ids of the advanced editor in schema order: core, media, transcript, composites, mentions, authors,
+ * comments, AI, collaboration, block UI, the three integrations (composite-media, composite-AI, transcript-AI) and
+ * themes last, in the order of the schema-bearing extensions of the advanced document model.
+ */
+export declare const ADVANCED_FEATURE_IDS: readonly ["core", "media", "transcript", "composites", "mentions", "authors", "comments", "ai", "collab", "block-ui", "composite-media", "composite-ai", "transcript-ai", "themes"];
+export type AdvancedFeatureId = (typeof ADVANCED_FEATURE_IDS)[number];
+/** The ids a UI layer binds (components, node views, hooks); the other advanced features are framework-free. */
+export type UiBoundFeatureId = Exclude<AdvancedFeatureId, 'core' | 'mentions' | 'composite-media' | 'composite-ai' | 'transcript-ai'>;
+/**
+ * The features a UI layer binds, keyed by their id; a layer must bind every one (the compiler enforces it).
+ * `composites` is the layer's `compositeFeature`: `advancedEditorCore` calls it with the options' `compositeKinds`.
+ */
+export type AdvancedFeatures<C> = Record<Exclude<UiBoundFeatureId, 'composites'>, EditorFeature<C>> & {
+  composites: (options: CompositeFeatureOptions) => EditorFeature<C>;
+};
+/**
+ * Assembles the advanced editor from the features a UI layer has bound plus the framework-free ones (core, mentions and
+ * the integrations composite-media, composite-AI, transcript-AI), in `ADVANCED_FEATURE_IDS` order (the feature list
+ * order is the schema and toolbar order). `C` is the layer's component type.
+ */
+export declare function advancedEditorCore<C>(bound: AdvancedFeatures<C>, options?: AdvancedEditorOptions): EditorPreset<C>;
+//#endregion
+//# sourceMappingURL=advanced.d.ts.map

package/dist/presets/advanced.js

@@ -0,0 +1,50 @@
+import { coreFeature } from "../core/core-feature.js";
+import { defineEditor } from "../core/define-editor.js";
+import { mentionsFeature } from "../features/mentions/index.js";
+import { compositeAiFeature } from "../integrations/composite-ai/index.js";
+import { compositeMediaFeature } from "../integrations/composite-media/index.js";
+import { transcriptAiFeature } from "../integrations/transcript-ai/index.js";
+//#region src/presets/advanced.ts
+/**
+* The feature ids of the advanced editor in schema order: core, media, transcript, composites, mentions, authors,
+* comments, AI, collaboration, block UI, the three integrations (composite-media, composite-AI, transcript-AI) and
+* themes last, in the order of the schema-bearing extensions of the advanced document model.
+*/
+const ADVANCED_FEATURE_IDS = [
+	"core",
+	"media",
+	"transcript",
+	"composites",
+	"mentions",
+	"authors",
+	"comments",
+	"ai",
+	"collab",
+	"block-ui",
+	"composite-media",
+	"composite-ai",
+	"transcript-ai",
+	"themes"
+];
+/**
+* Assembles the advanced editor from the features a UI layer has bound plus the framework-free ones (core, mentions and
+* the integrations composite-media, composite-AI, transcript-AI), in `ADVANCED_FEATURE_IDS` order (the feature list
+* order is the schema and toolbar order). `C` is the layer's component type.
+*/
+function advancedEditorCore(bound, options = {}) {
+	const { composites, ...uiBound } = bound;
+	const features = {
+		...uiBound,
+		"core": coreFeature(),
+		"mentions": mentionsFeature(),
+		"composites": composites(options.compositeKinds ? { kinds: options.compositeKinds } : {}),
+		"composite-media": compositeMediaFeature(),
+		"composite-ai": compositeAiFeature(),
+		"transcript-ai": transcriptAiFeature()
+	};
+	return defineEditor({ features: ADVANCED_FEATURE_IDS.map((id) => features[id]) });
+}
+//#endregion
+export { ADVANCED_FEATURE_IDS, advancedEditorCore };
+
+//# sourceMappingURL=advanced.js.map

package/dist/presets/advanced.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"advanced.js","names":[],"sources":["../../src/presets/advanced.ts"],"sourcesContent":["import { coreFeature } from '../core/core-feature'\nimport { defineEditor } from '../core/define-editor'\nimport type { EditorFeature, EditorPreset } from '../core/feature'\nimport type { CompositeFeatureOptions } from '../features/composites/feature'\nimport type { CompositeKind } from '../features/composites/kinds'\nimport { mentionsFeature } from '../features/mentions'\nimport { compositeAiFeature } from '../integrations/composite-ai'\nimport { compositeMediaFeature } from '../integrations/composite-media'\nimport { transcriptAiFeature } from '../integrations/transcript-ai'\n\n/** Options of the advanced editor presets (`advancedEditor` of `./vue/advanced` and `./react/advanced`). */\nexport interface AdvancedEditorOptions {\n  /** The composite kinds („Bausteine“) offered in the editor (default: the built-in `defaultCompositeKinds(t)`); read once. */\n  compositeKinds?: readonly CompositeKind[]\n}\n\n/**\n * The feature ids of the advanced editor in schema order: core, media, transcript, composites, mentions, authors,\n * comments, AI, collaboration, block UI, the three integrations (composite-media, composite-AI, transcript-AI) and\n * themes last, in the order of the schema-bearing extensions of the advanced document model.\n */\nexport const ADVANCED_FEATURE_IDS = [\n  'core',\n  'media',\n  'transcript',\n  'composites',\n  'mentions',\n  'authors',\n  'comments',\n  'ai',\n  'collab',\n  'block-ui',\n  'composite-media',\n  'composite-ai',\n  'transcript-ai',\n  'themes',\n] as const\n\nexport type AdvancedFeatureId = (typeof ADVANCED_FEATURE_IDS)[number]\n\n/** The ids a UI layer binds (components, node views, hooks); the other advanced features are framework-free. */\nexport type UiBoundFeatureId = Exclude<AdvancedFeatureId, 'core' | 'mentions' | 'composite-media' | 'composite-ai' | 'transcript-ai'>\n\n/**\n * The features a UI layer binds, keyed by their id; a layer must bind every one (the compiler enforces it).\n * `composites` is the layer's `compositeFeature`: `advancedEditorCore` calls it with the options' `compositeKinds`.\n */\nexport type AdvancedFeatures<C> = Record<Exclude<UiBoundFeatureId, 'composites'>, EditorFeature<C>> & {\n  composites: (options: CompositeFeatureOptions) => EditorFeature<C>\n}\n\n/**\n * Assembles the advanced editor from the features a UI layer has bound plus the framework-free ones (core, mentions and\n * the integrations composite-media, composite-AI, transcript-AI), in `ADVANCED_FEATURE_IDS` order (the feature list\n * order is the schema and toolbar order). `C` is the layer's component type.\n */\nexport function advancedEditorCore<C>(bound: AdvancedFeatures<C>, options: AdvancedEditorOptions = {}): EditorPreset<C> {\n  const { composites, ...uiBound } = bound\n  const features: Record<AdvancedFeatureId, EditorFeature<C>> = {\n    ...uiBound,\n    'core': coreFeature(),\n    'mentions': mentionsFeature(),\n    'composites': composites(options.compositeKinds ? { kinds: options.compositeKinds } : {}),\n    'composite-media': compositeMediaFeature(),\n    'composite-ai': compositeAiFeature(),\n    'transcript-ai': transcriptAiFeature(),\n  }\n  return defineEditor({ features: ADVANCED_FEATURE_IDS.map(id => features[id]) })\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,uBAAuB;CAClC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;;;;;AAoBA,SAAgB,mBAAsB,OAA4B,UAAiC,CAAC,GAAoB;CACtH,MAAM,EAAE,YAAY,GAAG,YAAY;CACnC,MAAM,WAAwD;EAC5D,GAAG;EACH,QAAQ,YAAY;EACpB,YAAY,gBAAgB;EAC5B,cAAc,WAAW,QAAQ,iBAAiB,EAAE,OAAO,QAAQ,eAAe,IAAI,CAAC,CAAC;EACxF,mBAAmB,sBAAsB;EACzC,gBAAgB,mBAAmB;EACnC,iBAAiB,oBAAoB;CACvC;CACA,OAAO,aAAa,EAAE,UAAU,qBAAqB,KAAI,OAAM,SAAS,GAAG,EAAE,CAAC;AAChF"}

package/dist/presets/simple.d.ts

@@ -0,0 +1,9 @@
+import { EditorPreset } from "../core/feature.js";
+//#region src/presets/simple.d.ts
+/**
+ * The simple editor: the core feature only (formatting, headings, lists, quotes, code, undo/redo). No backend, no AI,
+ * no collaboration. Component-free (`EditorPreset<never>`), so both the Vue and the React surface accept it.
+ */
+export declare const simpleEditor: () => EditorPreset<never>;
+//#endregion
+//# sourceMappingURL=simple.d.ts.map

package/dist/presets/simple.js

@@ -0,0 +1,12 @@
+import { coreFeature } from "../core/core-feature.js";
+import { defineEditor } from "../core/define-editor.js";
+//#region src/presets/simple.ts
+/**
+* The simple editor: the core feature only (formatting, headings, lists, quotes, code, undo/redo). No backend, no AI,
+* no collaboration. Component-free (`EditorPreset<never>`), so both the Vue and the React surface accept it.
+*/
+const simpleEditor = () => defineEditor({ features: [coreFeature()] });
+//#endregion
+export { simpleEditor };
+
+//# sourceMappingURL=simple.js.map

package/dist/presets/simple.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"simple.js","names":[],"sources":["../../src/presets/simple.ts"],"sourcesContent":["import { coreFeature } from '../core/core-feature'\nimport { defineEditor } from '../core/define-editor'\nimport type { EditorPreset } from '../core/feature'\n\n/**\n * The simple editor: the core feature only (formatting, headings, lists, quotes, code, undo/redo). No backend, no AI,\n * no collaboration. Component-free (`EditorPreset<never>`), so both the Vue and the React surface accept it.\n */\nexport const simpleEditor = (): EditorPreset<never> => defineEditor({ features: [coreFeature()] })\n"],"mappings":";;;;;;;AAQA,MAAa,qBAA0C,aAAa,EAAE,UAAU,CAAC,YAAY,CAAC,EAAE,CAAC"}

package/dist/react/AdvancedEditor.d.ts

@@ -0,0 +1,23 @@
+import { EditorSurfaceHandle, EditorSurfaceProps } from "./EditorSurface.js";
+import { CompositeKind } from "../features/composites/kinds.js";
+//#region src/react/AdvancedEditor.d.ts
+/**
+ * Props of the advanced editor: the surface's own (collaboration session or standalone `value`/`onChange`, metadata,
+ * abilities, extensions, block actions, slash commands, `documentId`/`upload`, `editable`, `settingsUi`, the open
+ * state of the sidebar and comments margin, `onReady` and the other callbacks) except the preset, which the advanced
+ * editor owns, plus the composite kinds.
+ */
+export interface AdvancedEditorProps extends Omit<EditorSurfaceProps, 'preset'> {
+  /** Composite kinds („Bausteine“) offered in the editor (default: `defaultCompositeKinds(t)`); read once at mount. */
+  compositeKinds?: readonly CompositeKind[];
+}
+/**
+ * The advanced editor on the React surface: `advancedEditor()` mounted through `EditorSurface`. The feature list is
+ * fixed at mount like the kinds it is built from; hosts remount (`key`) to change either. Place `EditorToolbar`
+ * (with the same `preset`: build it with `advancedEditor()` and pass it to both) and, with `settingsUi: 'external'`,
+ * `EditorSettingsModal`/`EditorSettingsPanel` beside it; `useEditorUi(editor)` reaches the chrome of a ready editor.
+ * Collaboration is active only when a `collaboration` session is passed; mount `Toaster` once for notices.
+ */
+export declare const AdvancedEditor: import("react").ForwardRefExoticComponent<AdvancedEditorProps & import("react").RefAttributes<EditorSurfaceHandle>>;
+//#endregion
+//# sourceMappingURL=AdvancedEditor.d.ts.map

package/dist/react/AdvancedEditor.js

@@ -0,0 +1,24 @@
+import { EditorSurface } from "./EditorSurface.js";
+import { advancedEditor } from "./advanced-preset.js";
+import { forwardRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/react/AdvancedEditor.tsx
+/**
+* The advanced editor on the React surface: `advancedEditor()` mounted through `EditorSurface`. The feature list is
+* fixed at mount like the kinds it is built from; hosts remount (`key`) to change either. Place `EditorToolbar`
+* (with the same `preset`: build it with `advancedEditor()` and pass it to both) and, with `settingsUi: 'external'`,
+* `EditorSettingsModal`/`EditorSettingsPanel` beside it; `useEditorUi(editor)` reaches the chrome of a ready editor.
+* Collaboration is active only when a `collaboration` session is passed; mount `Toaster` once for notices.
+*/
+const AdvancedEditor = forwardRef(function AdvancedEditor({ compositeKinds, ...surface }, ref) {
+	const [preset] = useState(() => advancedEditor(compositeKinds ? { compositeKinds } : {}));
+	return /* @__PURE__ */ jsx(EditorSurface, {
+		ref,
+		preset,
+		...surface
+	});
+});
+//#endregion
+export { AdvancedEditor };
+
+//# sourceMappingURL=AdvancedEditor.js.map

package/dist/react/AdvancedEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdvancedEditor.js","names":[],"sources":["../../src/react/AdvancedEditor.tsx"],"sourcesContent":["import { forwardRef, useState } from 'react'\nimport type { CompositeKind } from '../features/composites/kinds'\nimport { advancedEditor } from './advanced-preset'\nimport { EditorSurface, type EditorSurfaceHandle, type EditorSurfaceProps } from './EditorSurface'\n\n/**\n * Props of the advanced editor: the surface's own (collaboration session or standalone `value`/`onChange`, metadata,\n * abilities, extensions, block actions, slash commands, `documentId`/`upload`, `editable`, `settingsUi`, the open\n * state of the sidebar and comments margin, `onReady` and the other callbacks) except the preset, which the advanced\n * editor owns, plus the composite kinds.\n */\nexport interface AdvancedEditorProps extends Omit<EditorSurfaceProps, 'preset'> {\n  /** Composite kinds („Bausteine“) offered in the editor (default: `defaultCompositeKinds(t)`); read once at mount. */\n  compositeKinds?: readonly CompositeKind[]\n}\n\n/**\n * The advanced editor on the React surface: `advancedEditor()` mounted through `EditorSurface`. The feature list is\n * fixed at mount like the kinds it is built from; hosts remount (`key`) to change either. Place `EditorToolbar`\n * (with the same `preset`: build it with `advancedEditor()` and pass it to both) and, with `settingsUi: 'external'`,\n * `EditorSettingsModal`/`EditorSettingsPanel` beside it; `useEditorUi(editor)` reaches the chrome of a ready editor.\n * Collaboration is active only when a `collaboration` session is passed; mount `Toaster` once for notices.\n */\nexport const AdvancedEditor = forwardRef<EditorSurfaceHandle, AdvancedEditorProps>(function AdvancedEditor({ compositeKinds, ...surface }, ref) {\n  const [preset] = useState(() => advancedEditor(compositeKinds ? { compositeKinds } : {}))\n  return <EditorSurface ref={ref} preset={preset} {...surface} />\n})\n"],"mappings":";;;;;;;;;;;;AAuBA,MAAa,iBAAiB,WAAqD,SAAS,eAAe,EAAE,gBAAgB,GAAG,WAAW,KAAK;CAC9I,MAAM,CAAC,UAAU,eAAe,eAAe,iBAAiB,EAAE,eAAe,IAAI,CAAC,CAAC,CAAC;CACxF,OAAO,oBAAC,eAAD;EAAoB;EAAa;EAAQ,GAAI;CAAU,CAAA;AAChE,CAAC"}

package/dist/react/EditorSettingsModal.d.ts

@@ -0,0 +1,14 @@
+import { ReactPreset } from "./EditorSurface.js";
+//#region src/react/EditorSettingsModal.d.ts
+/** „Einstellungen“: `EditorSettingsPanel` in a modal. Renders nothing when the preset contributes no settings tab. */
+export declare function EditorSettingsModal({ preset, open, onOpenChange, tab, onTabChange }: {
+  /** The preset whose features contribute the tabs (the surface's `preset`). */
+  preset: ReactPreset;
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  /** Shown tab id (see `EditorSettingsPanel`). */
+  tab?: string;
+  onTabChange?: (tab: string) => void;
+}): import("react").JSX.Element | null;
+//#endregion
+//# sourceMappingURL=EditorSettingsModal.d.ts.map